Here is a sample.
In this i dont want to load data on page load but instead when user try's to expand the dropdownfield.
How can i achieve this?
<%@ Page Language="C#" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
}
public void Store_RefreshData(object sender, StoreRefreshDataEventArgs e)
{
var store = sender as Store;
store.DataSource = Employee.GetAll();
store.DataBind();
}
public class Employee
{
public int ID { get; set; }
public string Name { get; set; }
public string Surname { get; set; }
public static List<Employee> GetAll()
{
return new List<Employee>
{
new Employee
{
ID = 1,
Name = "Nancy",
Surname = "Davolio"
},
new Employee
{
ID = 2,
Name = "Andrew",
Surname = "Fuller"
}
};
}
}
</script>
<form id="form1" runat="server">
<div>
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:DropDownField runat="server" Width="300" TriggerIcon="SimpleArrowDown">
<Component>
<ext:GridPanel runat="server" Width="550" AutoHeight="true">
<Store>
<ext:Store runat="server" ID="Store1" OnRefreshData="Store_RefreshData" AutoLoad="false">
<Proxy>
<ext:PageProxy AutoDataBind="false">
</ext:PageProxy>
</Proxy>
<Reader>
<ext:JsonReader>
<Fields>
<ext:RecordField Name="ID" />
<ext:RecordField Name="Name" />
<ext:RecordField Name="Surname" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel runat="server">
<Columns>
<ext:Column ColumnID="ID" Header="ID" DataIndex="ID" Width="220" />
<ext:Column Header="Name" DataIndex="Name" Width="100" />
<ext:Column Header="Surname" DataIndex="Surname" Width="100">
</ext:Column>
<ext:CommandColumn>
<Commands>
<ext:CommandFill />
<ext:GridCommand Icon="Accept" CommandName="Pick">
<ToolTip Title="Employee" Text="Click to choose this employee" />
</ext:GridCommand>
<ext:CommandSpacer Width="20" />
</Commands>
</ext:CommandColumn>
</Columns>
</ColumnModel>
<Listeners>
<Command Handler="this.dropDownField.setValue(record.data.ID);" />
</Listeners>
<LoadMask ShowMask="true" />
<SelectionModel>
<ext:RowSelectionModel runat="server" />
</SelectionModel>
<BottomBar>
<ext:PagingToolbar ID="pgEmplyee" runat="server" PageSize="10">
</ext:PagingToolbar>
</BottomBar>
</ext:GridPanel>
</Component>
</ext:DropDownField>
</div>
</form>
</body>
</html>
Thanks,
Huzefa