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

[Solved] Client Events Break $find

2 Answers 101 Views

Grid

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

Marcus Kellermann asked on 20 Oct 2010, 08:54 PM

I have a simple page that when I add a OnRowSelected client site event handler, it breaks the $find command for finding the RadGrid

If I remove the ClientSettings section and just use a button to execute the same javascript it works fine. I don't understand why adding the client settings is breaking $find. When the client settings are there $find always returns null.

Master Page File

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="radWindowExample.SiteMaster" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

<head runat="server">

<title></title>

<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />

<asp:ContentPlaceHolder ID="HeadContent" runat="server">

</asp:ContentPlaceHolder>

</head>

<body>

<form runat="server">

<telerik:RadScriptManager ID="RadScriptManager1" Runat="server">

</telerik:RadScriptManager>

<div class="page">

<div class="header">

<div class="title">

<h1>

My ASP.NET Application

</h1>

</div>

<div class="loginDisplay">

<asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">

<AnonymousTemplate>

[ <a href="~/Account/Login.aspx" ID="HeadLoginStatus" runat="server">Log In</a> ]

</AnonymousTemplate>

<LoggedInTemplate>

Welcome <span class="bold"><asp:LoginName ID="HeadLoginName" runat="server" /></span>!

[ <asp:LoginStatus ID="HeadLoginStatus" runat="server" LogoutAction="Redirect" LogoutText="Log Out" LogoutPageUrl="~/"/> ]

</LoggedInTemplate>

</asp:LoginView>

</div>

<div class="clear hideSkiplink">

<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">

<Items>

<asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"/>

<asp:MenuItem NavigateUrl="~/About.aspx" Text="About"/>

</Items>

</asp:Menu>

</div>

<div class="main">

<asp:ContentPlaceHolder ID="MainContent" runat="server"/>

</div>

<div class="clear">

</div>

<div class="footer">

</div>

</form>

</body>

</html>

Webform Markup

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="WebForm4.aspx.cs" Inherits="radWindowExample.WebForm4" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">

</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

<script language="javascript">

var messageId;

var grid;

function PreventRowSelection(index) {

if ((this.Rows[index].ItemType == "Item" || this.Rows[index].ItemType == "AlternatingItem")) {

return false;

}

//------dgMessages.ClientID is returning NULL ----THIS IS THE ERROR-----------//

function CheckSelections() {

//added the line below

alert($find("<%= RadGrid1.ClientID %>").get_masterTableView().get_dataItems().length);

//var MasterTable = grid_1.get_masterTableView();

//var srows = MasterTable.get_selectedItems();

messageId = "";

if (srows.length == 1) {

messageId = srows[0].KeyValues["ID"];

DisableButtons(false, false);

}

else if (srows.length > 1) {

DisableButtons(true, false);

}

else {

DisableButtons(true, true);

}

</script>

<telerik:RadGrid ID="RadGrid1" runat="server" AllowPaging="True" AllowSorting="True"

CellPadding="0" EnableAJAX="True"

EnableAJAXLoadingTemplate="True" GridLines="None" PageSize="25"

AllowMultiRowSelection="True">

<CommandItemStyle />

<ExportSettings>

<Pdf PageBottomMargin="" PageFooterMargin="" PageHeaderMargin="" PageHeight="11in"

PageLeftMargin="" PageRightMargin="" PageTopMargin="" PageWidth="8.5in" />

</ExportSettings>

<PagerStyle BackColor="#6699CC" HorizontalAlign="Justify" />

<ClientSettings >

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

<Scrolling AllowScroll="False" />

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

<ClientEvents OnRowSelected="CheckSelections()" />

</ClientSettings>

<HeaderStyle BorderColor="#6699CC" BorderStyle="Solid" BorderWidth="0px" HorizontalAlign="Left" />

<PagerStyle NextPageText="Next >" PrevPageText="< Prev" />

<FilterMenu></FilterMenu>

</telerik:RadGrid>

<input type="button" onclick="CheckSelections(); return false;" value="Hello" />

</asp:Content>

Code Behind

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

namespace radWindowExample

{

public partial class WebForm4 : System.Web.UI.Page

{

protected void Page_Load(object sender, EventArgs e)

{

DataTable dtRagGrid = new DataTable();

dtRagGrid.Columns.Add("name");

dtRagGrid.Columns.Add("id");

dtRagGrid.Rows.Add("john", "1");

dtRagGrid.Rows.Add("Mark", "2");

RadGrid1.DataSource = dtRagGrid;

}

2 Answers, 1 is accepted

answered on 21 Oct 2010, 01:21 PM

That was part of the problem but even after that change it still failed. I had to change the logic for getting the masterTableView to the following.

function CheckSelections()

{

var radGrid = $find("<%=RadGrid1.ClientID%>");

var masterTable = radGrid.get_masterTableView();

var length = masterTable.get_selectedItems().length;

alert(length);

}

But what I don't understand is why it didn't work before and why an error in one javascript function was breaking all the scripts in the page.