web-dev-qa-db-ja.com

選択したドロップダウンを読み取り専用にする（無効にしない）

chosen ドロップダウンメニューを読み取り専用にすることを検討しています。これは、jQueryセレクターを使用して動的に行う必要があります。以下を使用して無効に設定した場合：

$("#dropdownDepartment").attr("disabled","disabled").trigger('chosen:updated');

値はPOSTされていませんが、POSTする必要があります。

私が試してみました

$("#dropdownDepartment").attr('readonly',true).trigger('chosen:updated');

しかし、これは機能しません。

Chosen v1.4.2とjQuery v2.1.4を使用しています。

感謝します！ありがとうございました。

javascriptjqueryjquery-chosen
9
Robin

私にとって最善の解決策は、そのような醜いトリック$("#dropdownDepartment").prop('disabled',true).trigger('chosen:updated').prop('disabled',false)でした。そのため、chooseは無効になりますが、selectの値はPOSTされます。

5
Илья Стельмаков

あなたができるいくつかのオプションがあります。

  • ドロップダウンを無効にし、値を非表示フィールドに保存して、POSTで送信します。

  • 他のすべての選択を無効にして、選択した1つだけが有効になるようにします

    $('#dropdownDepartment option:not(:selected)').attr('disabled', true);
  • ドロップダウンを無効にし、投稿を行う前に有効にします
  • 無効にしたい場合は、読み取り専用のテキストボックスに変えてください
4
George

これを試して：-

var select = $('select');
var oldVal=$('select').val();
select.chosen().on('change',function(e){   
     select.val(oldVal);
   select.trigger("chosen:updated");  
});

デモ

4
user3819192

同時に回避策があります。だから、それが将来誰かを助けることを願っています（私はあなたがすでに解決策をしたと思います）。

まず、選択した選択の選択したオプション値を、次のような非表示の入力に出力します。ために $_POST valueは、この非表示の入力から値を取得します$_POST['myselect']：

<input type="hidden" name="myselect" value="selected_option_value_goes_here" />

次に、選択した選択を無効にします。ただし、非表示の入力値を無効にする前に、現在の値に設定しても安全です。

$('input[name=myselect]').val($(".chosen-select").val());   
$('.chosen-select').attr("disabled", true).trigger("chosen:updated");

N.B.無効にしたくない場合は、選択した選択の変更イベントで非表示の入力の値を更新する必要はありません。

動作するデモはここをクリックして見つけることができます。

2
Siddiqui Noor

パーティーに遅れるかもしれませんが、OPと同じ問題に遭遇しました。値が無効になっている場合でも値をポストバックすることがわかった回避策は、フォームの送信時に値を再度有効にすることです。

$("form").bind("submit", function () {
    $("#TheList *").prop("disabled", false).trigger("chosen:updated");
});

TheListの後の[space] [star]に注意してください。これは、リスト内の各子を再帰的に再度有効にするためのものです。

1
Soader03