[CLOSED] Partial View With Linked Combos

Hybrid View

Previous Post Previous Post   Next Post Next Post
  1. #1

    [CLOSED] Partial View With Linked Combos

    Hi all,

    Just got a quick question. I have a partial view which contains a 2 linked multicombos, I started by using a card layout and the combos linked correctly. I would select an option from the first combo and then when I clicked on the trigger for the second it would fire a Ajax request to the back end and get results for the ID selected in the first combo. I then decided for ease of maintenance I would stop using a card layout and switched to using partial views. I left the stores for the combos on the main view (which i think is part of my problem) and moved the panel which contained the panel for the combos into a partial. Now when when I try and use the combos nothing happens the listeners on the Combos don't fire and the Ajax the ajax request isn't firing. I can get the first multicombo to populate only by autoloading the store.


    Controller
            
    public ActionResult LoadView(string containerId, string selectedId)
            {
                switch (selectedId)
                {
                    case "0":
                        {
                            Ext.Net.MVC.PartialViewResult p = new Ext.Net.MVC.PartialViewResult(containerId, RenderMode.AddTo);
                            p.ViewName = "LeagueTableReport";
                            p.SingleControl = true;
                            
                            return p;
                                
                        }
                    case "1":
                        {
                            Ext.Net.MVC.PartialViewResult p = new Ext.Net.MVC.PartialViewResult(containerId, RenderMode.AddTo);
                            p.ViewName = "HitlistReport";
                            p.SingleControl = true;
                            return p;
    
                        }
                    case "2":
                        {
                            Ext.Net.MVC.PartialViewResult p = new Ext.Net.MVC.PartialViewResult(containerId, RenderMode.AddTo);
                            p.ViewName = "ContactReports";
                            p.SingleControl = true;
                            return p;
    
                        }
                    default: return null;
    
                }
    
            }
    Main View

    <%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<WealthPro2.ViewModels.NewBusiness.Reports>" %>
    
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
        AdminstrationReports
    </asp:Content>
    <asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
        <ext:Store runat="server" ID="hitlistStatusStore">
            <Proxy>
                <ext:HttpProxy Url="/ReportsManagementReports/GetHitlistStatus" />
            </Proxy>
            <Reader>
                <ext:JsonReader Root="data" IDProperty="Id">
                    <Fields>
                        <ext:RecordField Name="Id" Type="Int" />
                        <ext:RecordField Name="Title" Type="String" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        <ext:Store ID="storeActionStatuses" runat="server" ShowWarningOnFailure="true" AutoLoad="false">
            <Proxy>
                <ext:HttpProxy Url="/ReportsManagementReports/GetActionStatus" />
            </Proxy>
            <BaseParams>
              <ext:Parameter Name="id" Value="#{actionTypeContactCombo}.getValue()" Mode="Raw" />
            </BaseParams>
            <Reader>
                <ext:JsonReader IDProperty="Id" Root="data">
                    <Fields>
                        <ext:RecordField Name="Id" />
                        <ext:RecordField Name="ActionStatusTitle" />
                        <ext:RecordField Name="ActionTypeId" />
                        <ext:RecordField Name="Terminal" />
                        <ext:RecordField Name="SortOrder" />
                        <ext:RecordField Name="WarningDays" />
                        <ext:RecordField Name="AmberWarning" />
                        <ext:RecordField Name="ComplianceOnly" />
                        <ext:RecordField Name="CustomFlag" />
                        <ext:RecordField Name="Active" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
            <Listeners>
              <Load Handler="#{actionStatusContactCombo}.reset(); #{actionStatusContactCombo}.selectAll()" />
            </Listeners>
        </ext:Store>
        <ext:Store ID="storeActionTypes" runat="server" ShowWarningOnFailure="true" AutoLoad="true">
            <Proxy>
                <ext:HttpProxy Url="/ReportsManagementReports/GetActionTypes" />
            </Proxy>
            <Reader>
                <ext:JsonReader IDProperty="Id" Root="data">
                    <Fields>
                        <ext:RecordField Name="Id" />
                        <ext:RecordField Name="ActionDescription" />
                        <ext:RecordField Name="ActionFunctionIds" />
                        <ext:RecordField Name="Active" />
                        <ext:RecordField Name="FunctionToTypeMappings" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
            <Listeners>
             <%-- <Load Handler="#{actionTypeContactCombo}.selectAll()" />--%>
            </Listeners>
        </ext:Store>
        <ext:Viewport ID="Viewport1" runat="server" Layout="FitLayout">
            <Items>
                <ext:Panel runat="server" ID="reportPanel" Layout="FitLayout">
                    <TopBar>
                        <ext:Toolbar ID="Toolbar1" runat="server">
                            <Items>
                                <ext:ComboBox runat="server" ID="reportSelectCombo">
                                    <Items>
                                        <ext:ListItem Text="League Table" Value="0" />
                                        <ext:ListItem Text="Hitlist" Value="1" />
                                        <ext:ListItem Text="Contact Report" Value="2" />
                                     </Items>
                                    <DirectEvents>
                                      <Select CleanRequest="true" Url="/ReportsManagementReports/LoadView" Before="#{reportPanel}.removeAll()" >
                                        <ExtraParams>
                                          <ext:Parameter Name="containerId" Value="#{reportPanel}.id" Mode="Raw" />
                                          <ext:Parameter Name="selectedId" Value="#{reportSelectCombo}.getValue()" Mode="Raw" />                              
                                        </ExtraParams>
                                      </Select>
                                    </DirectEvents>
                                </ext:ComboBox>
                            </Items>
                        </ext:Toolbar>
                    </TopBar>
                    <Items>
                        
      
    
                        
                    </Items>
                </ext:Panel>
            </Items>
        </ext:Viewport>
        <script src="<%=Url.Content("~/Scripts/view/managementReports.js") %>" type="text/javascript">
        </script>
        <script src="<%=Url.Content("~/Scripts/view/siteMaster.js") %>" type="text/javascript">   
          
        </script>
    </asp:Content>
    Partial View
    <%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<dynamic>" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    
    <ext:Container runat="server" ID="contactReportsContainer" IDMode="Explicit">
    
        <Items>
            <ext:Panel EnableColumnHide="false" AutoExpandColumn="Description" Height="500" runat="server"
                Split="true" ID="contactReportPanel" Layout="FitLayout">
                <TopBar>
                    <ext:Toolbar ID="Toolbar4" runat="server">
                        <Items>
                            <ext:ToolbarSeparator />
                            <ext:DateField runat="server" ID="startDateContact" FieldLabel="From" Width="150"
                                LabelWidth="30" Format="d/m/y" />
                            <ext:DateField runat="server" ID="endDateContact" FieldLabel="To" Width="150" LabelWidth="30"
                                Format="d/m/y">
                            </ext:DateField>
                            <ext:MultiCombo runat="server" AllowBlank="false" FieldLabel="Action Type" ID="actionTypeContactCombo"
                                Width="200" LabelWidth="70" DisplayField="ActionDescription" TriggerAction="All"
                                Mode="Remote" StoreID="storeActionTypes" ValueField="Id">
                            </ext:MultiCombo>
                            <ext:MultiCombo runat="server" AllowBlank="false" FieldLabel="Action Status" ID="actionStatusContactCombo"
                                Width="200" LabelWidth="70" ForceSelection="true" Mode="Remote" TriggerAction="All"
                                StoreID="storeActionStatuses" DisplayField="ActionStatusTitle" ValueField="Id">
                                <Listeners>
                                    <Show Handler="debugger" />
                                    <BeforeQuery Handler="#{actionStatusContactCombo}.lastQuery = null" />
                                </Listeners>
                            </ext:MultiCombo>
                            <ext:ComboBox runat="server" FieldLabel="Adviser" ID="adviserContactCombo" LabelWidth="50"
                                ForceSelection="false" ValueField="Id" DisplayField="AdviserName" AllowBlank="true"
                                EmptyText="All">
                                <Listeners>
                                    <BeforeRender Handler="item.store=window.top.storeAdvisers" />
                                </Listeners>
                            </ext:ComboBox>
                            <ext:ComboBox runat="server" FieldLabel="User" ID="userContactCombo" LabelWidth="50"
                                ForceSelection="false" ValueField="Id" DisplayField="Username" AllowBlank="true"
                                EmptyText="All">
                                <Listeners>
                                    <BeforeRender Handler="item.store=window.top.storeActionUsers" />
                                </Listeners>
                            </ext:ComboBox>
                            <ext:ComboBox runat="server" FieldLabel="Group By" ID="groupByContactCombo" LabelWidth="50"
                                ForceSelection="false" SelectedIndex="0" AllowBlank="true" EmptyText="All">
                                <Items>
                                    <ext:ListItem Text="Adviser" Value="0" />
                                    <ext:ListItem Text="User" Value="1" />
                                </Items>
                            </ext:ComboBox>
                            <ext:ToolbarFill ID="ToolbarFill1" Width="25" runat="server" />
                            <ext:Button ID="contactReset" runat="server" Text="Reset" Icon="ArrowRedo">
                                <Listeners>
                                    <Click Handler="resetContact()" />
                                </Listeners>
                            </ext:Button>
                            <ext:Button ID="Button1" runat="server" Text="Run" Icon="HtmlGo">
                                <Listeners>
                                    <Click Handler="printContactReport()" />
                                </Listeners>
                            </ext:Button>
                        </Items>
                    </ext:Toolbar>
                </TopBar>
                <Items>
                    <ext:Panel runat="server" ID="contactContent">
                        <AutoLoad Mode="IFrame" />
                    </ext:Panel>
                </Items>
            </ext:Panel>
        </Items>
        <Listeners>
            <AfterLayout Handler="#{actionTypeContactCombo}.selectAll()" />
        </Listeners>
    </ext:Container>
    Thanks for the help
    Last edited by Daniil; Sep 05, 2012 at 12:33 PM. Reason: [CLOSED]
  2. #2
    Hi,

    Are there any error, exceptions?

    Also I would ensure there are no id conflicts, i.e. same client ids for different controls.
  3. #3
    Hi Daniil,

    There are no exceptions thrown, I checked in multiply browsers just to make sure its not a browser issue but the same issue occurs. I checked for ID conflicts and from what I can I see arn't any.

    Thanks
  4. #4
    Could you please provide us with a full sample and exact steps to reproduce the problem?
  5. #5
    Hi Daniil,

    I Have manged to solve my original issue by referencing the stores for the combos with window.[storename], but I am now having an issue with my multicombos. I use the selectAll() method to select every option in my combo as default (using the load event on the store for that multicombo) but when I try and use the method I get an exception "parentnode is null or not an object ". Do you have any recommendations on what the problem could be?

    Thanks
  6. #6
    I guess a MultiCombo is not rendered yet when the Load listener is triggered.

    Please try to set
    Delay="100"
    for the Load listener.

Similar Threads

  1. Ajax linked combos
    By ddolan in forum 1.x Help
    Replies: 0
    Last Post: Feb 17, 2011, 8:30 PM
  2. Replies: 0
    Last Post: Apr 01, 2010, 6:51 AM
  3. The example Linked combos in grid.
    By FreddeM in forum Examples and Extras
    Replies: 1
    Last Post: Jan 04, 2010, 2:41 PM
  4. Linked Combos - Set selected values
    By Tbaseflug in forum 1.x Help
    Replies: 0
    Last Post: Jul 29, 2009, 11:04 AM
  5. [CLOSED] Linked combos with SQL datasource
    By Jurke in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Mar 27, 2009, 6:49 AM

Tags for this Thread

Posting Permissions