get value from client side

[Brian]

Hello

I’m trying to return a column value from a radgrid client-side after a LinkButton is clicked in a GridTemplateColumn (the other columns are generated dynamically) and open a radWindow.  I have looked through the documentation and posts and found some useful information but am still unable to accomplish this task.

I am able to return the correct value using the following code when different rows are clicked in the grid:

SCRIPT

----------------------------------

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

   

<script type="text/javascript">

 function RowSelected(sender, eventArgs)

 {

   var dataItem = $get(eventArgs.get_id());

   var grid = sender;

   var MasterTable = grid.get_masterTableView();

   var row = MasterTable.get_dataItems()[dataItem.rowIndex - 1];

   var cell = MasterTable.getCellByColumnUniqueName(row, "appID");

   //here cell.innerHTML holds the value of the cell

   //alert(cell.innerHTML);

  

   var window = radopen("../appointmentInfo.aspx?EID=" + cell.innerHTML,"RadWindow1");

   window.center();

 }

</script>

</telerik:RadCodeBlock>

----------------------------------

GRID CODE

----------------------------------

<telerik:RadGrid id="gridResults" runat="server" Skin="Telerik" AllowSorting="True" GridLines="None" DataSourceID="ObjectDataSource1" Style="left: 0px; top: 5px; position: relative;" Width="950px" ShowGroupPanel="True">

<MasterTableView allownaturalsort="False" DataSourceID="ObjectDataSource1" ClientDataKeyNames="appID" DataKeyNames="appID">

<RowIndicatorColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</RowIndicatorColumn>

<ExpandCollapseColumn>

<HeaderStyle Width="20px"></HeaderStyle>

</ExpandCollapseColumn>

<Columns>

<telerik:GridTemplateColumn HeaderText="View" UniqueName="TemplateColumn">

<ItemTemplate>

<asp:LinkButton ID="lnkBtnView" runat="server" CommandName="ViewApp" Style="position: relative" ToolTip="View the Appointment" OnClientClick="GetSelectedID()">View</asp:LinkButton>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

<ClientSettings AllowDragToGroup="True">

<ClientEvents OnCommand="function(){}" OnRowSelected="RowSelected" />

<Selecting AllowRowSelect="True" />

</ClientSettings>

<FilterMenu EnableTheming="True" Skin="Telerik">

<CollapseAnimation Duration="200" Type="OutQuint" />

</FilterMenu>

</telerik:RadGrid>

----------------------------------

The above code works properly.  However, I would like to open the window when the link button in the grid is clicked rather than when a row is clicked.  The following code works when I call the ‘GetSelectedID’ function from the ‘OnClientClick’ event for the link button, but always returns value from the first row due to the index setting of [0] when getting the value for var DataItem.

function GetSelectedID()

{

    var DataItem = $find("<%= gridResults.ClientID %>").get_masterTableView().get_dataItems()[0];

    var keyValue = DataItem.getDataKeyValue("appID")

    var oWnd = radopen("../appointmentInfo.aspx?EID=" + keyValue,"RadWindow1");

    oWnd.Center();

      

    //alert(keyValues);

}

Is there a way to return the index of the row that is clicked in function GetSelectedID() or an alternate way of accomplishing this?

Thanks for any suggestions,

Brian

[Shinu]

Hello Brian,

You can pass the index of the row to the click event of  the linkbutton as shown below.
cs:

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)
    {
       if (e.Item is GridDataItem)
        {
            GridDataItem dataItem = (GridDataItem)e.Item;
            LinkButton lnkButton =(LinkButton) dataItem.FindControl("lnkBtnView");

            lnkButton.OnClientClick = string.Format("return GetSelectedID('{0}')", e.Item.ItemIndex);
        }
    }

js:

function GetSelectedID(itemClientIndex)
{
          var RadGrid1 = $find("<%= RadGrid1.ClientID %>");
          var keyvalue = RadGrid1.get_masterTableView().get_dataItems()[itemClientIndex].getDataKeyValue("appID");

          alert(keyvalue)
}

Thanks
Shinu.

[Brian]

Hi Shinu

Thanks a lot for your reply - that's exactly what I was looking for and my grid is now working how I want.

One quick follow-up question if you don't mind...

Am I correct in assuming that the ('{0}') represents the first argument in my js function? 

What if I had a function with two arguments, for instance? As as test I have tried to pass in a second value but without any luck.  Are you able to provide the syntax assuming that my function had two arguments and that I wanted to pass in e.EventInfo.EventName as the second value?

Thanks again for your help - it's much appreciated

Brian

[Brian]

Guess I could have tried this before...

LinkButton1.OnClientClick =

String.Format("return GetSelectedID('{0}','{1}')", e.Item.ItemIndex, e.EventInfo.EventName)

For a function with two arguments...

Thanks,

Brian