What's New?

[CLOSED] Filling the dropdown in the

  1. #1
    Jun 02, 2009, 7:55 AM

    [CLOSED] Filling the dropdown in the 

    <html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <script type="text/javascript">
        function getRowClass(record) {
            if (record.data.AddresseId == '')
            {
                return 'errorBackgroundColor';
            }
        }
       
       
        var GetMenuName = function(value)
        {
            var tetst = "";
            retVal = Store2.getById(value);
                           
            return retVal;
        };       
    </script>

</head>
<body>
    <form id="form2" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server">
        </ext:ScriptManager>
        <ext:Store ID="Store1" runat="server" RefreshAfterSaving="Always">
            <Reader>
                <ext:JsonReader ReaderID="FileName">
                    <Fields>
                        <ext:RecordField Name="AddresseId" Type="Int" />
                        <ext:RecordField Name="Name" Type="String" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        <ext:Store ID="Store2" runat="server">
            <Reader>
                <ext:JsonReader ReaderID="AddresseId">
                    <Fields>
                        <ext:RecordField Name="TaskFunctionId" Type="Int" />
                        <ext:RecordField Name="PerformedBy" Type="Int" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        <ext:ViewPort ID="ViewPort1" runat="server">
            <Body>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <Center Collapsible="false" Split="true">
                        <ext:Panel ID="pnlBody" runat="server" Header="false" Border="false" BodyStyle="padding:4px;">
                            <Body>
                                <ext:GridPanel runat="server" ID="gpViews" Title="Views" AutoHeight="true" StoreID="Store2"
                                    Floating="true" Border="true" BodyBorder="true" Header="true">
                                    <ColumnModel ID="ColumnModel1" runat="server">
                                        <Columns>
                                            <ext:Column DataIndex="TaskFunctionId" Header="Task Function Id" Width="200">
                                            </ext:Column>
                                            <ext:Column DataIndex="PerformedBy" Header="Performed By" Width="150">
                                                <Renderer Fn="GetMenuName" />
                                                <Editor>
                                                    <ext:ComboBox ID="cbMenuItems" ReadOnly="true" runat="server" StoreID="Store1" DisplayField="Name"
                                                        ValueField="AddresseId" Mode="Local" Select&#111;nfocus="true" TriggerAction="All" />
                                                </Editor>
                                            </ext:Column>
                                        </Columns>
                                    </ColumnModel>
                                </ext:GridPanel>
                            </Body>
                        </ext:Panel>
                    </Center>
                </ext:BorderLayout>
            </Body>
        </ext:ViewPort>
    </form>
</body>
</html>
    And the .cs file is

    clsTasksProcessedBy clsProcessedBy = new clsTasksProcessedBy();
clsTask objTask = new clsTask();
string sRecordID = "289";

protected void Page_Load(object sender, EventArgs e)
{
   
    DataSet dsFunctions = clsProcessedBy.GetProcessedByAddresses(sRecordID, (int)Enums.MosaiqueObjects.Project);
    this.Store1.DataSource = dsFunctions;
    this.Store1.DataBind();
    FillProcessedBy();
}
private void FillProcessedBy()
{
    DataSet dsProcessedBy = clsProcessedBy.GetTaskProcessedBy(sRecordID, (int)Enums.MosaiqueObjects.Project);
    Store2.DataSource = dsProcessedBy;
    Store2.DataBind();
}
    By using the above code i am unable to see the dropdown selected value(even the dropdown is selected)If i seleted the item in the gridpanel dropdown it is not visible if i click on the next cell.Any one can u help me.

    Regards,
    Vasu

  2. #2
    Jun 02, 2009, 9:32 AM

    RE: [CLOSED] Filling the dropdown in the

    Hi see my Design and code.

    I am unable to see the dropdown selected item in the grid panel if the focus is in the next cell and also in the binding the grid.

    Can any one tell where the problem lies ?

    Please find the attached document for screen shots.

    Design is like this

    <%@ Page Language="C#" AutoEventWireup="true" CodeFile="SampleCombo.aspx.cs" Inherits="SampleCombo" %>

<%@ Import Namespace="System.Collections.Generic" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" 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 id="Head1" runat="server">
    <title></title>
    
    <script type="text/javascript">
        function getRowClass(record) {
            if (record.data.DeptId == '')
            {
                return 'errorBackgroundColor';
            }
        }
       var GetDeptName = function(value)
        {
            var tetst = "";
            retVal = Store2.getById(value);
                  
            return retVal;
        };       
    </script>

</head>
<body>
    <form id="form2" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server">
        </ext:ScriptManager>
        <ext:Store ID="Store1" runat="server" RefreshAfterSaving="Always">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="DeptId" Type="Int" />
                        <ext:RecordField Name="DeptName" Type="String" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        <ext:Store ID="Store2" runat="server" OnRefreshData="Store2_RefershData">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="EmployeeId" Type="Int" />
                        <ext:RecordField Name="EmployeeName" Type="string" />
                        <ext:RecordField Name="DeptId" Type="string" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        <ext:ViewPort ID="ViewPort1" runat="server">
            <Body>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <Center Collapsible="false" Split="true">
                        <ext:Panel ID="pnlBody" runat="server" Header="false" Border="false" BodyStyle="padding:4px;">
                            <Body>
                                <ext:GridPanel runat="server" ID="gpViews" Title="Views" AutoHeight="true" StoreID="Store2"
                                    Floating="true" Border="true" BodyBorder="true" Header="true">
                                    <ColumnModel ID="ColumnModel1" runat="server">
                                        <Columns>
                                            <ext:Column DataIndex="EmployeeId" Header="Employee Id" Width="200">
                                            </ext:Column>
                                             <ext:Column DataIndex="EmployeeName" Header="Employee Name" Width="200">
                                            </ext:Column>
                                            <ext:Column DataIndex="DeptId" Header="Department Name" Width="150">
                                                <Renderer Fn="GetDeptName" />
                                                <Editor>
                                                    <ext:ComboBox ID="cbDepartments" ReadOnly="true" runat="server" StoreID="Store1" DisplayField="DeptName"
                                                        ValueField="DeptId" Mode="Local" AutoPostBack="True" Select&#111;nfocus="true" ForceSelection="True" TriggerAction="All" />
                                                </Editor>
                                            </ext:Column>
                                        </Columns>
                                    </ColumnModel>
                                </ext:GridPanel>
                            </Body>
                        </ext:Panel>
                    </Center>
                </ext:BorderLayout>
            </Body>
        </ext:ViewPort>
    </form>
</body>
</html>
    And code is

    protected void Page_Load(object sender, EventArgs e)
{
      FillStore2();
      FillStore1();
}

private void FillStore1()
{
    DataTable dtDept = new DataTable();
    dtDept.Columns.Add("DeptId");
    dtDept.Columns.Add("DeptName");
    DataRow dr = dtDept.NewRow();
    dr[0] = 10;
    dr[1] = "Computers";
    dtDept.Rows.Add(dr);

    DataRow dr1 = dtDept.NewRow();
    dr1[0] = 20;
    dr1[1] = "Maths";
    dtDept.Rows.Add(dr1);

    DataRow dr2 = dtDept.NewRow();
    dr2[0] = 30;
    dr2[1] = "Physics";
    dtDept.Rows.Add(dr2);

    Store1.DataSource = dtDept;
    Store1.DataBind();

}

private void FillStore2()
{
    DataTable dtEmp = new DataTable();
    dtEmp.Columns.Add("EmployeeId");
    dtEmp.Columns.Add("EmployeeName");
    dtEmp.Columns.Add("DeptId");

    DataRow dr = dtEmp.NewRow();
    dr[0] = 1;
    dr[1] = "Koti";
    dr[2] = 10;
    dtEmp.Rows.Add(dr);

    DataRow dr1 = dtEmp.NewRow();
    dr1[0] = 2;
    dr1[1] = "Satya";
    dr1[2] = 30;
    dtEmp.Rows.Add(dr1);

    Store2.DataSource = dtEmp;
    Store2.DataBind();
}
  3. #3
    Jun 04, 2009, 12:28 AM

    RE: [CLOSED] Filling the dropdown in the

    Hi Etisbew,

    There were a couple problems...

    1. You need to set the ReaderId property on Store1

    2. The Renderer needs to return a string.

    I modified your sample.

    Example

    <%@ Page Language="C#" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ Import Namespace="System.Data" %>

<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>

<script runat="server">
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Ext.IsAjaxRequest)
        {
            this.FillStore2();
            this.FillStore1();
        }
    }

    private void FillStore1()
    {
        DataTable dtDept = new DataTable();
        dtDept.Columns.Add("DeptId");
        dtDept.Columns.Add("DeptName");
        
        DataRow dr = dtDept.NewRow();
        dr[0] = 10;
        dr[1] = "Computers";
        dtDept.Rows.Add(dr);

        DataRow dr1 = dtDept.NewRow();
        dr1[0] = 20;
        dr1[1] = "Maths";
        dtDept.Rows.Add(dr1);

        DataRow dr2 = dtDept.NewRow();
        dr2[0] = 30;
        dr2[1] = "Physics";
        dtDept.Rows.Add(dr2);

        this.Store1.DataSource = dtDept;
        this.Store1.DataBind();

    }

    private void FillStore2()
    {
        DataTable dtEmp = new DataTable();
        dtEmp.Columns.Add("EmployeeId");
        dtEmp.Columns.Add("EmployeeName");
        dtEmp.Columns.Add("DeptId");

        DataRow dr = dtEmp.NewRow();
        dr[0] = 1;
        dr[1] = "Koti";
        dr[2] = 10;
        dtEmp.Rows.Add(dr);

        DataRow dr1 = dtEmp.NewRow();
        dr1[0] = 2;
        dr1[1] = "Satya";
        dr1[2] = 30;
        dtEmp.Rows.Add(dr1);

        this.Store2.DataSource = dtEmp;
        this.Store2.DataBind();
    }
</script>

<!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="Head1" runat="server">
    <title>Coolite Toolkit Example</title>
    
    <script type="text/javascript">
        var getDeptName = function (value) {
            return Store1.getById(value).data.DeptName;
        };       
    </script>
</head>
<body>
    <form id="form2" runat="server">
        <ext:ScriptManager ID="ScriptManager1" runat="server" />
        
        <ext:Store ID="Store1" runat="server">
            <Reader>
                <ext:JsonReader ReaderID="DeptId">
                    <Fields>
                        <ext:RecordField Name="DeptId" Type="Int" />
                        <ext:RecordField Name="DeptName" Type="String" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        
        <ext:Store ID="Store2" runat="server">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="EmployeeId" Type="Int" />
                        <ext:RecordField Name="EmployeeName" Type="string" />
                        <ext:RecordField Name="DeptId" Type="string" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        
        <ext:ViewPort ID="ViewPort1" runat="server">
            <Body>
                <ext:BorderLayout ID="BorderLayout1" runat="server">
                    <Center Collapsible="false" Split="true">
                        <ext:Panel ID="pnlBody" runat="server" Header="false" Border="false" BodyStyle="padding:4px;">
                            <Body>
                                <ext:ContainerLayout runat="server">
                                    <ext:GridPanel 
                                        runat="server" 
                                        ID="gpViews" 
                                        Title="Views" 
                                        AutoHeight="true" 
                                        StoreID="Store2"
                                        Floating="true" 
                                        Border="true" 
                                        BodyBorder="true" 
                                        Header="true">
                                        <ColumnModel ID="ColumnModel1" runat="server">
                                            <Columns>
                                                <ext:Column DataIndex="EmployeeId" Header="Employee Id" Width="200" />
                                                <ext:Column DataIndex="EmployeeName" Header="Employee Name" Width="200" />
                                                <ext:Column DataIndex="DeptId" Header="Department Name" Width="150">
                                                    <Renderer Fn="getDeptName" />
                                                    <Editor>
                                                        <ext:ComboBox 
                                                            ID="cbDepartments" 
                                                            ReadOnly="true" 
                                                            runat="server" 
                                                            StoreID="Store1" 
                                                            DisplayField="DeptName"
                                                            ValueField="DeptId" 
                                                            Mode="Local" 
                                                            AutoPostBack="True" 
                                                            Select&#111;nfocus="true" 
                                                            ForceSelection="True" 
                                                            TriggerAction="All" 
                                                            />
                                                    </Editor>
                                                </ext:Column>
                                            </Columns>
                                        </ColumnModel>
                                    </ext:GridPanel>
                                </ext:ContainerLayout>
                            </Body>
                        </ext:Panel>
                    </Center>
                </ext:BorderLayout>
            </Body>
        </ext:ViewPort>
    </form>
</body>
</html>
    Thanks for posting a comprehensive code sample. I was able to quickly
    get the sample up an running and found the problem efficiently.


    Note: I added a Layout control between the <ext:Panel> and <ext:GridPanel>, which should help with recalculating the sizing and positioning of items if their parents change.

    Hope this helps.

    Geoffrey McGill
    Founder
    Ext.NETASP.NET UI Component framework
    RetypeDocumentation website generator
    MojeeLightning fast Emoji library for .NET
    Ext.NET Examples|Ext.NET API Docs|ExtJS API Docs|Twitter

Similar Threads

  1. GridPanel dropdown column show dropdown on single click and expand at the same time
    By jboroda in forum 1.x Help
    Replies: 6
    Last Post: Jan 28, 2012, 1:14 AM
  2. [CLOSED] ComboBox and its dropdown - can the dropdown be larger than its "parent"?
    By wagger in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: May 14, 2011, 6:29 PM
  3. CheckAll is filling only in 1st page in gridpanel
    By duet420 in forum 1.x Help
    Replies: 1
    Last Post: Mar 26, 2011, 5:43 PM
  4. [CLOSED] Treepanel inside Dropdown - Set value of Dropdown as selected value of tree
    By jthompson in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Feb 08, 2011, 6:17 PM
  5. filling CheckboxGroup in ajax event
    By msayed in forum 1.x Help
    Replies: 0
    Last Post: Mar 10, 2010, 7:17 AM

Posting Permissions