RadCombobox inside Radgrid with selected item changed

[Satish]

Hi,
I have a radcombobox inside radgrid. On Add new record I created only a insert template of multi column combo box(containing columns like  main rad grid). I can select a single row in combo box. Now I need to populate all the other column values of main rad grid from the selected row values of combo box. how can we do this in client side. What is the best approach for this. 

[Jayesh Goyani]

Hello,

Please try with below code snippet.

function ClientSelectedIndexChanged(sender, args) {
               var SenderId = sender.get_element().id;
               var radcombobox1 = $find(SenderId);
               var radtextbox1 = $find(SenderId.replace("RadComboBox1", "RadTextBox1"))

               radtextbox1.set_value(args.get_item().get_attributes().getAttribute("Name"));


           }

<telerik:GridTemplateColumn>
                       <InsertItemTemplate>
                           <telerik:RadComboBox ID="RadComboBox1" runat="server" HighlightTemplatedItems="true"
                               OnClientSelectedIndexChanged="ClientSelectedIndexChanged" Width="300px">
                               <HeaderTemplate>
                                   <table cellspacing="0" cellpadding="0" border="1" width="205px">
                                       <tr>
                                           <td style="width: 100px;">
                                               Text
                                           </td>
                                           <td style="width: 100px;">
                                               Name
                                           </td>
                                       </tr>
                                   </table>
                               </HeaderTemplate>
                               <ItemTemplate>
                                   <table cellspacing="0" cellpadding="0" border="1">
                                       <tr>
                                           <td style="width: 100px;">
                                               <%# DataBinder.Eval(Container, "Text")%>
                                           </td>
                                           <td style="width: 100px;">
                                               <%# DataBinder.Eval(Container, "Attributes['Name']")%>
                                           </td>
                                       </tr>
                                   </table>
                               </ItemTemplate>
                           </telerik:RadComboBox>
                       </InsertItemTemplate>
                   </telerik:GridTemplateColumn>

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
        {
            if (e.Item.IsInEditMode && e.Item is GridEditFormInsertItem)
            {
                GridEditFormInsertItem Insertitem = e.Item as GridEditFormInsertItem;
                RadComboBox RadComboBox1 = Insertitem.FindControl("RadComboBox1") as RadComboBox;

                for (int i = 0; i < 10; i++)
                {
                    RadComboBoxItem item = new RadComboBoxItem();

                    item.Text = "Text" + i;
                    item.Value = "Value" + i;
                    item.Attributes.Add("Name", "Name" + i);

                    RadComboBox1.Items.Add(item);

                    item.DataBind();
                }
            }

}

For more info also check below link.
http://jayeshgoyani.blogspot.in/2012/07/access-another-control-which-was-in.html

Thanks,
Jayesh Goyani

[Satish]

Thanks. I got the values from the combo box. But I am stuck at placing the read value in newly inserting row of grid. I am using

 

telerik

 

 

:GridBoundColumn columns
Can we access gridboundcolumn from javascript and set the text there?

[Jayesh Goyani]

Hello,

Please check below code snippet.

<telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" OnNeedDataSource="RadGrid1_NeedDataSource"

          


           OnItemDataBound="RadGrid1_ItemDataBound" 

           >

           <MasterTableView CommandItemDisplay="Top" DataKeyNames="ID" Name="Parent" HierarchyLoadMode="Client">

               <Columns>

                   <telerik:GridBoundColumn DataField="ID" UniqueName="ID" HeaderText="ID">

                   </telerik:GridBoundColumn>

                   <telerik:GridBoundColumn DataField="Name" UniqueName="Name" HeaderText="Name">

                   </telerik:GridBoundColumn>

                   <telerik:GridTemplateColumn>

                       <InsertItemTemplate>

                           <telerik:RadComboBox ID="RadComboBox1" runat="server" HighlightTemplatedItems="true"

                               OnClientSelectedIndexChanged="ClientSelectedIndexChanged" Width="300px">

                               <HeaderTemplate>

                                   <table cellspacing="0" cellpadding="0" border="1" width="205px">

                                       <tr>

                                           <td style="width: 100px;">

                                               Text

                                           </td>

                                           <td style="width: 100px;">

                                               Name

                                           </td>

                                       </tr>

                                   </table>

                               </HeaderTemplate>

                               <ItemTemplate>

                                   <table cellspacing="0" cellpadding="0" border="1">

                                       <tr>

                                           <td style="width: 100px;">

                                               <%# DataBinder.Eval(Container, "Text")%>

                                           </td>

                                           <td style="width: 100px;">

                                               <%# DataBinder.Eval(Container, "Attributes['Name']")%>

                                           </td>

                                       </tr>

                                   </table>

                               </ItemTemplate>

                           </telerik:RadComboBox>

                       </InsertItemTemplate>

                   </telerik:GridTemplateColumn>

                   <telerik:GridEditCommandColumn>

                   </telerik:GridEditCommandColumn>

               </Columns>

           </MasterTableView>

       </telerik:RadGrid>

var mycombo;
         var txtID;
         var txtName;

         function ClientSelectedIndexChanged(sender, args) {
             mycombo = sender;

             txtID = $("#" + mycombo.get_id()).parent().parent().parent().parent().parent().parent().find('input')[0].id;
             txtName = $("#" + mycombo.get_id()).parent().parent().parent().parent().parent().parent().find('input')[1].id;
             $("#" + txtID).get(0).value = "0";
             $("#" + txtName).get(0).value = "NewName";

         }

protected void RadGrid1_NeedDataSource(object sender, GridNeedDataSourceEventArgs e)
       {
           dynamic data = new[] {
             new { ID = 1, Name ="aaa"},
             new { ID = 2, Name = "bbb"},
             new { ID = 3, Name = "ccc"},
             new { ID = 4, Name = "ddd"},
              new { ID = 5, Name ="eee"}
           };
           RadGrid1.DataSource = data;
       }

       protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
       {
           if (e.Item.IsInEditMode && e.Item is GridEditFormInsertItem)
           {
               GridEditFormInsertItem Insertitem = e.Item as GridEditFormInsertItem;
               RadComboBox RadComboBox1 = Insertitem.FindControl("RadComboBox1") as RadComboBox;

               for (int i = 0; i < 10; i++)
               {
                   RadComboBoxItem item = new RadComboBoxItem();

                   item.Text = "Text" + i;
                   item.Value = "Value" + i;
                   item.Attributes.Add("Name", "Name" + i);

                   RadComboBox1.Items.Add(item);

                   item.DataBind();
               }
           }
       }

Add or remove ".Parent()" from js code as per above code or your container.

Try to get Insert or edit row to get both textbox (ID column's textbox and Name column's textbox).

I have used Jquery so do not forget to add in your page.


Thanks,
Jayesh Goyani

[Satish]

Hi Jayesh,
Thanks for the solution. It seems to be complex in my requirement. bcz i sometimes need to add 2-5 rows of data depending on the other variable. So I decided to add a new row in this way
http://demos.telerik.com/aspnet-ajax/grid/examples/client/insertupdatedelete/defaultcs.aspx
Is it possible to do in this way by using plain javascript? If it works, i need to add few more depending on another variable values.

[Jayesh Goyani]

Hello,

Please try with below code snippet.

function ClientSelectedIndexChanged(sender, args) {

               var txtName = sender.get_attributes().getAttribute("Name");

               $("#" + txtName).get(0).value = "NewName";

           }

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
       {

           if (e.Item.IsInEditMode && e.Item is GridEditFormInsertItem)
           {
               GridEditFormInsertItem Insertitem = e.Item as GridEditFormInsertItem;
               RadComboBox RadComboBox1 = Insertitem.FindControl("RadComboBox1") as RadComboBox;

               TextBox txtId = Insertitem["ID"].Controls[0] as TextBox;
               TextBox txtName = Insertitem["Name"].Controls[0] as TextBox;

               RadComboBox1.Attributes.Add("Myid", txtId.ClientID);
               RadComboBox1.Attributes.Add("Name", txtName.ClientID);

               for (int i = 0; i < 10; i++)
               {
                   RadComboBoxItem item = new RadComboBoxItem();

                   item.Text = "Text" + i;
                   item.Value = "Value" + i;
                   item.Attributes.Add("Name", "Name" + i);

                   RadComboBox1.Items.Add(item);

                   item.DataBind();
               }
           }

       }

Thanks,
Jayesh Goyani