0

重複の可能性:
ドロップダウンが動的に生成されている場合、ドロップダウンのオプションを変更するにはどうすればよいですか?

いくつかのドロップダウン メニューとテキスト入力フィールドを生成できるこの JSFIDDLE を使用しています。それが何をするかについて具体的に言うと、1セット= 3つのドロップダウンと1つのテキスト入力フィールドであるいくつかの入力フィールドのセットを動的に生成します。PHPを使用してデータベースに送信されるWebフォームで、最大15個のこれらを生成するために使用しています。

ここにフィドルがあります

私がする必要があるのはこれです：
上にリンクされたこのjsfiddleで、誰かが5を選択して[追加]ボタンをクリックすると、5セットの入力が動的に生成されるとしましょう.1セット= 3ドロップダウン+ 1テキスト入力フィールドと1削除ボタンその特定のセットを削除します。セット 1 を見てみましょう。ユーザーがこのセットの最初のドロップダウンで何かを選択すると、同じセットの残りの 2 つのドロップダウンで使用可能なオプションが変更されます。(つまり、最初のドロップダウンで選択した件名に応じて、残りのドロップダウン メニューのオプションを変更する必要があります。)

作業中の jsfiddle で何をしたいかの例については、このチェーン ドロップダウンを参照してください。

私は一度も JavaScript を使用したことがありません。これは、Web フォームで問題に直面している唯一の JavaScript 部分です。助けが必要

4

3 に答える 3

1

次のコードを追加して、次の 2 つの選択を最初の選択で選択した値に変更します。

$('#dropbox').on('change', 'select', function() {
    if (! $(this).prev().length) { //if this is the first select
        val = $(this).val();//take value of first select
        $(this).next().val(val);       //and set it to the
        $(this).next().next().val(val);//two next selects
    }
})​;

私の作業デモを見る

更新:
したがって、OP コメントの後に、前の例のように既存のものから選択するだけでなく、次の 2 つの選択のオプションを置き換える例をここに追加します。

$('#dropbox').on('change', 'select', function() {
    if (! $(this).prev().length) { //if this is the first select
        //val = $(this).val();//take value of first select
        $(this).next().html($("<option>").val("0").text("NEW OPT 1").add( $("<option>").val("1").text("NEW OPT2")));
        $(this).next().next().html($("<option>").val("0").text("GOOD OPT 1").add( $("<option>").val("1").text("GOOD OPT2")));
    }
});

ライブデモをご覧ください。

于 2012-10-13T15:43:39.863 に答える
0

ここで、リンク-カスケードではなく、次のものだけを実行しますが、別の.each（：

$(function() {
    $("select[id!=sel]").live('change',function(e) {
        selectedValue = $(this).find(":selected").val()
        if ($(this).next().attr('name').match(/input[0-9]_[0-9]/)) {
            $(this).next().find('option').each(function() {
                if ($(this).val() == selectedValue) {
                    $(this).hide();
                } else {
                    $(this).show();
                }
            })
        }
    })
})
于 2012-10-13T16:50:04.203 に答える
0

これらのいずれかが変更されたときに、各選択を行の同じ値に変更したいということを正しく理解していれば、このデモはあなたが望むことをすると思います

http://jsfiddle.net/E3gWX/1/

編集：

あなたの元のコンセプトは、依存連鎖選択にはあまりにも原始的でした。これは、必要なものにもっと近づくデモです http://jsfiddle.net/Ywzjv/2​​/

于 2012-10-13T15:28:47.393 に答える