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

Grid Global Template get Cell Values Client Side

1 Answer 65 Views

Grid

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

Loren Dorez asked on 25 Jul 2010, 01:32 AM

OK so i have a Grid that Uses a Global Template.

I need to get a cell value of the Selected record to compare it for validation. All i seem to get client-side is the Template Column HTML

Here is my Code

<telerik:RadGrid ID="ClassGrid" runat="server" AllowMultiRowSelection="false" AutoGenerateColumns="False"

OnNeedDataSource="ClassGrid_NeedDataSource" OnDataBound="ClassGrid_DataBound"

Skin="WebBlue" GridLines="Both" ShowGroupPanel="false" ShowHeader="true" OnItemDataBound="ClassGrid_ItemDataBound"

AllowPaging="true" PageSize="10" AllowFilteringByColumn="true">

<ExportSettings FileName="AvailableClassListExport" ExportOnlyData="true" OpenInNewWindow="True"

HideStructureColumns="true">

</ExportSettings>

<MasterTableView Width="100%" CommandItemDisplay="TopAndBottom" PagerStyle-AlwaysVisible="true">

<CommandItemSettings ShowAddNewRecordButton="false" ShowExportToExcelButton="true"

ShowExportToCsvButton="true" ShowExportToWordButton="true" ShowExportToPdfButton="true" />

<RowIndicatorColumn Visible="True">

</RowIndicatorColumn>

<ItemTemplate>

<div style="float:left; padding: 0px 15px 0px 0px">

<span><b>

<%#Eval("Class_Date", "{0:MMM dd, yyyy}")%></b>

<br />

<%#Eval("Class_Start_Time").ToString()%>

-

<%#Eval("Class_End_Time").ToString()%>

<br /><br /><br /><br /><br />

</span>

</div>

<div>

<span><b>

<%# Container.DataItem("Location_Name") %></b>

<%#IIf(Container.DataItem("isSpanish") = "Y", " (Spanish)", " (English)")%>

<br />

<%# Container.DataItem("Street_Address") %>

<br />

<%# Container.DataItem("City") %>,

<%# Container.DataItem("FK_State_Code") %>

<%# Container.DataItem("Zip") %>

<br />

<b>Cross Streets:</b>

<%# container.DataItem("Cross_Streets") %>

<br />

<%#"<a href=""http://www.mapquest.com/maps?city=" + Container.DataItem("City") + "&state=" + Container.DataItem("FK_State_Code") + "&address=" + Container.DataItem("Street_Address") + "&zipcode=" + Container.DataItem("Zip") + "&country=US&CID=lfmaplink"" target=""_Blank"">Map</a>"%>

|

<%#"<a href=""http://www.mapquest.com/maps?2c=" + Container.DataItem("City") + "&2s=" + Container.DataItem("FK_State_Code") + "&2a=" + Container.DataItem("Street_Address") + "&2z=" + Container.DataItem("Zip") + "&2y=US&Form=directions&CID=lfddlink"" target=""_Blank"">Directions</a>"%>

<br />

</span>

</div>

</ItemTemplate>

<Columns>

<telerik:GridBoundColumn DataField="Class_ID" Display="false" HeaderText="ID">

</telerik:GridBoundColumn>

<telerik:GridDateTimeColumn UniqueName="Class_Date" DataField="Class_Date" Display="true" HeaderText="Date"

AllowFiltering="true" PickerType="DatePicker" ItemStyle-Width="200px">

</telerik:GridDateTimeColumn>

<telerik:GridBoundColumn DataField="Class_Start_Time" Display="false" HeaderText="Start Time"

AllowFiltering="true">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Class_End_Time" Display="false" HeaderText="End Time"

AllowFiltering="true">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Location_Name" Display="false" HeaderText="Location">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Street_Address" Display="false" HeaderText="Address">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="City" Display="false" HeaderText="_City">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="FK_State_Code" Display="false" HeaderText="State">

</telerik:GridBoundColumn>

<telerik:GridDateTimeColumn DataField="Zip" Display="false" HeaderText="Zip">

</telerik:GridDateTimeColumn>

<telerik:GridBoundColumn DataField="Class_Status" Display="false" HeaderText="Status">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="isSpanish" Display="false" HeaderText="Spanish"

AllowFiltering="true">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="Location_DisplayCity" Display="false" HeaderText="City"

AllowFiltering="true">

</telerik:GridBoundColumn>

</Columns>

</MasterTableView>

<ClientSettings ReorderColumnsOnClient="True" AllowDragToGroup="True" AllowColumnsReorder="True">

<Selecting AllowRowSelect="True"></Selecting>

<Resizing AllowRowResize="True" AllowColumnResize="True" EnableRealTimeResize="True"

ResizeGridOnColumnResize="False"></Resizing>

</ClientSettings>

<GroupingSettings ShowUnGroupButton="true" />

<PagerStyle Mode="NextPrevAndNumeric" Position="TopAndBottom" />

</telerik:RadGrid>

Heres my Test JS Code

<script type="text/javascript">

window.setTimeout("TEST();", 5000);

function TEST()

{

var _ClassGrid = $find("<%= AZADDClassGrid.ClientID %>_ClassGrid");

var _MasterTable = _ClassGrid.get_masterTableView();

var _SelectedRows = _ClassGrid.get_selectedItems();

if (_SelectedRows.length > 0) {

for (var i = 0; i < _SelectedRows.length; i++) {

var record = _SelectedRows[i];

var classDate = new Date(_MasterTable.getCellByColumnUniqueName(record, "Class_Date"));

alert(_MasterTable.getCellByColumnUniqueName(record, "Class_ID").innerHTML);

}

</script>

1 Answer, 1 is accepted

answered on 29 Jul 2010, 07:34 AM

Hi Loren,

I'd sugget that you give an ID property to the div containers in the ItemTemplate and the use dom operations to get a hand on those and their content. For example, if your first div has an ID="firstColumn", then you can obatin it on the client as follows:

$telerik.findElement($find("RadGrid1").get_masterTableView().get_dataItems()[0].get_element(),"firstColumn");

and from there go forward to inspect its contents for the field values.

Hope this information helps.

Greetings,
Tsvetoslav
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items