[CLOSED] Partial View With Linked Combos

  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.
  7. #7
    Hi Daniil,

    Thats it all working now thanks for the guidance, you can now mark this thread as closed

    Thanks

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