1

示唆的なフォーム フィールドに jquery select2 プラグインを使用しています。元の隠し入力フィールドのデータ属性に保存されているデータにアクセスしようとしています。Ajax 経由で php スクリプトに送信できるように、これらの属性からのデータが必要です。これがどのように行われるかについて誰か提案がありますか? Googleまたは公式Webサイトで回答が見つからないようです。

ありがとう

4

4 に答える 4

2

ドキュメントのように：

//テンプレート：

<select>
    <option value="0" data-foo="bar">option one</option>
</select>

//Initiate select2

$("select").select2({
    formatResult: format,
    formatSelection: format,
    escapeMarkup: function(m) { return m; }
});

//access custom data

function format(state) {
    var originalOption = state.element;
    return $(originalOption).data('foo');
}
于 2015-01-22T10:22:18.933 に答える
2

以下を試すこともできます。選択があるとします。jQuery の標準のデータ属性構文を使用して、オプションに追加情報を追加できます。 jQuery data() APIを参照してください。

 <select id="product">
      <option value="prod_x" data-additional-info="1234X">Product X</option>
      <option value="prod_y" data-additional-info="1234Y">Product Y</option>
 </select>

APIドキュメントによると、JavaScriptで.select2（ "data"）を使用してオプション要素自体にアクセスできます- 「選択を取得または設定します。valメソッドに似ていますが、IDではなくオブジェクトで動作します」 . オプション オブジェクト自体に到達するには、選択されたすべてのオプションの配列である要素を通過する必要があります。以下の例では、選択は複数の値を選択できないため、常に配列の最初のオブジェクトを使用し、オブジェクトを取得するだけでなく、「.element[0]」からの結果を $() でラップして jQuery オブジェクトにします。 .

 // Get the selected option using select2's api...
 var selectedOption = $($("#product").select2("data").element[0]);

jQuery オブジェクトができたので、次のようにjQuery data() APIを使用して、option 要素に保存されている任意のデータを取得できます。

 var additionalInfo = selectedOption.data("additional-info");

追加の情報変数には、どちらが選択されたかに応じて、「1234X」または「1234Y」が含まれるようになりました。

これを使用すると、追加データを保持する非表示の入力を削除し、選択したオプションに直接結び付けることができます。

于 2014-04-03T15:21:52.840 に答える
1

選択したオプションのデータ属性を取得できます

var seledted = $("#selectId").select2().find(":selected");
var s = $(seledted).data("data-field");
于 2014-05-29T12:30:43.793 に答える
0

私は最終的にこれを達成しました

$(".suggestive-entry").click(function() {
   var val = $(this).siblings('input:hidden').attr('data-field');
   alert(val);
});

ご覧のとおり、siblings 属性を使用して、クリック イベントを生成した select2 ボックスに最も近い非表示の入力を取得しました。

于 2013-05-05T23:50:02.147 に答える