MagicSuggest可輸可選控件

可輸入可選擇控件地址：http://nicolasbize.com/magicsuggest/doc.html

js:

<link href="../../scripts/comboxselect/magicsuggest-min.css" rel="stylesheet" />
<script src="../../scripts/comboxselect/magicsuggest-min.js" type="text/javascript"></script>

<script>

/***************************綁定設計師和模特start**********************************/
var json = <%=jsonString%>
$('#comboBoxDesigner').magicSuggest({
allowFreeEntries: false,//如果你不需要用戶自已創建標簽，則用這個
maxSelection:1,//設置選擇個數
data: json,
style: 'width:283px;border: 1px solid #cccccc;',//自定義CSS
//maxSelectionRenderer: null,
selectFirst: true,
placeholder: "請選擇",
valueField :'id',//定義鍵值
displayField: 'dName',//定義顯示的字段
selectionRenderer: function (data) { //想讓標簽里顯示啥就看這個
//$("#txtprice").val(data.id);
return data.dCall + '/' + data.dName + '/' + data.constellation;
}
});

</script>

<script type="text/javascript">

function GetComboBoxValue() {
var desingner = $('#comboBoxDesigner').magicSuggest().getValue();
$("#hidDesigenr").val(desingner);

//alert(desingner + modeler);
}
window.onload=function(){
var design =[<%=designer%>]
$('#comboBoxDesigner').magicSuggest().setValue(design)

//do something
}

</script>

html:

<input id="hidDesigenr" type="hidden" runat="server" />
<input id="comboBoxDesigner" name="comboBoxDesigner" type="text"/>

 

aspx.cs:

#region 綁定設計師和模特及加工廠、工藝=================================
private void RptBindCombo()
{
BLL.dt_designer dbll = new dt_designer();
DataTable ddt = dbll.GetAllList().Tables[0];
jsonString = MyCommFun.DataTableToJson(ddt);

}