Chaining lựa chọn với Chosen

Question

Tôi đang cố gắng để lựa chọn chuỗi với Chosen và Chained nhưng tôi không chắc chắn nếu tôi đang thực hiện .chosen(). Change() một cách chính xác hoặc nếu lỗi tôi nhận được là một lỗi.

Đây là những gì tôi đã có:

<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"); 
}); 

mà mang lại cho tôi của router RangeError: kích thước gọi stack tối đa vượt quá.

EDIT: Tôi hiện cũng cần phải ẩn/hiển thị một trường khác nếu một tùy chọn cụ thể được chọn và tôi không chắc chắn cách tiếp cận chính xác là gì.

Answer 1

Sử dụng ví dụ từ tài liệu Chained Tôi đã đặt một example on jsfiddle.

Và nó thực sự khá đơn giản, chỉ cần khởi Chained và Chosen như bạn vẫn thường làm, và sau đó kích hoạt các sự kiện chosen:updated nếu một trong những thay đổi Selects:

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

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

EDIT:

Đối với câu hỏi thứ hai của bạn, tôi đã cập nhật fiddle một chút: http://jsfiddle.net/koenpunt/Fzh9G/2/

Lựa chọn gửi tùy chọn được chọn cùng với sự kiện thay đổi, vì vậy hãy kiểm tra xem một optio cụ thể n được chọn là dễ dàng:

$('#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(); 
     } 
    } 
}); 

Như bạn sẽ thấy, nếu bạn chọn 'Audi' và 'A5' nút sẽ biến mất.