帶有一列自動完成文本字段的InlineEdit？

我正在尋找選項以支持free-jqgrid內聯編輯模式下的自動完成類型輸入字段。如果5-10個值小於下拉菜單，它會很好用。我需要在網格上找到需要搜索的值或者需要自動完成選項。帶有一列自動完成文本字段的InlineEdit？

讓我知道這是可能的嗎？如果是請提供一些方向或示例。

更新1 Screenshot displays inline input text field needs Auto-Complete

更新2 我有以下順序文件導入：

jquery-ui-min.css 
bootstrap.min.css 
bootstrap-grid.min.css 
ui.jqgrid.min.css 
font-awesome.min.css 
select2.min.css 

jquery.min.js 
jquery-ui.min.js 
select2.min.js 
jquery.jqgrid.min.js 
tether.min.js 
bootstrap.min.js

來源

2017-03-08 dev.sforce

[自述文件]（https://github.com/free-jqgrid/jqGrid/blob/v4.14.0/README.md）到最新V4 .14.0版本的免費jqGrid包含演示https://jsfiddle.net/OlegKi/yvbt6w54/1/，它演示了jQuery UI Autocomplete和select2與免費jqGrid的用法。 – Oleg

感謝Oleg的信息 –

您好Oleg，其實我期待支持內聯輸入文本以支持自動完成。我沒有搜索字段選項。請參閱UPDATE 1的截圖。 –

您可以使用如下代碼

{ name: "name", align: "justify", width: 80, editrules: { required: true }, 
    autoResizing: { minColWidth: 80 }, 
    createColumnIndex: true, 
    editoptions: { 
     dataInit: function (elem) { 
      initAutocomplete.call(this, elem, "name"); 
     } 
    }, 
    searchoptions: { 
     dataInit: function (elem) { 
      initAutocomplete.call(this, elem, "name"); 
     }, 
     sopt: [ "cn", "eq", "bw", "ew", "bn", "nc", "en" ], 
     clearSearch: true 
    } }

哪裏initAutocomplete函數被聲明爲

var initAutocomplete = function (elem, cmName) { 
     $(elem).autocomplete({ 
      source: $(this).jqGrid("getUniqueValueFromColumnIndex", cmName), 
      delay: 0, 
      minLength: 0 
     }); 
    };

參見https://jsfiddle.net/OlegKi/ugxvr75q/

來源

2017-03-08 18:10:54 Oleg

嗨奧列格，東西很奇怪，我已經添加了所有必需的文件，但它似乎我越來越未被捕獲TypeError：$（...）.autocomplete不是一個函數。你看到我導入CSS和JS文件的順序有問題嗎？請參閱UPDATE2 –

@ dev.sforce：UPDATE2不包含有關使用的JvaScript庫版本的任何信息。我發佈了你的JSFiddle演示，你可以修改它來重現問題。例如，https://jsfiddle.net/OlegKi/ugxvr75q/2/似乎沒有問題。 – Oleg

所有版本都是正確的除了bootstrap！我正在使用Boostrap4 –

帶有一列自動完成文本字段的InlineEdit？

回答

相關問題