Hi,
I'm using Telerik and JQuery UI together in an application. I have found that a javascript error occurs when RadFormDecorator is on the page and you try to display JQuery UI Dialog with a button. This only seems to occur in IE 11. IE 10 and IE 9 seem fine. If I remove the radformdecorator this works, or if I change the dialog prompt to not include a button it also works. Below is the code to reproduce this. Thanks!
Code:
I'm using Telerik and JQuery UI together in an application. I have found that a javascript error occurs when RadFormDecorator is on the page and you try to display JQuery UI Dialog with a button. This only seems to occur in IE 11. IE 10 and IE 9 seem fine. If I remove the radformdecorator this works, or if I change the dialog prompt to not include a button it also works. Below is the code to reproduce this. Thanks!
Code:
<form id="form1" runat="server"> <telerik:RadScriptManager runat="server" /> <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" /> <input type="button" value="Test" onclick="Run()" /> <div id="TestDiv" style="display:none"></div> <script type="text/javascript"> function Run() { $('#TestDiv').dialog({ modal: true, buttons: { "OK": function () { alert('bye'); } } }); } </script> </form>5 Answers, 1 is accepted
0
Richard
Top achievements
Rank 1
Rank 1
answered on 02 May 2014, 07:45 PM
Sorry I forgot the script error:
Error: Unable to get property 'disabled' of undefined or null reference
Error: Unable to get property 'disabled' of undefined or null reference
0
Hi ,
I have tried to reproduce the mentioned issue but to no avail. You can watch the short video test in the attached archive and then tell me what I am missing.
Could you please try to reproduce the issue with the attached archive and then tell us what changes you have made, so that I can proceed further with the investigation?
Regards,
Danail Vasilev
Telerik
I have tried to reproduce the mentioned issue but to no avail. You can watch the short video test in the attached archive and then tell me what I am missing.
Could you please try to reproduce the issue with the attached archive and then tell us what changes you have made, so that I can proceed further with the investigation?
Regards,
Danail Vasilev
Telerik
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
0
Richard
Top achievements
Rank 1
Rank 1
answered on 07 May 2014, 02:36 PM
Hi Danail,
Thank you for your help and reply. I tried it on your sample and did not receive the error. But once I changed the code to use JQuery UI 1.10.4, the error started occurring. I also tried 1.10.1 and received the error. So I think it is something specific to IE 11 using the JQuery UI 1.10 version. Below is the full ASPX I used.
Thanks again!
​
Thank you for your help and reply. I tried it on your sample and did not receive the error. But once I changed the code to use JQuery UI 1.10.4, the error started occurring. I also tried 1.10.1 and received the error. So I think it is something specific to IE 11 using the JQuery UI 1.10 version. Below is the full ASPX I used.
Thanks again!
​
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Examples1_Default" %><%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %><!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script></head><body> <form id="form1" runat="server"> <telerik:RadScriptManager ID="RadScriptManager1" runat="server" /> <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" /> <input type="button" value="Test" onclick="Run()" /> <div id="TestDiv" style="display: none"></div> <script type="text/javascript"> function Run() { $('#TestDiv').dialog({ modal: true, buttons: { "OK": function () { alert('bye'); } } }); } </script> </form></body></html>0
Hello ,
Thank you for the additional information.
This seems to be an issue with the control when integrated with the mentioned version of jQuery UI. I have logged it in our feedback portal here, so that you can monitor its progress, put you comments below and vote on it. For the time being you can use the following JavaScript workaround:
ASPX:
I have also updated your Telerik points for reporting this issue to us.
Regards,
Danail Vasilev
Telerik
Thank you for the additional information.
This seems to be an issue with the control when integrated with the mentioned version of jQuery UI. I have logged it in our feedback portal here, so that you can monitor its progress, put you comments below and vote on it. For the time being you can use the following JavaScript workaround:
ASPX:
<telerik:RadFormDecorator ID="RadFormDecorator1" runat="server" /><script> //Workaround: var removeCssClass = Sys.UI.DomElement.removeCssClass; Telerik.Web.UI.RadFormDecorator.prototype.set_elementDisabled = function (element, val) { var actor = element; var nextSibling = element.nextSibling; var type = element.type; if ((type == "checkbox" || type == "radio") && nextSibling && nextSibling.tagName == "LABEL") { actor = nextSibling; } else if (type == "button" || type == "reset" || type == "submit" || element.tagName == "BUTTON") { var parent = element.parentNode; if (parent && parent.tagName == "A") { actor = parent; parent.disabled = val; } } if (val) addCssClass(actor, "rfdInputDisabled"); else removeCssClass(actor, "rfdInputDisabled"); try { if (!val && $telerik.isIE && actor.parentNode.disabled) { actor.parentNode.disabled = val; } } catch (e) { } }</script>I have also updated your Telerik points for reporting this issue to us.
Regards,
Danail Vasilev
Telerik
Explore the entire set of ASP.NET AJAX controls we offer here and browse the myriad online demos to learn more about the components and the features they incorporate.
0
Richard
Top achievements
Rank 1
Rank 1
answered on 12 May 2014, 06:04 PM
Thank you for your help!