This is a migrated thread and some comments may be shown as answers.

Clientside - Find radcombo control in Header

2 Answers 94 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Wired_Nerve
Top achievements
Rank 2
Wired_Nerve asked on 04 Dec 2013, 07:24 PM
I have been looking for a means to find a radcombo control where I know the name of the control  (for example RadCombo ID =" RadComboColumn1" ) in a radGrid header...  CLIENT SIDE JAVASCRIPT

Any suggestions?


function confirmCallBackFn(arg) {
              if (arg == false) {
                  $.unblockUI();
                  return false;
              }
              $.unblockUI();
               
 
              var grid = $find("<%=RadGridImport.ClientID %>");
              var masterTableView = grid.get_masterTableView();
              var columns = masterTableView.get_columns();
              var columnCount = masterTableView.get_columns().length;
 
              //TODO:  Loop and get collection of radcombo's in headers and selected value.
              var selectedColumnFields = new Array();
              for (var i = 0; i < columnCount; i++) {
                  //TODO:  Find control in radgrid hearder.
                  var col = columns[i]????????;
var RadCombo = ????
                //.get_item().findControl("columm1");
              }
  
              __doPostBack("<%= FinishButton.UniqueID %>", "");
              return true;
          }

While this code works on the serverside, I am needing to convert this to the clientside:  var columnComboBox = headers[0].FindControl(columnName) as RadComboBox;


private List<ValueName> GetUserSelectedColumnMapping()
       {
           //Get the number of columns in the dynamic grid -2 hidden columns
           int radGridColumnCount = RadGridImport.MasterTableView.RenderColumns.Count() - 2;
 
           //Selected Column Type Mapping translates a dynamic column to a valid database table field.
           var selectedColumnTypeMapping = new List<ValueName>();
           GridItem[] headers = RadGridImport.MasterTableView.GetItems(GridItemType.Header);
           for (int i = 0; i < radGridColumnCount; i++)
           {
               string columnName = String.Format("Column{0}", i);  //Column{value} is set in the radgrid item created event.
               var columnComboBox = headers[0].FindControl(columnName) as RadComboBox;
               string selectedText = string.Empty;
               if (columnComboBox != null)
               {
                   var selected = columnComboBox.SelectedValue;
                   if (columnComboBox.SelectedItem != null)
                   {
                       selectedText = columnComboBox.SelectedItem.Text;
                   }
 
                   //Add the users selection to the mapping list.
                   selectedColumnTypeMapping.Add(new ValueName() { Name = selectedText, Value = selected, ColumnIndex = i });
               }
           }
 
           return selectedColumnTypeMapping;
       }

2 Answers, 1 is accepted

Sort by
0
Accepted
Jayesh Goyani
Top achievements
Rank 2
answered on 05 Dec 2013, 08:26 AM
Hello,

Please try with the below code snippet.

http://www.telerik.com/community/forums/aspnet-ajax/grid/radgrid-header-template---how-access-the-controls-in-javascript.aspx#1590308

Let me know if any concern.

Thanks,
Jayesh Goyani
Scott
Top achievements
Rank 1
commented on 16 May 2022, 10:45 PM

Well, just like on stackoverflow, it's unfortunate when an answer only has a link and no content, because nine years later the link has gone stale.  What's the answer?
Vessy
Telerik team
commented on 17 May 2022, 07:00 AM

Hi Scott, 

The new link to the linked thread is: https://www.telerik.com/forums/radgrid-header-template---how-access-the-controls-in-javascript#1590308

You can see the content of the linked reply below:

 

One approach is to save the HeaderTemplate control ID in the Hidden Field and from the ItemCreatedEvent, and then access the TextBox using the HiddenField value. Here is a sample code.

aspx:

<telerik:GridTemplateColumn  . . . . . . . . . >
     <HeaderTemplate>
           <asp:TextBox ID="TextBox1" runat="server" Text="Text"></asp:TextBox>
      </HeaderTemplate>
</telerik:GridTemplateColumn>

C#:

protected void rad_ItemCreated(object sender, GridItemEventArgs e)
 {
     if (e.Item is GridHeaderItem)
     {
         GridHeaderItem hItem = (GridHeaderItem)e.Item;
         TextBox txt1 = (TextBox)hItem.FindControl("TextBox1");
         HiddenField1.Value = txt1.ClientID.ToString();
     }
 }

Client-side:

function ButtonClick()// accessing the HeaderTemplate TextBox value from external Button click.
  {
      var hidden = document.getElementById("HiddenField1");
      var txtBox = document.getElementById(hidden.value);
      alert(txtBox.value);
  }

 

 

0
Wired_Nerve
Top achievements
Rank 2
answered on 09 Dec 2013, 02:21 PM
Jayesh Goyani,  thanks for pointing me in the right direction...

Here is what I finally ended up with:

function confirmCallBackFn(arg) {
    if (arg == false) {
        $.unblockUI();
        return false;
    }
    $.unblockUI();
     
 
    var grid = $find("<%=RadGridImport.ClientID %>");
    var masterTableView = grid.get_masterTableView();
    var columns = masterTableView.get_columns();
    var columnCount = masterTableView.get_columns().length;
 
    //TODO:  Loop and get collection of radcombo's in headers and selected value.
    var selectedColumnFields = new Array();
    for (var i = 0; i < columnCount; i++) {
        var result = $("#Column" + i.toString() + "_Input");
        alert(result.val());
        //TODO: Add Values to array for Ajax call to web method actions
    }
     
   // __doPostBack("<%= FinishButton.UniqueID %>", "");
    return true;
}
Tags
Grid
Asked by
Wired_Nerve
Top achievements
Rank 2
Answers by
Jayesh Goyani
Top achievements
Rank 2
Wired_Nerve
Top achievements
Rank 2
Share this question
or