RadGrid : selection of any RadCombobox of these 2 columns at first and the second RadCombobox will be disabled.

[Jai]

Hi,

I have grid where i have 2 RadCombobox in 2 columns of Radgrid. See below

<telerik:GridTemplateColumn UniqueName="XYZDropDownType" HeaderText="XYZ DropDown Type"
                SortExpression="XYZDropDownType">
                <ItemTemplate>
                    <%#DataBinder.Eval(Container.DataItem,"XYZDropdownType")%>
                </ItemTemplate>
                <EditItemTemplate>
                    <telerik:RadComboBox ID="RadComboBox2" runat="server" DataTextField="Description"
                        Width="150px" MaxHeight="200" SkinID="EzComboBox" DataSourceID="ObjectDataSource2"
                        AppendDataBoundItems="true" DataValueField="XYZDropdownTypeId" SelectedValue='<%#Bind("XYZDropdownTypeId") %>'
                        EnableVirtualScrolling="True">
                        <Items>
                            <telerik:RadComboBoxItem Text="Choose One" Value="" />
                        </Items>
                    </telerik:RadComboBox>
                </EditItemTemplate>
            </telerik:GridTemplateColumn>
            <telerik:GridTemplateColumn UniqueName="ABCType" HeaderText="ABC Type"
                SortExpression="ABCTypeName">
                <ItemTemplate>
                    <%#DataBinder.Eval(Container.DataItem,"ABCTypeName")%>
                </ItemTemplate>
                <EditItemTemplate>
                    <telerik:RadComboBox ID="RadComboBox3" runat="server" DataTextField="Type" Width="160px"
                        MaxHeight="200" SkinID="EzComboBox" DataSourceID="ObjectDataSource3" AppendDataBoundItems="true"
                        DataValueField="ABCTypeId" SelectedValue='<%#Bind("ABCTypeId") %>'
                        EnableVirtualScrolling="True">
                        <Items>
                            <telerik:RadComboBoxItem Text="Choose One" Value="" />
                        </Items>
                    </telerik:RadComboBox>
                </EditItemTemplate>
            </telerik:GridTemplateColumn>

Now what i want. On selection of any RadCombobox of these 2 column at first, the second RadCombobox will be disabled. means We can not select both combobox Values at the same time. either First combobox or second one not both at the same time in Edit Command

Can anyone tell me How to do that ?

Thanks,
--Jai

[Jayesh Goyani]

Hi,

  <telerik:RadComboBox ID="RadComboBox1" runat="server" AutoPostBack="true"
  OnSelectedIndexChanged="RadComboBox1_SelectedIndexChanged">
 <Items>
<telerik:RadComboBoxItem Text="Choose One" Value="0" />
</Items>
</telerik:RadComboBox>


  <telerik:RadComboBox ID="RadComboBox2" runat="server" AutoPostBack="true"
  OnSelectedIndexChanged="RadComboBox2_SelectedIndexChanged" >
 <Items>
<telerik:RadComboBoxItem Text="Choose One" Value="0" />
</Items>
</telerik:RadComboBox>

protected void RadComboBox1_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
        {

       RadComboBox RadComboBox1 = (RadComboBox)sender;
       GridEditFormItem editItem = (GridEditFormItem)RadComboBox1.NamingContainer;
       RadComboBox RadComboBox2 = (RadComboBox)editItem.FindControl("RadComboBox2");
       if(RadComboBox1.SelectedValue != "0")
       {
            RadComboBox2.Enabled = False;
       }
        else
       {
        RadComboBox2.Enabled = true;
       }

   }

   protected void RadComboBox2_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
        {

       RadComboBox RadComboBox2 = (RadComboBox)sender;
       GridEditFormItem editItem = (GridEditFormItem)RadComboBox2.NamingContainer;
       RadComboBox RadComboBox1 = (RadComboBox)editItem.FindControl("RadComboBox1");
       if(RadComboBox1.SelectedValue != "0")
       {
            RadComboBox1.Enabled = False;
       }
       else
       {
        RadComboBox1.Enabled = true;
       }


   }

If this is not your case, please elaborate the scenario or let me know if any concern.

Thanks,
Jayesh Goyani

[Jai]

Hi ,

Jayesh, No luck. The approch you gave me is not fullfil my senario.

Can we do this in Javascript so that there will be no post back ? If yes, Can any one tell me how to do that ?

Thanks,
--Jai

[Jayesh Goyani]

function LogicforEnableandDisableCombo(cmb1, cmb2) {
        var Tempcmb1=  document.getElementById(cmb1);
        var Tempcmb2=  document.getElementById(cmb2);
            // your logic should come here
        }
    }

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)

{

    if ((e.Item is GridEditableItem) && (e.Item.IsInEditMode))

    {

        GridEditableItem edititem = (GridEditableItem)e.Item;

        RadComboBox RadComboBox1 = (RadComboBox)edititem["XYZDropDownType"].FindControl("RadComboBox1");

        RadComboBox RadComboBox2 = (RadComboBox)edititem["ABCType"].FindControl("RadComboBox2");

         

        RadComboBox1.Attributes.Add("onclick", "LogicforEnableandDisableCombo('" + RadComboBox1.ClientID + "','" + RadComboBox2.ClientID + "')");

        RadComboBox2.Attributes.Add("onclick", "LogicforEnableandDisableCombo('" + RadComboBox1.ClientID + "','" + RadComboBox2.ClientID + "')");

    }

}


Thanks,
Jayesh Goyani


[Shinu]

Hello Jai,

You can achieve this by attaching OnClientLoad event to RadComboBox and save the combobox ID globally and disable the required combobox in OnClientSelectedIndexChanged event.

aspx:

<telerik:GridTemplateColumn UniqueName="TemplateCol">
          . . . .  .
     <EditItemTemplate>
          <telerik:RadComboBox ID="RadCombobox1" runat="server" OnClientLoad="OnClientLoad1"
             OnClientSelectedIndexChanged="OnClientSelectedIndexChanging">
          </telerik:RadComboBox>
     </EditItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn HeaderText="Actions" UniqueName="Actions">
           . . . .
     <EditItemTemplate>
           <telerik:RadComboBox ID="RadCombobox2" runat="server" OnClientLoad="OnClientLoad1"
            OnClientSelectedIndexChanged="OnClientSelectedIndexChanging">
            </telerik:RadComboBox>
     </EditItemTemplate>
</telerik:GridTemplateColumn>

Javascript:

<script type="text/javascript">
    var combo1, combo2;
    function OnClientLoad1(sender)
     {
        combo1 = sender;
     }
    function OnClientLoad2(sender)
     {
        combo2 = sender;
     }
    function OnClientSelectedIndexChanging(sender, args)
    {
        if (sender == combo1)
       {
            combo2.disable();
        }
        else
       {
            combo1.disable();
        }
    }
</script>

Thanks,
Shinu.

[Jai]

Hi Shinu,

I want to put one more condition under OnClientSelectedIndexChanging function. Before disabling the other combo i want to check that sender combo current selectedItem and if it is "Choose one" then the other combo will be enable else disable. I am trying to do like seneder.SelectedItem.Text in OnClientSelectedIndexChanging function but everytime i am getting unidentified object error. Can you tell me how to do that ?

Thanks
--Jai

[Shinu]

Hello Jai,

You can access the currently selected text like follows.
javascript:

function OnClientSelectedIndexChanging(sender, args)

  {

        if (args.get_item().get_text() == "Choose an Item")

        {

            alert("Choose an Item");

            args.set_cancel(true);//cancelling the event


        }

        if (sender == combo2)

        {

            combo1.disable();      

        }

        else if(sender == combo1) {

            combo2.disable();

        }

    }

Also take a look at the following documentation for more on RadComboBox client side API.
Client-Side Basics.

Thanks,
Shinu.

[Jai]

Thanks Shinu. Really appriciate your help. It works perfect as it is i wanted.

Thanks
--Jai