ASP .NET Core MVC Demos

Show Demo List

ASP .NET MVC ComboBox Tag Helper

jqx-combobox

@model IEnumerable<jQWidgets.AspNet.Core.Models.SalesEmployee>

ViewData["Title"] = "ASP .NET MVC ComboBox Example";

}

var employee = Model.FirstOrDefault();

}

<label>ASP .NET Core MVC ComboBox Example</label><br/><br/>

<jqx-combobox for="@employee.Name" value-for="@employee.ID" selectedIndex="0" edit="@Url.Action("EditItem","TagHelpers")" create="@Url.Action("AddItem","TagHelpers")" delete="@Url.Action("DeleteItem","TagHelpers")" instance="listInstance()" theme="@ViewData["Theme"]" width="250" height="30" source="Model"></jqx-combobox>

<label>Add/Delete/Update</label>

<table>

<tr>

</tr>

</table>

</div>

<jqx-button style="margin-top:20px;" theme="@ViewData["Theme"]" on-click="addItem()">Add Item</jqx-button>

<jqx-button style="margin-top:20px;" theme="@ViewData["Theme"]" on-click="removeItem()">Delete Item</jqx-button>

<jqx-button style="margin-top:20px;" theme="@ViewData["Theme"]" on-click="updateItem()">Update Item</jqx-button>

var list = {};

function addItem() {

list.addItem($("#name").val());

}

function removeItem() {

var item = list.getSelectedItem();

if (item)

{

list.removeItem(item);

}

function updateItem() {

var item = list.getSelectedItem();

if (item)

{

list.updateItem({value: item.value, label: $("#name").val() }, item);

}

function listInstance(instance) {

list = instance;

}

</script>

create - {{String}} which determines the URL called when a ComboBox item is added.

for - {{ModelExpression}} used for model binding and determines the label member.

value-for - {{ModelExpression}} used for model binding and determines the value member.

delete - {{String}} which determines the URL called when a ComboBox item is deleted.

edit - {{String}} which determines the URL called when a ComboBox item is updated.

instance - {{String}} which determines the javascript member within the Script tag which refers to the ComboBox's instance. This member is useful when you want to dynamically invoke API members of the Javascript component.

serverProcessing - {{Boolean}} which determines whether server processing is enabled.

sourceId - {{String}} which determines the data source's ID member.

sourceId-for - {{ModelExpression}} used for model binding and determines the data source's ID member.

sourceRoot - {{String}} which determines the data source's Root member.

sourceTotalRecords - {{Integer}} which determines the data source's TotalRecords member.

sourceUrl - {{String}} which determines the data source's URL.

sourceModel - {{Model}} which determines the data source's Model.

ASP .NET Core MVC Demos

ASP .NET Core MVC UI Components

ASP .NET MVC ComboBox Tag Helper