Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
765
How to use AutoSuggest and <ClientEvents> in WebDropDown?
posted

I have three WebDropDown controls (WDDL1, WDDL2, WDDL3) on my page.  The first two are cascading.  After selecting a value in WDDL1, the values in WDDL2 are properly filtered.  WDDL3 is independent, and not tied to the first two.  I am able to use the auto suggest feature with WDDL2.  I would like to be able to use the auto suggest feature with WDDL1 and WDDL3, but as soon as I type in a character, the "WDDLChanged" javascript function is fired.  I prefer to have the "WDDLChanged" javascript function fire AFTER a selection is made in the drop down list.  This is the markup for WDDL1, WDDL2, WDDL3 on the page:

<ig:WebDropDown ID="WDDL1" runat="server" AutoPostBack="false"  EnablePaging="false"
                                    PageSize="10" EnableRenderingAnchors="false" ForeColor="Black"
                                    DataSourceID="WDDL1SqlDataSource"  Visible="true" Width="375" 
                                    selectedValue='<%# Bind("dept_cd") %>' 
                                    OnPreRender="WDDL1_OnPreRender"  OnDataBound="WDDL1_OnDataBound"
                                    OnSelectionChanged="WDDL1_OnSelectionChanged" >
                    <ClientEvents SelectionChanged="WDDL1Changed" /> 
                    <DropDownItemBinding TextField="dept_desc" ValueField="dept_code" />
</ig:WebDropDown>
<asp:SqlDataSource ID="WDDL1SqlDataSource" runat="server"
                                       ConnectionString="<%$ ConnectionStrings:PDMConnectionString %>"
                                       OnDataBinding="WDDL1SqlDataSource_OnDataBinding"
                                       SelectCommandType="StoredProcedure"
                                       SelectCommand="SELECT_MASTER_PRACTICE_LIST" >
</asp:SqlDataSource>

***********************************
This is the Javascript function that is called in WDDL1's SelectionChanged ClientEvent:

function WDDL1Changed(sender, e) {
    var ddlWDDL2 = $find(WDDL2_id);
   
    var newSelection = e.getNewSelection()[0].get_value();

   --get reference to hidden field that stores selected value from WDDL1
    var hdnPPval = document.getElementById(hdnPPval_id);
   hdnPPval.value = newSelection;

   ddlWDDL2.loadItems(newSelection);
}
***********************************

<ig:WebDropDown ID="WDDL2" runat="server" EnablePaging="false"
                   PageSize="10" DataSourceID="WDDL2SqlDataSource4"
                   Width="375" OnItemsRequested="WDDL2_OnItemsRequested"
                   OnDataBound="WDDL2_OnDataBound"
                   selectedValue='<%#DataBinder.Eval(Container.DataItem,"nom") %>'
                   OnPreRender="WDDL2_PreRender"
                   OnSelectionChanged="WDDL2_OnSelectionChanged"
                   EnableRenderingAnchors="false" ForeColor="Black" >
          <DropDownItemBinding TextField="label" ValueField="nom_cd" />
</ig:WebDropDown>
<asp:SqlDataSource ID="WDDL2SqlDataSource4" runat="server"
             ConnectionString="<%$ ConnectionStrings:PDMConnectionString %>"
             OnDataBinding="WDDL2SqlDataSource4_OnDataBinding"
             SelectCommand = "select ' ' dept_cd, '%' nom_cd,
                                                    '---PDM NOM GROUPING---' label,
                                                    'AA' desc2, 'AAA' sort_order
                                          union
                                          select pn.dept_cd dept_cd,pn.nom nom_cd,
                                                   m.nature_desc + ' (' + pn.nom + ')' label,
                                                   m.nature_desc desc2,'AAB' sort_order
                                         from TABLE1 pn,
                                                TABLE2 m
                                         where pn.nom = m.nature_cd
                                         and pn.dept_cd like @dept_cd 
                                         and len(m.nature_cd) = 3
                                         union
                                         select ' ' dept_cd, '%' nom_cd,
                                                   '---MASTER LIST OF NOMS---'  label,
                                                   'BB' desc2, 'BBB' sort_order
                                         union
                                         select ' ' dept_cd, nature_cd nom_cd,
                                                   m.nature_desc + ' (' + m.nature_cd + ')' label,
                                                   m.nature_desc desc2,
                                                   'BBC' sort_order
                                         from TABLE3 m 
                                         where len(m.nature_cd) = 3
                                         order by sort_order, desc2 ">
<SelectParameters><asp:Parameter Name="dept_cd" DbType="String" DefaultValue="%" />
</SelectParameters>
</asp:SqlDataSource>

<ig:WebDropDown ID="WDDL3" runat="server" selectedValue='<%# Eval("lsc") %>'
          DataSourceID="WDDL3SqlDataSource" Width="375px"
          EnablePaging="false" PageSize="10" EnableRenderingAnchors="false"
          ForeColor="Black"  OnPreRender="WDDL3_OnPreRender"
         OnDataBound="WDDL3_OnDataBound" >
   <DropDownItemBinding TextField="ud_desc" ValueField="udvalue" />
</ig:WebDropDown>
<asp:SqlDataSource ID="WDDL3SqlDataSource" runat="server"
           OnDataBinding="WDDL3SqlDataSource_OnDataBinding"
           ConnectionString="<%$ ConnectionStrings:PDMConnectionString %>"
           SelectCommandType="StoredProcedure"
           SelectCommand="SELECT_MASTER_LSC" >
</asp:SqlDataSource>

Is there a way to retain this functionality and fire ClientEvents ONLY after the selection is made in WDDL2 and WDDL3?

Thank you,
Chris

 

Parents Reply Children
No Data