easyui-comboboxの使用

私はホイールを再発明するために残業していて、ブログは長い間止まっていました。私は本当に恥ずかしいです今日は少しアイドルでした今使ったeasyui-comboboxを録音しました

要件：ドロップダウンボックスを使用して、履歴オプションを表示し、新しいデータを編集して保存します。
最初にeditableSelectを試してください。編集とフィルタリングはできますが、オプションを動的に増やすことはできません。プラグインeasyui-comboboxも見つかりました。このプラグインはオープンソースバージョンと商用バージョンで利用可能で、まだ多くの補助資料があります。次に、editableSelectの動的割り当ての概要を示します。

easyui-comboboxによって引用されたドキュメント

jquery.easyui.min.js
easyui.css
icon.css
http://www.jeasyui.net/download/公式サイトからダウンロードできます

easyui-comboboxの2種類の動的割り当て

1. 使用<select>を作成する要素

<select id="data_unit"  class="easyui-combobox" name="deptstyle="width:286px;" value='<c:out value="${dcBoarding.data_unit}"/>' >
	<option value="">请选择或者输入</option>
       <c:forEach items="${unit}" var="name" varStatus="st">
	<option value="${name}">${name}</option>
	</c:forEach> 	
</select>

2.で<input>作成

<input  id="data_unit" name="dept" style="width:286px" value='<c:out value="${dcBoarding.data_unit}"/>'/>

$('#data_unit').combobox({
        	   url:importConst.formAjaxurl+"?method=queryUnite",
        	    valueField:'value',
        	    textField:'text',
			    editable : true,  //是否可编辑
			    panelHeight:'auto',
			});

urlによって返されるデータ型はjson型で、マップのキーは値、マップの値はtextFieldです。

その他の属性については、公式Webサイトを確認してください。