2016-05-05 7 views
4

私はコンボボックスデモからいくつかのコードを使用しましたが、ここでいくつかのクラスを_renderItemと_renderMenuというリストアイテムに追加しようとしています。無効。jQuery UI customオートコンプリート - `_renderItem`と` _renderMenu`が動作しません

(一部無関係なラインを持つ、私は何を欠場することを確実にする)コード

this.input = $("<input>") 
    .appendTo(this.wrapper) 
    .val(value) 
    .attr("title", "") 
    .addClass("custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left") 
    .autocomplete({ 
     autoFocus: true, 
     response: function (event, ui) { 
      if (ui.content.length == 0) { 
        ui.content.push({ 
         label: "new value: " + $(this).val(), 
         value: $(this).val(), 
         id: 0 
        }); 
      } 
     }, 
     _renderItem: function (ul, item) { 
      return $("<li>") 
       .addClass("Please work") 
       .attr("data-value", item.value) 
       .append(item.label) 
       .appendTo(ul); 
     }, 
     _renderMenu: function (ul, items) { 
      var that = this; 
      $.each(items, function (index, item) { 
       that._renderItemData(ul, item); 
      }); 
      $(ul).find("li:odd").addClass("odd"); 
     }, 
     delay: 0, 
     minLength: 0, 
     source: $.proxy(this, "_source") 
    }) 
    .tooltip({ 
     tooltipClass: "ui-state-highlight" 
    }); 

答えて

4

私はそのように機能拡張を使ったことがない、それが動作していないなぜ私が言うことができません(それはすべきです)。とにかく

コールバックを作成し、標準的な方法を試してみてください。

this.input = $("<input>") 
    .appendTo(this.wrapper) 
    .val(value) 
    .attr("title", "") 
    .addClass("custom-combobox-input ui-widget ui-widget-content ui-state-default ui-corner-left") 
    .autocomplete({ 
     autoFocus: true, 
     response: function (event, ui) { 
      if (ui.content.length == 0) { 
        ui.content.push({ 
         label: "new value: " + $(this).val(), 
         value: $(this).val(), 
         id: 0 
        }); 
      } 
     }, 
     delay: 0, 
     minLength: 0, 
     source: $.proxy(this, "_source"), 
     create: function() { 
      $(this).data('ui-autocomplete')._renderItem = function (ul, item) { 
       return $("<li>") 
       .addClass("Please work") 
       .attr("data-value", item.value) 
       .append(item.label) 
       .appendTo(ul); 
      }; 

     } 
    }) 
    .tooltip({ 
     tooltipClass: "ui-state-highlight" 
    }); 

このFIDDLE

を見ます
関連する問題