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

RadAjaxPanel & Dropdownlist with AutoPostBack enabled issue

5 Answers 407 Views
Ajax
This is a migrated thread and some comments may be shown as answers.
John
Top achievements
Rank 1
John asked on 02 Mar 2014, 02:21 PM
I have a dropdownlist located inside RadAjax Panel (Build Q4 2006 ) with AutoPostBack option enabled and SelectedIndexChanged event is handled. Whenever loading the page a javascript exception is through "Expected ')'".

The problem is related to the generated Javascript handler added to the dropdownlist "onchange" client event. I have tried to locate a solution for this issue through all threads but couldn't locate anything helpful for this issue.

Here is the aspx markup used by the page

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<%@ Register Assembly="RadAjax.Net2" Namespace="Telerik.WebControls" TagPrefix="radA" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <radA:RadAjaxPanel ID="RadAjaxPanel1" runat="server" height="200px" width="300px" ClientIDMode="AutoID" EnableOutsideScripts="True">
            <br />
            <asp:DropDownList ID="ddlItems" runat="server" AutoPostBack="True">
                <asp:ListItem>Item1</asp:ListItem>
                <asp:ListItem>Item2</asp:ListItem>
            </asp:DropDownList>
            <br />
            <br />
            <asp:Label ID="lblTest" runat="server"></asp:Label>
           
        </radA:RadAjaxPanel>
    </div>
    </form>
</body>
</html>



5 Answers, 1 is accepted

Sort by
0
John
Top achievements
Rank 1
answered on 02 Mar 2014, 02:32 PM
I forgot to mention that I am building the project on .Net framework 4.5.1. 

I have tested downgrading the .Net framework and the maximum .Net framework which works with no issues is 3.5.

Hope there would be a solution to make it work on .Net framework 4.5.1.

Thanks,
John
0
Shinu
Top achievements
Rank 2
answered on 03 Mar 2014, 11:42 AM
Hi John,

Unfortunately I couldn't replicate the issue at my end. Please have a look into the sample code snippet which works fine at my end.

ASPX:
<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
    <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" onchange="Change();">
        <asp:ListItem Text="Item1">
        </asp:ListItem>
        <asp:ListItem Text="Item2">
        </asp:ListItem>
        <asp:ListItem Text="Item3">
        </asp:ListItem>
    </asp:DropDownList>
    <br />
    <br />
    <asp:Label ID="Label1" runat="server">
    </asp:Label>
</telerik:RadAjaxPanel>

C#:
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{
    Label1.Text = DropDownList1.SelectedItem.Text;
}

JavaScript:
<script type="text/javascript">
    function Change(sender, args) {
        var dropdownlist = document.getElementById("DropDownList1");
        var text = dropdownlist.options[dropdownlist.selectedIndex].text;
        alert(text);
    }
</script>

Thanks,
Shinu.
0
John
Top achievements
Rank 1
answered on 12 Aug 2014, 08:40 AM
Dear Shinu,

I followed the same which was sent by you but again no result came out. The reason was related to the generated response and the error was "SCRIPT1006: Expected ')'". By investigating further the issue it is related to the generated javascript code for postback of the dropdownlist control within the Ajax Panel. The generated code is missing ")" character which leads to javascript error and not completing the request.

ASPX:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
 
<%@ Register Assembly="RadAjax.Net2" Namespace="Telerik.WebControls" TagPrefix="telerik" %>
 
<!DOCTYPE html>
 
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server">
            <asp:DropDownList ID="DropDownList1" runat="server" AutoPostBack="true" OnSelectedIndexChanged="DropDownList1_SelectedIndexChanged" onchange="Change();">
                <asp:ListItem Text="Item1">
                </asp:ListItem>
                <asp:ListItem Text="Item2">
                </asp:ListItem>
                <asp:ListItem Text="Item3">
                </asp:ListItem>
            </asp:DropDownList>
            <br />
            <br />
            <asp:Label ID="Label1" runat="server">
            </asp:Label>
        </telerik:RadAjaxPanel>
 
        <script type="text/javascript">
            function Change(sender, args) {
                var dropdownlist = document.getElementById("DropDownList1");
                var text = dropdownlist.options[dropdownlist.selectedIndex].text;
                alert(text);
            }
        </script>
    </form>
</body>
</html>

CS Code:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
 
public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
 
    }
    protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
    {
        Label1.Text = DropDownList1.SelectedItem.Text;
    }
}

Rendered Page Source:
<!DOCTYPE html>
 
<head><title>
 
</title></head>
<body>
    <form method="post" action="Default.aspx" id="form1">
<div class="aspNetHidden">
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__LASTFOCUS" id="__LASTFOCUS" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="YaCyfFCG9Tzgdp5OgI5JFuxwtXSsJzXb1x58pkgh46zdd7s2C0CUW3H3dXDwLeHHB0INeVAFbzRrDoHAiK3G95oXGVXyy+wWP6LLw8XZgf4QXt6ix2/qWj1Ecuj88C7I9PbUDMYWivvss4/cFp0J13rXbRtv/WTDEzw7jO/oLXBq1Ej5uf/MV9qOGFYbLp0x" />
</div>
 
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
    theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
    if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
        theForm.__EVENTTARGET.value = eventTarget;
        theForm.__EVENTARGUMENT.value = eventArgument;
        theForm.submit();
    }
}
//]]>
</script>
 
 
         
            <select name="DropDownList1" onchange="Change();setTimeout('AjaxNS.AR(\'DropDownList1\',\'\', 'RadAjaxPanel1', event)', 0)" id="DropDownList1">
        <option selected="selected" value="Item1">Item1</option>
        <option value="Item2">Item2</option>
        <option value="Item3">Item3</option>
 
    </select>
            <br />
            <br />
            <span id="Label1"></span>
         
</div>
 
        <script type="text/javascript">
            function Change(sender, args) {
                var dropdownlist = document.getElementById("DropDownList1");
                var text = dropdownlist.options[dropdownlist.selectedIndex].text;
                alert(text);
            }
        </script>
     
<div class="aspNetHidden">
 
    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="KUHLNYlXzZnkEY/z99Kqaz2G2UFLNWaAlPh+97bCs3mLu/8bhdQ0qe4W43pyXRpdlz2ZnF45XcaRBLumvJygZbbk3rihuUS+CxM744cAvPtb5btvKMgalPRt7dYwmPzoXFO9Tqa6MfjQI7ALhyZE/ld3RnZ+Pm2nmzQaP6Vo53PjlbaCxUSfTfdwGgD+RFwk" />
</div>
<script type="text/javascript"></script></form>
 
<!-- Visual Studio Browser Link -->
<script type="application/json" id="__browserLink_initializationData">
    {"appName":"InternetExplorer","requestId":"61004c8f8b7a4e09886b271defafd5ca"}
</script>
<script type="text/javascript" src="http://localhost:61586/d86a65abfc4144c99a04cc0ce5abb18d/browserLink" async="async"></script>
<!-- End Browser Link -->
 
</body>
</html>



Thanks,
John
0
Parthiban
Top achievements
Rank 1
answered on 22 Jun 2019, 06:28 AM
I have a red control Ajax panel version v2.0.50727 problem is user control dropdown autopostback issue after framework upgrade 3.5 to 4.7.2 in error “Uncaught SyntaxError: missing). I tried to solve in this issue on-change dopostback event argument. It is working fine. But drop down event fires other controls like textbox us read-only is value are comes null or empty. can you please help me solve this issue completely or any new dll support this issue.
0
Rumen
Telerik team
answered on 25 Jun 2019, 01:26 PM
Hi Parthiban,

RadAjax.Net2 is part of the RadControls for ASP.NET suite, which was discontinued in 2009 in favor of Telerik UI for ASP.NET AJAX.

This component is 10+ years old and neither supports .NET 3, nor 4.7.2.

My advice is plan migration to RadAjaxPanel from Telerik UI for ASP.NET AJAX (Telerik.Web.UI.dll assembly), which supports all .NET frameworks as well as all modern browsers:

Regards,
Rumen
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.
Tags
Ajax
Asked by
John
Top achievements
Rank 1
Answers by
John
Top achievements
Rank 1
Shinu
Top achievements
Rank 2
Parthiban
Top achievements
Rank 1
Rumen
Telerik team
Share this question
or