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

Javascript not firing after Postback when Telerik Grid is placed within User Control

9 Answers 384 Views

Grid

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

9 Answers, 1 is accepted

answered on 07 Mar 2012, 05:52 PM

Hello,

Could you please elaborate a bit more on your application.
Are you using Ajax for loading the UserControls? If yes note that there are some specifics in executing custom javascript after ajax request. Review the help topic below for more information on this matter:
http://www.telerik.com/help/aspnet-ajax/ajax-execute-custom-javascript.html

Also pleas note that the dynamic loaded user controls should be recreated on each postback, not only on initial page load.

Regards,
Maria Ilieva
the Telerik team

If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.

answered on 20 Mar 2012, 06:48 AM

Casey,

here is my design source:

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="MessageInbox.ascx.cs"
Inherits="WealthERP.Messages.MessageInbox" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">

<script type="text/javascript">
function checkAllBoxes() {
//get total number of rows in the gridview and do whatever
//you want with it..just grabbing it just cause
var grid = $find("ctrl_MessageInbox_RadGrid1");
alert(grid);
var MasterTable = grid.get_masterTableView();
var Rows = MasterTable.get_dataItems();
//debugger;
var totalRows = Rows.length;
var hdrChkBx = document.getElementById("hdrCheckBox");

for (var i = 0; i < totalRows; i++) {
var chkbx = Rows[i].findElement("chkbxRow");
chkbx.checked = hdrChkBx.checked;
}
}
</script>

</telerik:RadScriptBlock>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" />

<table class="TableBackground" width="100%">
<tr id="trContent" runat="server">
<td>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" DefaultLoadingPanelID="RadAjaxLoadingPanel1" EnablePageHeadUpdate="false">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadGrid1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadGrid1" />
<telerik:AjaxUpdatedControl ControlID="pnlMessage" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Office2007" />
<div id="dv" class="dvInbox">
<telerik:RadGrid ID="RadGrid1" runat="server" Width="860px" Height="250px" PageSize="6"
AllowPaging="True" ShowGroupPanel="true" GridLines="None" AutoGenerateColumns="False"
Style="border: 0; outline: none;" Skin="Telerik" EnableEmbeddedSkins="false"
OnItemCommand="RadGrid1_ItemCommand" EnableViewState="true" OnNeedDataSource="RadGrid1_NeedDataSource"
OnItemDataBound="RadGrid1_ItemDataBound">
<PagerStyle Mode="NextPrevAndNumeric"></PagerStyle>
<MasterTableView DataKeyNames="MR_MessageRecipientId" ShowFooter="true">
<Columns>
<telerik:GridTemplateColumn UniqueName="TemplateColumn1" Groupable="False">
<HeaderStyle HorizontalAlign="Center" Width="30px"></HeaderStyle>
<HeaderTemplate>
<input type="checkbox" id="hdrCheckBox" onclick="checkAllBoxes()" />
</HeaderTemplate>
<ItemStyle HorizontalAlign="Center"></ItemStyle>
<ItemTemplate>
<asp:CheckBox ID="chkbxRow" runat="server" />
</ItemTemplate>
<FooterTemplate>
<asp:LinkButton ID="btnDelete" runat="server" Text="Delete" OnClick="btnDelete_Click" ForeColor="White" />
</FooterTemplate>
</telerik:GridTemplateColumn>
<telerik:GridTemplateColumn UniqueName="TemplateColumn1" Groupable="False">
<HeaderStyle Width="30px"></HeaderStyle>
<ItemStyle HorizontalAlign="Center"></ItemStyle>
<ItemTemplate>
<img src='<%# Boolean.Parse(DataBinder.Eval(Container.DataItem, "IsReadByUser").ToString())? "../Images/Telerik/mailOpenIcon.png":"../Images/Telerik/mailNewIcon.png" %>'
alt="MailIcon" />
</ItemTemplate>
</telerik:GridTemplateColumn>
<telerik:GridBoundColumn UniqueName="From" HeaderText="From" DataField="Sender">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Subject" HeaderText="Subject" DataField="Subject">
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="Received" SortExpression="Received" HeaderText="Received"
DataField="SentOn" DataFormatString="{0:d}">
<HeaderStyle Width="125px"></HeaderStyle>
</telerik:GridBoundColumn>
<telerik:GridBoundColumn UniqueName="ReadByUser" DataField="IsReadByUser" Visible="false" />
<telerik:GridButtonColumn ButtonType="LinkButton" Text="Read" CommandName="Read">
</telerik:GridButtonColumn>
</Columns>
</MasterTableView>
</telerik:RadGrid>
</div>
</td>
</tr>
</table>

====================================================

I am calling the checkAllBoxes() function to check all boxes in the grid to implement delete functionality. But on postback (paging included), the $find(grid's client id) is returning null....