5

ChosenとChainedで select をチェーンしようとしていますが、 .chosen().change() を正しく実装しているかどうか、またはエラーがバグであるかどうかはわかりません。

これが私が持っているものです：

<select id="Inputfield_date" name="date" data-placeholder="Select event date">
<option value=""></option>
<option value="WA">WA</option>
<option value="QLD">QLD</option>
<option value="VIC">VIC</option>
<option value="NSW">NSW</option>
<option value="SA">SA</option>
</select>

<select id="Inputfield_code" name="code" data-placeholder="Response code">
<option value=""></option>
<option value="601" class="WA">601</option>
<option value="602" class="WA">602</option>
<option value="402" class="QLD">402</option>
<option value="403" class="QLD">403</option>
<option value="301" class="VIC">301</option>
<option value="302" class="VIC">302</option>
<option value="201" class="NSW">201</option>
<option value="203" class="NSW">203</option>
<option value="501" class="SA">501</option>
</select>

$('#Inputfield_date').chosen().change(function() {
    $("#Inputfield_code").chained("#Inputfield_date");
});

Uncaught RangeError : Maximum call stack size exceeded が表示されます。

編集:特定のオプションが選択されている場合、別のフィールドを非表示/表示する必要があり、そのための正しいアプローチが何であるかわかりません。

4

1 に答える 1

8

Chained ドキュメントの例を使用して、jsfiddle に例を掲載しました。

実際にはかなり単純です。通常どおり Chained と Chosen を初期化しchosen:updated、select の 1 つが変更された場合にイベントをトリガーします。

var selects = $('#Inputfield_code, #Inputfield_date');
$('#Inputfield_code').chained('#Inputfield_date');
selects.chosen({width: '300px'})

selects.on('change', function(){
    selects.trigger('chosen:updated');
});

編集：

2 番目の質問については、フィドルを少し更新しました: http://jsfiddle.net/koenpunt/Fzh9G/2/

Chosen は、どのオプションが選択されているかを change イベントと共に送信するため、特定のオプションが選択されているかどうかを簡単に確認できます。

$('#series').on('change', function(event, data){
    // First check if data exists, because if the change event
    // isn't triggered by Chosen `data` is undefined
    if(data){ 
        if(data.selected == 'a5'){
            $('#submit').hide();
        }else{
            $('#submit').show();
        }
    }
});

お気づきのように、「Audi」と「A5」を選択すると、ボタンが消えます。

于 2013-08-28T08:10:33.777 に答える