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

RadAjax broken in VS 2010 Beta 2 in Master/Content Pages

17 Answers 368 Views

Ajax

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

Softec asked on 27 Oct 2009, 11:48 AM

Maybe/hopefully I'm only missing something but I can't get any ajax functionality get to work in content or masterpages since I updated to beta 2.

I tried it with a new and empty Wep Application Project with only the Telerik dlls referenced and no entrys in the Web.Config except the 3 for the telerik tagprefix and the scriptmanager axd (handlers/httpHandlers). Everything works fine as long the RadScriptManager and RadAjaxManager are together on a normal webform.

My Code

                             
                    <telerik:RadScriptManager runat="server" ID="scriptManager" />         
                    <telerik:RadAjaxManager runat="server" ID="ajaxManager">         
                        <AjaxSettings>         
                            <telerik:AjaxSetting AjaxControlID="btnClick">         
                                <UpdatedControls>         
                                    <telerik:AjaxUpdatedControl ControlID="btnClick" LoadingPanelID="ajaxLoading" />         
                                </UpdatedControls>         
                            </telerik:AjaxSetting>         
                        </AjaxSettings>         
                    </telerik:RadAjaxManager>         
                    <telerik:RadAjaxLoadingPanel runat="server" ID="ajaxLoading" Skin="Hay" />         
                    <asp:Button runat="server" Text="CLICK" ID="btnClick" OnClick="btnClick_Click" />         

Codebehind

                            protected void btnClick_Click(object sender, EventArgs e)         
                    {         
                        btnClick.Text = new Random().NextDouble().ToString();         
                    }         

But if I move the same code to a masterpage my button isn't working anymore and I get a JS Error 'get_postBackElement().id' is null or not an object.

I tried the latest builds (2009.02.1025.35) and beta of q3 (2009.3.1016.35).

I can send in a example project if you like but I think its easy to recreate...

Thanks for any hints and tipps...!

17 Answers, 1 is accepted

answered on 27 Oct 2009, 01:22 PM

Hi Joerg,

Indeed we are aware of this problem but unfortunately it is in the .Net Framework and there is little we can do to fix it. You can see for yourself if you try to use MS UpdatePanel instead in the same scenario and set UseSubmitBehavior="false" for the button (although it does not throw an error the control simply does a regular postback). I can suggest you to workaround it by setting the ClientIDMode property of the Page to "AutoID". You can read more details about this property in the following blog post:
http://west-wind.com/weblog/posts/54760.aspx

Kind regards,
Pavel
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 30 Dec 2010, 05:14 PM

Thanks for the reply, here is what I am currently using:
VS2010 Premium ver. 10.0.30319.1 RTMRel
.Net Framework ver. 4.0.30319 RTMRel

markup and code...

<asp:Content ID="content" ContentPlaceHolderID="DefaultContent" runat="Server">

<telerik:RadAjaxManager ID="CreateDealRadAjaxManager" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="DealSearchRadGrid">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="DealSearchRadGrid" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="ClearFiltersLinkButton">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="DealSearchRadGrid" LoadingPanelID="RadAjaxLoadingPanel1" />

<telerik:AjaxUpdatedControl ControlID="ClearFiltersLinkButton" LoadingPanelID="RadAjaxLoadingPanel1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<div id="DealSearchWrapper" class="clearfix" style="width: 100%; margin-top: 20px;

float: left">

<telerik:RadGrid ID="DealSearchRadGrid" runat="server" DataSourceID="DealSearchSqlDataSourceID"

AllowFilteringByColumn="True" GridLines="None" AllowPaging="True" AutoGenerateColumns="False"

ShowGroupPanel="false" Skin="Black" OnItemCommand="DealSearchEditCommand" OnItemDataBound="DealSearchRadGridItemDataBound">

<MasterTableView GridLines="Horizontal" AllowFilteringByColumn="true" TableLayout="Auto"

DataKeyNames="EntityID, StatusCodeID">

<Columns>

<telerik:GridTemplateColumn HeaderText="Action" UniqueName="TemplateColumn" AllowFiltering="false">

<ItemTemplate>

<asp:LinkButton ID="ViewDealLinkButton" runat="server" Text="View" CommandName="Custom"

CommandArgument="View"></asp:LinkButton>

<asp:LinkButton ID="EditDealLinkButton" runat="server" Text="Edit" CommandName="Custom"

CommandArgument="Edit"></asp:LinkButton>

<asp:LinkButton ID="VoidDealLinkButton" runat="server" Text="Void" CommandName="Custom"

CommandArgument="Void"></asp:LinkButton>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter Customer Name/Number" HeaderText="Customer Name/Number"

UniqueName="CustomerNameNumber" DataField="CustomerNameNumber">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn FilterControlAltText="Filter Retailer" HeaderText="Retailer"

UniqueName="Retailer" DataField="Retailer">

</telerik:GridBoundColumn>

</Columns>

<CommandItemSettings ExportToPdfText="Export to Pdf" ExportToExcelText="Export to Excel">

</CommandItemSettings>

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

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

</RowIndicatorColumn>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column">

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

</ExpandCollapseColumn>

<EditFormSettings EditFormType="Template">

</EditFormSettings>

</MasterTableView>

<GroupingSettings CaseSensitive="false" />

<FilterMenu EnableImageSprites="False">

</FilterMenu>

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Default">

</HeaderContextMenu>

<ClientSettings AllowDragToGroup="false">

<Scrolling AllowScroll="true" />

</ClientSettings>

</telerik:RadGrid>

<div class="contentButtonContainer" style="float: right;">

<div class="formControl">

<asp:LinkButton ID="ClearFiltersLinkButton" runat="server" CssClass="searchButton"

Text="Clear Filters" Width="100px" Style="text-align: center" OnClick="ClearFiltersClick">

</asp:LinkButton>

<asp:LinkButton ID="ExportToExcelLinkButton" runat="server" CssClass="searchButton"

Text="Export To Excel" OnClick="ExportToExcelClick" Width="100px" Style="text-align: center">

</asp:LinkButton>

</div>

<telerik:RadAjaxLoadingPanel HorizontalAlign="center" BackColor="#ffffff" ID="RadAjaxLoadingPanel1"

runat="server" Transparency="30" Height="100%" Width="100%">

<table width="100%" style="height: 100%">

<tr>

<td>

<img src="/App_Themes/images/ajax-loader.gif" />

</td>

</tr>

</table>

</telerik:RadAjaxLoadingPanel>

<asp:SqlDataSource ID="DealSearchSqlDataSourceID" runat="server"></asp:SqlDataSource>

</asp:Content>

private DealSearchPresenter _presenter;

[CreateNew]

public DealSearchPresenter Presenter

{

get

{

return this._presenter;

}

set

{

if (value == null)

throw new ArgumentNullException("value");

this._presenter = value;

this._presenter.View = this;

}

protected void Page_Load(object sender, EventArgs e)

{

//Telerik Hack because on the first clear filter press its throws a js error Error 'get_postBackElement().id' is null or not an object

this.Page.ClientIDMode = System.Web.UI.ClientIDMode.AutoID;

if (!this.IsPostBack)

{

this._presenter.OnViewInitialized();

}

this._presenter.OnViewLoaded();

SetupSQLDataSourceForFilteredGrid();

}

private void SetupSQLDataSourceForFilteredGrid()

{

DealSearchSqlDataSourceID.ConnectionString = ConfigurationManager.ConnectionStrings["ApplicationConnectionString"].ConnectionString;

DealSearchSqlDataSourceID.SelectCommandType = SqlDataSourceCommandType.StoredProcedure;

DealSearchSqlDataSourceID.SelectCommand = "somesproc";

DealSearchSqlDataSourceID.ProviderName = "System.Data.SqlClient";

}

public void ConfigureExport()

{

DealSearchRadGrid.ExportSettings.ExportOnlyData = true;

DealSearchRadGrid.ExportSettings.IgnorePaging = true;

DealSearchRadGrid.ExportSettings.OpenInNewWindow = true;

}

#region events

protected void DealSearchRadGridItemDataBound(object source, GridItemEventArgs e)

{

if (e.Item.ItemType == GridItemType.Item)

{

LinkButton viewLinkButton = ((LinkButton)e.Item.FindControl("ViewDealLinkButton"));

LinkButton editModifyLinkButton = ((LinkButton)e.Item.FindControl("EditDealLinkButton"));

LinkButton voidLinkButton = ((LinkButton)e.Item.FindControl("VoidDealLinkButton"));

int statusCodeID = (int)(e.Item as GridDataItem).OwnerTableView.DataKeyValues[e.Item.ItemIndex]["StatusCodeID"];

if (statusCodeID.Equals(DraftStatusCodeID))

{

viewLinkButton.Visible = true;

editModifyLinkButton.Text = "Modify";

voidLinkButton.Visible = true;

}

if (statusCodeID.Equals(NewStatusCodeID))

{

viewLinkButton.Visible = true;

editModifyLinkButton.Text = "Adjust";

voidLinkButton.Visible = true;

}

if (statusCodeID.Equals(InitialapprovedStatusCodeID))

{

viewLinkButton.Visible = true;

editModifyLinkButton.Text = "Adjust";

voidLinkButton.Visible = true;

}

if (statusCodeID.Equals(FinalapprovedStatusCodeID))

{

viewLinkButton.Visible = true;

editModifyLinkButton.Text = "Adjust";

voidLinkButton.Visible = true;

}

protected void DealSearchEditCommand(object source, GridCommandEventArgs e)

{

if (e.Item.GetType()!= typeof(GridDataItem)) return;

string entityID = (e.Item as GridDataItem).OwnerTableView.DataKeyValues[e.Item.ItemIndex]["EntityID"].ToString();

string statusCodeID = (e.Item as GridDataItem).OwnerTableView.DataKeyValues[e.Item.ItemIndex]["StatusCodeID"].ToString();

string redirectString = String.Format("CreatDeal.aspx?pr={0}&sc={1}", entityID, statusCodeID);

switch (e.CommandArgument.ToString())

{

//View and Edit are Basically the same just leaving room for growth or alterations.

case "View":

Response.Redirect(redirectString);

break;

case "Edit":

Response.Redirect(redirectString);

break;

case "Void":

VoidDeal(entityID.ToInt());

break;

default:

break;

}

protected void ExportToExcelClick(object sender, EventArgs e)

{

ConfigureExport();

DealSearchRadGrid.MasterTableView.ExportToExcel();

}

protected void ClearFiltersClick(object sender, EventArgs e)

{

foreach (GridColumn column in DealSearchRadGrid.MasterTableView.Columns)

{

column.CurrentFilterFunction = GridKnownFunction.NoFilter;

column.CurrentFilterValue = string.Empty;

}

DealSearchRadGrid.MasterTableView.FilterExpression = string.Empty;

DealSearchRadGrid.MasterTableView.Rebind();

}

answered on 04 Jan 2011, 02:55 PM

WebSite5.zip

Hi Josh,

I was able to reproduce the error. It occurs when there is a 4.0 version of the AjaxToolKit in the bin folder of the website. In this case the scripts are loaded from the ToolKit's assembly even if you don't use that in your project. This assembly uses different scripts than the ones which ship with the RTM version of .Net 4.0 and this is causing the error with our RadAjaxManager. You can workaround it by registering the correct scripts via ScriptManager like this:

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

<Scripts>

<asp:ScriptReference Assembly="System.Web.Extensions" Name="MicrosoftAjax.js" ScriptMode="Release"

Path="~/AjaxScripts/MicrosoftAjax.js"/>

<asp:ScriptReference Assembly="System.Web.Extensions" Name="MicrosoftAjaxWebForms.js" ScriptMode="Release"

Path="~/AjaxScripts/MicrosoftAjaxWebForms.js"/>

</Scripts>

</telerik:RadScriptManager>

I am attaching a test page containing the correct scripts and illustrating the suggested approach. I hope this helps.

All the best,
Pavel
the Telerik team

Browse the vast support resources we have to jump start your development with RadControls for ASP.NET AJAX. See how to integrate our AJAX controls seamlessly in SharePoint 2007/2010 visiting our common SharePoint portal.

answered on 22 Dec 2013, 11:06 AM

I created a custom control that suffered from this same problem: It couldn't trigger AJAX requests, and always the a.get_postbackElement() is undefined error erupted.

After debugging Telerik and Microsoft code, I think that the problem is in Microsoft's code. AJAX extensions was introduced long before the ClientIDMode, so MS developers supposed that the ClientID generation scheme is the same the the UniqueID attribute generation scheme with the sole difference of the separator, which doesn't always hold when the ClientIDMode property is set to Inherit.

For example, if a control's UniqueID property (used as the name attribute for HTML inputs and used as the __EVENTTARGET value on post backs) is a$b$c (where a is the ID of the grandparent control, and b is the ID of the parent and c is the ID of the control itself), its ClientID must be a_b_c, and they use the UniqueID value to infer the ClientID property (they just replace $ by _ using a RegEx), and when the code fetches the element using the false id by calling $get (a shortcut for document.getElementById), it returns null and the a.get_postbackElement() is undefined error happens.

The only known fix in my opinion is to force the AutoID value for the ClientIDMode property until Microsoft fixes its carelessly unmaintained code. In my code I overrode it as follows:

[Browsable(false)]

public override ClientIDMode ClientIDMode

// HACK: I don't know why the generated ClientID was malformed when this property was set to the default (Inherit) which caused the control to fail in triggering an AJAX request. I had to explicitly set the ID generation mode to AutoID to cope with AJAX

{

get

{

return ClientIDMode.AutoID;

}

set

{

throw new InvalidOperationException();

}