Kendo ui
来自tomtalk
Kendo UI autocomplete retrieve id on select
$("#autocomplete").kendoAutoComplete({ dataTextField: "Txt", select: function(e) { var dataItem = this.dataItem(e.item.index()); //output selected dataItem $("#result").html(kendo.stringify(dataItem)); }, dataSource: { data: [ { Txt : "GB1", value: 1 }, { Txt : "GB2", value: 2 }, { Txt : "GB3", value: 3 }, { Txt : "GB4", value: 4 } ] } });
Auto complete filtering in kendo ui
This is the DataSource and AutoComplete definition:
$("#products").kendoAutoComplete({ dataTextField: "name", filter: "contains", minLength: 3, dataSource: { transport: { read: { url: "/admin/countries", type: "POST", dataType: "json" } }, schema: { model: { id: "id", fields: { id: { type: "id" }, name: { type: "string" } } } } } });
and this is how Countries list should be returned by the server.
[ { "id":1, "name":"Albania" }, { "id":2, "name":"Andorra" }, { "id":3, "name":"Armenia" }, { "id":4, "name":"Austria" }, { "id":5, "name":"Azerbaijan" }, ... ]
自定义工具按钮
.k-editor .k-myTool { background: 50% 50% no-repeat url(http://digitaltools.node3000.com/wp-content/themes/digital-tools/images/rss-icon-16x16px.png); }
$("#editor").kendoEditor({ tools: [ { name: "myTool", tooltip: "My ToolTip", exec: function(e) { var editor = $(this).data("kendoEditor"); editor.exec("inserthtml", { value: '<img src="/images/275x185_2.jpg"/>' }); } } ] });