Dual Combo : Populate checkboxlist on OnClientSelectedIndexChanging

[Carlo]

Hi

Could someone please tell me if it is possible to populate a server side control at OnClientSelectedIndexChanging.

I have a dual combo box - the first dropdown fires the second one. When I select a value in the second dropdown, I'd like the OnClientSelectedIndexChanging event (or relevant event) to pass a param to server side so that a checkboxlist can be populated.

Here's some code I've been using :

<p>
            <label class="Label">Site</label>
            <div style=" padding-left:155px;">

                     <telerik:radcombobox
                    id="ddnSite"
                    Runat="server"
                    Height="140px"
                    Width="215px"
                    Skin="Default"
                    OnClientSelectedIndexChanging="LoadUsers" />

                    </div>
        </p>

        <p>
            <label class="Label">Advertiser</label>
            <div style=" padding-left:155px;">
            <telerik:radcombobox
                    id="ddnUser"
                    Runat="server"
                    Height="140px"
                    Width="215px"
                    Skin="Default"
                    OnClientItemsRequested="ItemsLoaded" OnClientSelectedIndexChanging="UserOnClientSelectedIndexChanged"
                    OnItemsRequested="ddnUser_ItemsRequested" EnableLoadOnDemand="true" />
           </div>
        </p>


<script type="text/javascript">

    function UserOnClientSelectedIndexChanged(sender, args) {
        ShowContent("<%=PanelBanner.ClientID%>");
        var usersCombo = $find("<%=ddnUser.ClientID%>");
        var item = args.get_item();
        //if (item.get_index() > 0) {
        //usersCombo.requestItems(item.get_value(), false);
        //}
        //alert(item.get_value());
    }

//    function Show() {
//        ShowContent("<%=PanelBanner.ClientID%>");
//    }

    function LoadUsers(combo, eventarqs) {
        var usersCombo = $find("<%=ddnUser.ClientID%>");
        var item = eventarqs.get_item();
        usersCombo.set_text("Loading...");

        if (item.get_index() > 0) {
            usersCombo.requestItems(item.get_value(), false);
        }
        else {
            usersCombo.set_text(" ");
            usersCombo.clearItems();
        }
    }

    function ItemsLoaded(combo, eventarqs) {
        var usersCombo = $find("<%=ddnUser.ClientID%>");
        if (combo.get_items().get_count() > 0) {
            combo.set_text(combo.get_items().getItem(0).get_text());
            combo.get_items().getItem(0).highlight();
        }
        combo.showDropDown();
    }

    function ShowContent(d) {

        if (document.getElementById) { // DOM3 = IE5, NS6

            document.getElementById(d).style.visibility = "";

        } else {

            if (document.layers) { // Netscape 4

                document.d.visibility = "";

            } else { // IE 4

                document.all.d.style.visibility = "";

            }

        }

        //if(d.length < 1) { return; }

        //document.getElementById(d).style.visibility = "";

    }



    function HideContent(d) {

        document.getElementById(d).style.visibility = "hidden";

        //alert(d);

        if (document.getElementById) { // DOM3 = IE5, NS6

            document.getElementById(d).style.visibility = "hidden";

        } else {

            if (document.layers) { // Netscape 4

                document.d.visibility = "hidden";

            } else { // IE 4

                document.all.d.style.visibility = "hidden";

            }

        }

        //if(d.length < 1) { return; }

    }


</script>

<%
if(UserId.Length > 0)
{
%>
<script type="text/javascript">
    ShowContent("<%=PanelBanner.ClientID%>");
</script>
<%
}
 %>

void LoadUsers(String siteId)
    {
        ddnUser.Items.Clear();
        MembershipUserCollection users = new MembershipUserCollection();
        MembershipUserCollection usersFinal = null;

        users = MembershipUserCache.GetAllMembershipUsers(dbConn());

        if (users != null)
        {
            usersFinal = Filter(users, Convert.ToInt32(siteId));
            foreach (MembershipUser u in usersFinal)
            {
                ProfileCommon p = Profile.GetProfile(u.UserName);
                ddnUser.Items.Add(new RadComboBoxItem(p.Name, Membership.GetUser(u.UserName).ProviderUserKey.ToString()));
            }
        }

        ddnUser.Items.Insert(0, new RadComboBoxItem("- Select an Advertiser -", "- Select an Advertiser -"));
    }

    protected void ddnUser_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)
    {
        LoadUsers(e.Text);
    }

[Princy]

Hi carlo,

One suggestion would be using the RadAjaxManager to send the AjaxRequest in order to populate the CheckBoxList based on second RadCombobBox selection. See the example that I tried.

ASPX:

<telerik:RadComboBox ID="ddnUser" runat="server" Height="140px" Width="215px"
    OnClientItemsRequested="ItemsLoaded" OnClientSelectedIndexChanged="OnClientSelectedIndexChanged" OnClientSelectedIndexChanging="UserOnClientSelectedIndexChanged"
    OnItemsRequested="ddnUser_ItemsRequested" EnableLoadOnDemand="true" />

<asp:CheckBoxList ID="CheckBoxList1" runat="server">
</asp:CheckBoxList>

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="CheckBoxList1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManager>

JavaScript:

<script type="text/javascript">
function OnClientSelectedIndexChanged(sender, args)
{
    var item = sender.get_text();
    $find("<%=RadAjaxManager1.ClientID%>").ajaxRequest(item)
}
</script>

CS:

protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)
{
    // e.Argument.ToString() represents second radcombobox selected item
    // Populate the checkboxlist
}

Thanks,
Princy.