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

Finding a column(GridTemplate col) in a row of a radgrid via javascript

2 Answers 280 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Neal
Top achievements
Rank 1
Neal asked on 06 Aug 2010, 08:38 AM
Hi

I've tried several options to retrieve a label and or textboxes via javascript on my grid in the OnClientClose (which retrieves values I want to insert into a (checkbox) selected row.

I get as far as getting into the "iterating thru the dataitems " ,(loops thru 16 rows correctly)  
BUT,  getting the column or/and the labels by their unique id is a problem.
I am using Telerik RaControls v2009.2

The column markup is

<telerik:GridTemplateColumn   UniqueName ="ORateCBX" > 
    <ItemTemplate> 
        <asp:CheckBox            ID="cbxORate" 
                runat="server"  Width="100%" height = "18px"   AutoPostBack="true" 
                OnCheckedChanged="cbxORate_CheckedChanged"/> 
        <asp:Label                   id="lblORate_Id" " 
                runat="server    Visible="false" Width="5px" height = "18px"></asp:Label> 
        <asp:TextBox                id="txtORate" 
                runat="server"   Visible="false" Width="5px" height = "18px"></asp:TextBox> 
        <asp:TextBox                id="txtReason"
                runat="server"  Visible="false" Width="5px" height = "18px"></asp:TextBox>
   </ItemTemplate>
</telerik:GridTemplateColumn>

The javascript (in onClientClose)

 

var arg = args.get_argument();

if (arg)

{

  var RatePerc = arg.RatePerc;

  var seldate = arg.Reason;

  var masterTableView;

  var length;

  var grid = $find("<%

= grvCoverelements.ClientID %>");

 

  if (grid)

  {

    masterTableView = grid.get_masterTableView();

  }

  if (masterTableView)

  {

    var firstDataItems = masterTableView.get_dataItems();

    if (firstDataItems)

    {

       length = firstDataItems.length;

       // alert("length = " + length);

    }

    for (var i = 0; i < length; i++)

    {

       alert(i ); //Successful

       var dataItem = firstDataItems[i].get_element("ORateCBX");

      if (dataItem)

      {

         //unsuccessful condition everytime...i.e. not getting the GridTemplateColumn UniqueName ="ORateCBX"

         alert("dataItem is " + dataItem);

         // 1. Is it the correct row (the one the user clicked on to insert (via popup) the new values from args.

 

        if (checkBox && checkBox.checked )

       {

            // 1. Get the rate textbox

            var txtRate = dataItem.findElement("txtORate");

            //2. Is it the correct row and checkbox

             if ( txtRate.value =" " )

           {

               //3. Insert the new value from Arg.RatePerc

                txtRate.value = Arg.RatePerc;

               //4 Insert the new value from Arg.Reason

                var txtReason = dataItem.findElement("txtReason");

                txtReason.value = Arg.Reason;

            }

        }

    }

}

__doPostBack(

"NewOrate", arg);

}

 

In other words it never finds the Column (GridTemplate col with the unique name of "ORateCBX" ???

I have tried this approach as well, but it does not even iterate thru the grids rows!

// for (var i=0; i < masterTableView.Rows.length; i++)

// {

    // alert("looping" ); //...............//NOT successful

    // var cell = masterTableView.GetCellByColumnUniqueName(masterTableView.Rows[i] , "ORateCBX");

    // if (cell) {alert("Cell")};

        // var dataItem = dataitems[i].findElement("txtORate")[0];

        // if (checkBox && checkBox.checked)

        // {

             // Find the textboxes   "txtRate and TxtReason and populate them from args

       /// }

// }


Thanks
Neal

2 Answers, 1 is accepted

Sort by
0
Princy
Top achievements
Rank 2
answered on 06 Aug 2010, 11:32 AM
Hello Neal,

Check out the following client side code which shows how to loop through each griditem and access the Textbox and Label inside ItemTemplate of GridTemplate column.

C#:
<script type="text/javascript">
      function OnButtonClick()
      {
        var grid = $find("<%=grvCoverelements.ClientID %>");
        var MasterTable = grid.get_masterTableView();
        var length = MasterTable.get_dataItems().length;
        for (var i = 0; i < length; i++)
        {
            var lblORate_Id = MasterTable.get_dataItems()[i].findElement("lblORate_Id");//access the Label control
            lblORate_Id.innerText = "label";// assigning value to label control
            var txtORate = MasterTable.get_dataItems()[i].findElement("txtORate");//access the TextBox control
            txtORate.innerText = "txtORate";// assigning value to TextBox control
            var txtReason = MasterTable.get_dataItems()[i].findElement("txtReason");
            txtReason.innerText = "txtReason";
         }
      }
</script>

And also refer the documentation findElement()

Thanks,
Princy.
0
Neal
Top achievements
Rank 1
answered on 10 Aug 2010, 01:25 PM
Thanks Princy,

I now have a grid which has a bunch of cols , 3 of which contain checkboxes and some other controls (labels + textboxes).
If the user clicks on the OtherRate checkbox col and on postback I do a few things, like save row index,  from the  

(

GridDataItem)chkbx.NamingContainer, and the Eventargs and originating object "Sender",  then popup a radwindow from Server, capture a ratePercentage and Reason) and onclose transmits those as args to the Grid page, inserts them into the textboxes, forces a Postback, which I pick up on server side, and use those inserted vals to calculate a result which I put into a Value col and add to my Footer total, and on Save, I iterate thru the items/rows and using the saved row index gained from the checkbox on which row clicked,  and write those away to dbase, as part of a quoting system.

Very neat thanks
Neal

Tags
Grid
Asked by
Neal
Top achievements
Rank 1
Answers by
Princy
Top achievements
Rank 2
Neal
Top achievements
Rank 1
Share this question
or