Mar 20, 2009, 3:45 PM
[CLOSED] Selecting a ComboBox value and filling a GridPanel from the ComboBox...
I have a combo box on the page that drives the data displayed in my GridPanel. I can't seem to get the combo box to fill correctly on the page load. The combo box is blank by default and the grid panel is empty (instead of starting with ID=3 selected and the grid panel being filled with ParentID=3 items).
How can I set the selected value of the combo box, and then reload the grid panel?
<%@ Page Language="vb"%>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<%@ Import Namespace="Helpers" %>
<!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 id="Head2" runat="server">
<script runat="server">
Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
Dim cs As String = Connection.ConnectionString(Request.ServerVariables("SERVER_NAME"))
SqlDataSourceParents.ConnectionString = cs
SqlDataSourceChildren.ConnectionString = cs
'load the navigation menu
If Not Page.IsPostBack Then
'get the ID of the page we are working on
Dim ID As Integer = 3
'we want the 3rd item selected by default in the combo box
' and we want the grid panel to fill with data from the 3rd item's ID
HiddenPageID.SetValue(ID)
cboParentID.SetValue(ID)
End If
End Sub
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ScriptManager ID="ScriptManager1" runat="server" ScriptMode="Debug" InitScriptMode="Inline">
</ext:ScriptManager>
<ext:Hidden runat="server" ID="HiddenPageID" Text="1"></ext:Hidden>
<asp:SqlDataSource ID="SqlDataSourceParents"
runat="server"
SelectCommand="_spGetSiblings"
SelectCommandType="StoredProcedure" >
<SelectParameters>
<asp:ControlParameter Name="PageID" ControlID="HiddenPageID" PropertyName="Value" />
</SelectParameters>
</asp:SqlDataSource>
<ext:Store runat="server" ID="StoreParents" DataSourceID="SqlDataSourceParents" AutoLoad="false">
<Reader>
<ext:JsonReader ReaderID="ID">
<Fields>
<ext:RecordField Name="ID" Type="Int"/>
<ext:RecordField Name="PageTitle" Type="String"/>
</Fields>
</ext:JsonReader>
</Reader>
<Listeners>
<Load Handler="#{cboParentID}.setValue(#{HiddenPageID}.getValue());#{StoreChildren}.reload();" />
</Listeners>
</ext:Store>
<asp:SqlDataSource ID="SqlDataSourceChildren"
runat="server"
SelectCommand="_spGetChildren"
SelectCommandType="StoredProcedure" >
<SelectParameters>
<asp:ControlParameter Name="PageID" ControlID="HiddenPageID" PropertyName="Value" />
</SelectParameters>
</asp:SqlDataSource>
<ext:Store runat="server" ID="StoreChildren" DataSourceID="SqlDataSourceChildren" AutoLoad="TRUE">
<Reader>
<ext:JsonReader ReaderID="ID">
<Fields>
<ext:RecordField Name="ID" Type="Int"/>
<ext:RecordField Name="PageTitle" Type="String"/>
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
<ext:ViewPort ID="ViewPort1" runat="server">
<Body>
<ext:Panel runat="server" id="Panel1" Border="true" Title="Page Properties" BodyStyle="padding:10px;" ButtonAlign="Center" Width="525">
<body>
<ext:TableLayout ID="TableLayout1" runat="server" Columns="3">
<ext:Cell>
<ext:Label runat="server" ID="Label4" Text="Parent Page:"></ext:Label>
</ext:Cell>
<ext:Cell ColSpan="2">
<ext:ComboBox runat="server" ID="cboParentID" FieldLabel="Parent Page" StoreID="StoreParents" DisplayField="PageTitle" ValueField="ID">
<Listeners>
<Select Handler="#{HiddenPageID}.setValue(#{cboParentID}.getValue());#{StoreChildren}.reload();" />
</Listeners>
</ext:ComboBox>
</ext:Cell>
<ext:Cell>
<ext:Label runat="server" ID="Label5" Text="Children:"></ext:Label>
</ext:Cell>
<ext:Cell ColSpan="2">
<ext:GridPanel runat="server" ID="GridPanelChildren" StoreID="StoreChildren" AutoHeight="true">
<ColumnModel>
<Columns>
<ext:Column DataIndex="PageTitle"></ext:Column>
</Columns>
</ColumnModel>
</ext:GridPanel>
</ext:Cell>
</ext:TableLayout>
</body>
</ext:Panel>
</Body>
</ext:ViewPort>
</form>
</body>
</html>
Here is the quick SQL scripts for my table and stored proceduresSET ANSI_NULLS ON
GO
SET QUOTED_IDENTIFIER ON
GO
SET ANSI_PADDING ON
GO
CREATE TABLE [dbo].[_tblPages](
[ID] [int] IDENTITY(1,1) NOT NULL,
[PageTitle] [varchar](255),
[ParentID] [int] NULL,
CONSTRAINT [PK__tblPages] PRIMARY KEY CLUSTERED
(
[ID] ASC
)WITH (PAD_INDEX = OFF, STATISTICS_NORECOMPUTE = OFF, IGNORE_DUP_KEY = OFF, ALLOW_ROW_LOCKS = ON, ALLOW_PAGE_LOCKS = ON) ON [PRIMARY]
) ON [PRIMARY]
GO
SET ANSI_PADDING OFF
GO
--add dummy data
insert into _tblPages (PageTitle, Parentid) values ('Top Page 1', -1)
insert into _tblPages (PageTitle, Parentid) values ('Top Page 2', -1)
insert into _tblPages (PageTitle, Parentid) values ('Top Page 3', -1)
insert into _tblPages (PageTitle, Parentid) values ('Sub Page 1-1', 1)
insert into _tblPages (PageTitle, Parentid) values ('Sub Page 1-2', 1)
insert into _tblPages (PageTitle, Parentid) values ('Sub Page 3-1', 3)
insert into _tblPages (PageTitle, Parentid) values ('Sub Page 3-2', 3)
---------------------
CREATE PROCEDURE [dbo].[_spGetChildren]
@PageID int
AS
BEGIN
SELECT ID, PageTitle FROM [_tblPages] where parentid = @pageid
END
GO
CREATE PROCEDURE [dbo].[_spGetSiblings]
@PageID int
AS
BEGIN
SELECT ID, PageTitle FROM [_tblPages] where parentid = (select parentid from _tblPages where id = @pageid)
END
GO
In my example:I want the