args.get_eventTargetElement() in OnRequestStart event returns null when Paging the Grid initiates an AjaxRequest via AjaxManager

How do I determine if the event target is a RadGrid?

The following code leads to a JavaScript error

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" ClientEvents-OnRequestStart="requestStart">
    <AjaxSettings>
        <telerik:AjaxSetting AjaxControlID="RadGrid1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
            </UpdatedControls>
        </telerik:AjaxSetting>

JavaScript

function requestStart(sender, args) {
    var target = args.get_eventTargetElement();
    if (target.className.indexOf("RadGrid") > -1) {
        // RadGrid control
    }
}

When using the AddAjaxSettings method of the RadAjaxManager, the Height is not taken into account. 

In the following example, the "Unit.Percentage(100)" part marked with yellow:

RadAjaxManager1.AjaxSettings.AddAjaxSetting(RadGrid1, RadGrid2, RadAjaxLoadingPanel1, UpdatePanelRenderMode.Block, Unit.Percentage(100));

This worked with older versions of Telerik, e.g. 2020.x.y

When columns (in any control which supports them - Grid, TreeList, etc.) are sorted, the Sorting Icon wraps below the HeaderText.  If the CSS/Styling is updated to have the "<a>" tag in the ColumnHeader display as "inline-block", this resolves the issue slightly.  However, now the end-user has to be sure to click on the HeaderText itself in order to sort the column.  This is especially annoying when the Columns also support reordering.

I would suggest that Telerik add a "<table>" tag inside the column header and have the HeaderText in one cell and the SortIcon in the following cell.  The right-most cell with the SortIcon can be set to a specific width so that the HeaderText just expands as necessary and wraps as necessary without ever affecting the SortIcon.  Also, the cells should have Css Classes defined so that developers can override any styling behavior as necessary (class="col-text" and class="col-sortIcon" for example).

This should be optional (a property which turns this on/off at the overall Control level) if developers want one way or the other (ColumnRenderMode=Inline/Table?).  Or even maybe at each Column (might be overkill)?

A grid in a RadAjaxPanel will fire several requests when exporting if there is a RadAjaxManager on the page as well.

Stems from the _setupExclusionFilters function where each RadAjaxControl adds as a handler to Sys.WebForms.PageRequestManager.getInstance().add_initializeRequest which does a  sender._form.submit(); and gets called in the initialize method of the control.

The resolution is to use only RadAjaxManager to AJAX-enable complex pages that require the built-in exports as well and make sure to remove all RadAjaxPanel instances. This is the better approach anyway: http://docs.telerik.com/devtools/aspnet-ajax/controls/ajaxmanager/troubleshooting/controls-wrapped-in-ajaxpanel-and-added-to-ajaxmanager-settings

Repro and example solutions are added in the file attached below.

Had a go to meeting to discuss Telerik tools integration with Desislava Nikolo and another consultant. They acknowledged this issue and resolved to contact me after the meeting to provide a fix. 
Basically, from the Telerik Tab in the IDE 2010, I am unable to load any of the RAD tools for development.

I have a RadGrid with several thousand elements on it. In attempting to improve performance, the Visual Studio profiler informed me that it spent more than half of the request in PopulatePlainPanels checking whether something was in a list. (see attached before.png)

I changed the type of the variable plainPanelsClientIDs in RadAjaxControl.cs to be a HashSet<string> instead of a List<string>. As a knock-on effect, I had to import System.Linq into RadAjaxManager.cs to get the .toArray() call to work.

The result in the attached after.png shows the percentage of execution time dropped from 55% to 3%.

I'd appreciate it if the team would evaluate this change for inclusion in future releases.

Note 1: I have not done extensive testing on this, so I don't know what might break. The variable isn't referenced much, so the only thing I'm suspicious of is reflection, which I didn't check for and don't expect.
Note 2: If importing Linq is undesirable, a more manual conversion to an array can be done pretty easily.
Note 3: plainPanelsClientIDs is .add() 'ed to in two places, and both check for membership before being called. This shouldn't be necessary for a HashSet, which simply doesn't add if it's there. This seems a very minor improvement, but I didn't actually try it yet.

Attached is a reproduction project page with a <script> containing a workaround.

Reproduction steps:

1) Run the page

2) Hover quickly between the two colored squares (do this up to 15-20 seconds)

3) Observe the error in the browser's console:

Uncaught RangeError: Maximum call stack size exceeded
    at Function.Array.addRange 
    at Telerik.Web.UI.RadAjaxManager._executePendingRequest 
    at Object._endRequest 
    at Array.<anonymous> 
    at Sys.WebForms.PageRequestManager._endPostBack 
    at Sys.WebForms.PageRequestManager._scriptsLoadComplete 
    at Sys.WebForms.PageRequestManager.<anonymous>   
    at Sys._ScriptLoader._loadScriptsInternal 

Workaround: Place/load this script somewhere after the ScriptManager of the page

<script>
    Telerik.Web.UI.RadAjaxControl.prototype._executePendingRequest = function () {
        var pendingRequest = Array.dequeue(this._requestQueue);

        var eventTarget = pendingRequest[0];
        var eventArgument = pendingRequest[1];

        if (this._requestQueue.length > 0 && this.__id != "") {
            var currentAjaxControl = $find(this.__id);
            if (currentAjaxControl) {
                Array.addRange(currentAjaxControl._requestQueue, this._requestQueue);
                // optional, uncomment if issue persists
                //if (currentAjaxControl._requestQueue.length > currentAjaxControl._requestQueueSize) {
                //    // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/slice#parameters 
                //    // using negative index for start to get the last N elements
                //    currentAjaxControl._requestQueue =
                //        currentAjaxControl._requestQueue.slice(-currentAjaxControl._requestQueueSize)
                //}
            }
        }

        var requestManager = Sys.WebForms.PageRequestManager.getInstance();
        requestManager._doPostBack(eventTarget, eventArgument);
    }
</script>

We have code for our ajaxified submit forms to disable the submit button on request start and re-enabled it on request end. This used to work, but when we upgraded to the latest build (2020.2.617), setting the disabled property to false now throws an error in IE from the WebResource.axd file (does not appear to have a problem in Firefox). The attached demo project shows exactly where the error occurs. Just click the Search button.

Attached picture shows an example of the error message thrown. The error does not appear to be with our javascript code itself; all the variables are populated and valid. It looks like something is getting triggered in the WebResource code when we set the disabled property to false and that is where the break is occurring.

I am using a component (GoogleMapControl) that inherit IExtenderControl . when i add it in to radajaxmanager updated controls or if i use it in dynamically loaded usercontrol by RadTab & RadMultiPage i am getting error of Unable to cast object of type 'GoogleMaps.Markers.GoogleMarkers' to type 'System.Web.UI.ExtenderControl'.

When i check the error detail by AsyncPostBackError event, i found that error comes from Telerik.Web.UI.ProxyScriptControl.GetChildScriptDescriptorsRecursive(Control parent, ArrayList scriptDescriptors).

Someones lived same problem old but same... As in https://dnntracker.atlassian.net/browse/DNN-25819

When AutoResizeHeight is set to true in Chrome, on Editing in the content area, the view jerks, for example, when I select some text and click bold the view moves up. This happens on and off. The requirement for an editor is not to change position of the text which is being edited, it distracts the user.

Hi guy,

      I want use alert function in radajaxmanager,  After i  set  radajaxmanager.alert, if c'ode is running it ,page will pop-up a window. but this window is middle positon in page.
how can i  solve this question.thanks.


David

Hi guy,

      I want use alert function in radajaxmanager,  After i  set  radajaxmanager.alert, if code is running it ,page will pop-up a window. but this window is not middle positon in current page.
How can i  solve this question.thanks.


David

moving application to godaddy web server hosting results in tab control not handling changing tabs.  app is using ajax handler and multpage.  its works on locall iis server.  Also tried calendar control which also did not change date when clicked.  

Using a hidden button and calling its .click() method is sometimes used to invoke a postback under some application logic conditions. If you use the jQuery method and a RadAjaxPanel, this will no longer work with jQuery3 because its strict mode causes the MS AJAX scripts to throw an error.

Below is a sample repro of the scenario and it shows two of the workarounds. The third workaround is to downgrade jQuery to an older version (for example, 1.11.1 which is the previous version the suite used): https://docs.telerik.com/devtools/aspnet-ajax/controls/scriptmanager/disabling-the-embedded-jquery


        <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
            <Scripts>
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
                <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
            </Scripts>
        </telerik:RadScriptManager>
        <telerik:RadCodeBlock runat="server" ID="rcb1">
            <script>
                function clickHiddenButton1() {
                    $telerik.$("#<%=Button1.ClientID%>").click();
                    //workaround 1
                    //__doPostBack("<%=Button1.UniqueID%>", "");
                    //workaround 2
                    //$find("<%=rap1.ClientID%>").ajaxRequest();
                }
            </script>
        </telerik:RadCodeBlock>
        <asp:Button Text="click hidden button" ID="testButton1" OnClientClick="clickHiddenButton1(); return false;" runat="server" />
        <telerik:RadAjaxPanel runat="server" ID="rap1" OnAjaxRequest="rap1_AjaxRequest">
            <asp:Label Text="" ID="Label1" runat="server" />
            <asp:Button Style="display: none;" Text="hidden button" ID="Button1" OnClick="Button1_Click" runat="server" />
        </telerik:RadAjaxPanel>

The Ajax in the sample page is made using:

$find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequest();

In on the page the AjaxManger updates the panel, in the other the setting is that the proxy should update the panel. This is invalid setting.

<telerik:AjaxSetting AjaxControlID="RadAjaxManagerProxy1" >
    <UpdatedControls>
        <telerik:AjaxUpdatedControl ControlID="rsLeftPanel" LoadingPanelID="ralp1" />
    </UpdatedControls>
</telerik:AjaxSetting>

The correct way of doing this is to use add the settings programatically, or to use the ajaxRequestWithTarget instead of ajaxRequest method
http://docs.telerik.com/devtools/aspnet-ajax/controls/ajax/radajaxmanager/how-to/add-ajaxsettings-programmatically