0

さて、私は何をする必要があるかを知っています...私はそれを書く方法を理解できません。基本的に、カテゴリ (色、数字、文字など) のテーブルを含む親ページがあります。これらのカテゴリはテーブルの親です。息子は、赤、青、56、72、abc、def などです。このテーブルに新しい行を追加するためのドロップダウン付きの nyroModal ダイアログ ポップアップがあります。保存ボタンをクリックすると、正しい「父」の下ではなく、正しいドロップダウン値が親テーブルに追加され、新しい行が正常に追加されました。テーブルの最後に追加するだけです。ポップアップのドロップダウンの 1 つは、父のカテゴリ (select name="chooseFather") へのオプションを保持します。これは、渡す方法がわからない唯一の値です。

<select name="chooseFather">
<option value="Colors" id="father3">Colors</option>
<option value="Numbers" id="father4">Numbers</option>
<option value="Letters" id="father5">Letters</option>
</select>

親ドロップダウン値のそれぞれには、親行の ID と一致する個別の ID があります。$(“#parentId”).children().add(your new children)選択したドロップダウン値を取得し、テーブルの対応する部分に正しい子の値を配置するには、動的バージョンのようなものが必要です。私の値を親テーブル/ページに転送する保存ボタンのコードは次のとおりです。

("img.save").click(function () {            

            for(var j=0;j<document.getElementsByName("shoreInfo").length;j++) {
                parent.updateParent1(document.getElementsByName("select1").item(j).value + '&nbsp;' +
                                     document.getElementsByName("text1").item(j).value + '&nbsp; - ' +
                                     document.getElementsByName("select2").item(j).value,
                                     document.getElementsByName("chooseFather").item(j).value);

            }
            parent.$.nmTop().close();
        });
4

1 に答える 1

1

次のように html を少しモジュール化するとします。

<div class="widget_group">    
    <h3>Colors</h3>
    <table id="Colors"></table>
</div>

<div class="widget_group">    
    <h3>Numbers</h3>
    <table id="Numbers"></table>
</div>

次に、最初の選択の値を使用して、必要なテーブル ID をターゲットにすることができます。

また、アクセスしたい重要な要素に ID を追加すると、コードが簡素化されることにも注意してください

<select  value="3" id="chooseFather">

jQueryを使用して行を追加する:

$("img.save").click(function () {
    if( !validateSelections()){
        alert('select one of each');
        return;
    }

    /* note that ID attribute was added to each "select"*/
   var tableID= $('#chooseFather').val();
    var newRow='<tr><td>'+$('#select1').val()+'</td><td>'+$('#select2').val()+'</td></tr>';

    $('#'+ tableID).append( newRow)

});


function validateSelections(){
    return $('#chooseFather').val() && $('#select1').val() && $('#select2').val();
}

デモ: http://jsfiddle.net/xXeGx/1/

また、font タグの使用は非推奨です。代わりに要素に追加されたクラスと css を使用してください

于 2013-01-21T15:56:04.360 に答える