0

メソッドにデータ属性を追加しようとしていますdataprovider。

現時点の

var options = [
        {label: 'Option 1', title: 'Option 1', value: '1', selected: true},
        {label: 'Option 2', title: 'Option 2', value: '2'}];

<option>コードでは、これらを次のようにタグにマップします。

$tag = $('<option/>').attr({
                        value: option.value,
                        label: option.label || option.value,
                        title: option.title,
                        selected: !!option.selected,
                        disabled: !!option.disabled
                      });

望ましい

var options =[
  {
    "label": "Item 1",
    "value": 1,
    "selected": false,
    "attributes": [
      {
        "some-attribute": 10001
      },
      {
        "another-attribute": "false"
      }
    ]
  }
]

したがって、HTML 要素で としてレンダリングされますdata-some-attribute="10001" data-another-attribute="false"。

これをコードに追加し始めました（これは機能しないことがわかっています）：

$tag = $('<option/>').attr({
                        value: option.value,
                        label: option.label || option.value,
                        title: option.title,
                        selected: !!option.selected,
                        disabled: !!option.disabled,
                        forEach(option.attributes, function(attribute){

                        })
                    });

もちろん問題は、オブジェクトのプロパティとしてループを追加できないことです。これが機能したら、リポジトリにプル リクエストを追加できます。レポで質問しましたが、自分でやってみることにしました問題 #592 何かアイデアはありますか?

4

2 に答える 2

1

最初に要素を作成してから、属性を追加する必要があります。

したがって、コードは次のようになります。

var options = [{
  "label": "Item 1",
  "value": 1,
  "selected": false,
  "attributes": [{
    "some-attribute": 10001
  }, {
    "another-attribute": "false"
  }]
}]

console.log(options.length);
$.each(options, function(option) {
  var $tag = $('<option/>').attr({
    value: options[option].value,
    label: options[option].label || options[option].value,
    title: options[option].title,
    selected: options[option].selected,
    disabled: options[option].disabled
  });
  console.dir(option);

  $.each(options[option].attributes, function(att) {
    $tag.attr("data" + Object.keys(att)[0], att[0])
  });
  $("#mySelect").append($tag);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<select id="mySelect">

</select>

于 2015-08-01T12:58:35.467 に答える