I've searched all over for the solution to my problem but haven't been able to find it so I figure I must be overlooking something really simple ;-)
I've got a simple page containing one LinkButton and a RadToolTipManager (used instead of RadToolTip because in the real app there's multiple tooltips loaded on demand). The LinkButton triggers the ToolTip.
The tooltip contains a simple usercontrol, containing only one button. So far so good, tooltip opens just fine.
There is a client-script inside the usercontrol (OnClientClick for Button-control). The problem is that a javascript-error appears instead of the desired client-side behavior:
'ClientClick' is undefined.
ClientClick is defined in the user control, not in the parent page. How can I use client-scripting in usercontrols inside tooltip-templates?
Could you please point me in the right direction?
Kind regards, Martine.
ASPX:
.cs:
ASCX:
I've got a simple page containing one LinkButton and a RadToolTipManager (used instead of RadToolTip because in the real app there's multiple tooltips loaded on demand). The LinkButton triggers the ToolTip.
The tooltip contains a simple usercontrol, containing only one button. So far so good, tooltip opens just fine.
There is a client-script inside the usercontrol (OnClientClick for Button-control). The problem is that a javascript-error appears instead of the desired client-side behavior:
'ClientClick' is undefined.
ClientClick is defined in the user control, not in the parent page. How can I use client-scripting in usercontrols inside tooltip-templates?
Could you please point me in the right direction?
Kind regards, Martine.
ASPX:
| <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> |
| <%@ Register Assembly="Telerik.Web.UI, Version=2008.2.826.20, Culture=neutral, PublicKeyToken=121fae78165ba3d4" |
| Namespace="Telerik.Web.UI" TagPrefix="telerik" %> |
| <%@ Register Src="WebUserControl.ascx" TagName="WebUserControl" TagPrefix="uc1" %> |
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> |
| <html xmlns="http://www.w3.org/1999/xhtml"> |
| <head runat="server"> |
| <title>Untitled Page</title> |
| </head> |
| <body> |
| <form id="form1" runat="server"> |
| <telerik:RadScriptManager ID="ScriptManager1" runat="server" EnableTheming="True"> |
| </telerik:RadScriptManager> |
| <br /> |
| <div> |
| <asp:LinkButton ID="LinkButton1" runat="server">Show ToolTip</asp:LinkButton><br /> |
| <telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" ManualClose="True" |
| Modal="True" OnAjaxUpdate="RadToolTipManager1_AjaxUpdate"> |
| <TargetControls> |
| <telerik:ToolTipTargetControl IsClientID="False" TargetControlID="LinkButton1" Value="" /> |
| </TargetControls> |
| </telerik:RadToolTipManager> |
| </div> |
| </form> |
| </body> |
| </html> |
.cs:
| using System; |
| using System.Data; |
| using System.Configuration; |
| using System.Web; |
| using System.Web.Security; |
| using System.Web.UI; |
| using System.Web.UI.WebControls; |
| using System.Web.UI.WebControls.WebParts; |
| using System.Web.UI.HtmlControls; |
| public partial class _Default : System.Web.UI.Page |
| { |
| protected void Page_Load(object sender, EventArgs e) |
| { |
| } |
| protected void RadToolTipManager1_AjaxUpdate(object sender, Telerik.Web.UI.ToolTipUpdateEventArgs e) |
| { |
| WebUserControl UC = (WebUserControl)Page.LoadControl("WebUserControl.ascx"); |
| e.UpdatePanel.ContentTemplateContainer.Controls.Add(UC); |
| } |
| } |
ASCX:
| <%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs" Inherits="WebUserControl" %> |
| <%@ Register Assembly="Telerik.Web.UI, Version=2008.2.826.20, Culture=neutral, PublicKeyToken=121fae78165ba3d4" |
| Namespace="Telerik.Web.UI" TagPrefix="telerik" %> |
| <asp:Button ID="Button1" runat="server" OnClientClick="ClientClick" Text="Button in UserControl" /> |
| <script language="javascript" type="text/javascript"> |
| function ClientClick(sender, args) |
| { |
| Alert('Clicked!'); |
| } |
| </script> |
16 Answers, 1 is accepted
0
Accepted
Hi Martine,
I examined your code and I noticed the following:
Svetlina
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
I examined your code and I noticed the following:
- You have declared the javascript function in the user control and this approach is not the best one - if it is so, every time you add the control the script will be added to the page. This will make your page more heavy and these repeating scripts are not needed. I recommend to put the script on the main page instead of the user control. Furthermore, when you have a ScriptManager you should register the script in order to inform the manager about it, you cannot simply output it on the page.
- The correct way to attach the function is with brackets because otherwise it will not get executed. Please, also note that you should return false in case you do not need a server handler. This being said, you should modify the button's markup in the following manner:
<asp:Button ID="Button1" runat="server" OnClientClick="ClientClick();return false;" Text="Button in UserControl" /> - Note, that JavaScript is case sensitive and in order to correctly call the built-in alert function it should not begin with a capital letter.
I applied the above explained modifications to your project and attached it to the thread.
Sincerely yours,Svetlina
the Telerik team
Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Nicolaï
Top achievements
Rank 2
Rank 2
answered on 08 Jun 2009, 07:12 AM
Hello,
I have a similar project as described above.
Also realized I had to put the js code inside the "parent" page instead of the tooltiped usercontrol.
But the problem I am facing is: finding a control (linkbutton) inside the usercontrol from that (parent page) script.
Code is below and the bolded line is the part I struggle with: tried variations of the bold line, but unable to find the save button inside the uc..
<telerik:RadCodeBlock runat="server" ID="rcb1">
<script type="text/javascript">
function OnDateChange(dateInput, args)
{
var saveBtn=$get("<%=saveCompletedDateLink.ClientID %>");alert(saveBtn);
if (args.get_newDate() == null && args.get_oldDate() == null)
{
saveBtn.style.display="none";
}
else
{
saveBtn.style.display="block";
}
}
</script>
</telerik:RadCodeBlock>
(basically showing or hiding a save button until the selected date is valid)
Really hope you can help me out!
Posted here in forum instead of ticket, as this has probably been asked before and will probably be asked again.
Best regards,
Nicolai
I have a similar project as described above.
Also realized I had to put the js code inside the "parent" page instead of the tooltiped usercontrol.
But the problem I am facing is: finding a control (linkbutton) inside the usercontrol from that (parent page) script.
Code is below and the bolded line is the part I struggle with: tried variations of the bold line, but unable to find the save button inside the uc..
<telerik:RadCodeBlock runat="server" ID="rcb1">
<script type="text/javascript">
function OnDateChange(dateInput, args)
{
var saveBtn=$get("<%=saveCompletedDateLink.ClientID %>");alert(saveBtn);
if (args.get_newDate() == null && args.get_oldDate() == null)
{
saveBtn.style.display="none";
}
else
{
saveBtn.style.display="block";
}
}
</script>
</telerik:RadCodeBlock>
(basically showing or hiding a save button until the selected date is valid)
Really hope you can help me out!
Posted here in forum instead of ticket, as this has probably been asked before and will probably be asked again.
Best regards,
Nicolai
0
Nicolaï
Top achievements
Rank 2
Rank 2
answered on 08 Jun 2009, 09:41 AM
Follow-up:
with firefox, I selected the part and "view selection source".
==> var saveBtn=document.getElementById("ctl55_saveCompletedDateLink");
That seems to work, but it feels "dirty" using ctlXX_ ....
But it works... That's what counts I suppose..
with firefox, I selected the part and "view selection source".
==> var saveBtn=document.getElementById("ctl55_saveCompletedDateLink");
That seems to work, but it feels "dirty" using ctlXX_ ....
But it works... That's what counts I suppose..
0
Zeke Sheppard
Top achievements
Rank 1
Rank 1
answered on 05 Feb 2010, 04:06 PM
Putting the javascript function on the parent page instead of the user control seems contrary to the object oriented fundament of encapsulation.
That being said, how can a javascript function be recognized on the user control?
Currently, I am having an issue where a client side event on a user control is firing, but producing the error '<function name> is undefined.
here's the code snippet;
That being said, how can a javascript function be recognized on the user control?
Currently, I am having an issue where a client side event on a user control is firing, but producing the error '<function name> is undefined.
here's the code snippet;
<
telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">
<
script type="text/javascript">
function OnClientLoad(editor, args) {
var element = document.all ? editor.get_document().body : editor.get_document();
$telerik.addExternalHandler(element,
"blur", function(e) {
alert(
'You just clicked in the editor');
});
}
function
OnBlurNetWeight() {
window.alert(
'Here');
}
</
script>
</
telerik:RadCodeBlock>
<telerik:RadNumericTextBox ID="rntNetKilos" Width="85px" Runat="server" >
<ClientEvents OnBlur="OnBlurNetWeight" />
</telerik:RadNumericTextBox>
Produces a javascript error 'OnBlurNetWeight' is undefined.
0
Hello guys,
This problem is not directly related to RadControls but to the fact that MS AJAX does not parse scripts as explained below:
http://blogs.telerik.com/tervelpeykov/posts/08-10-20/ajax_using_ajax_to_load_a_usercontrol_that_has_javascript_declared_in_it.aspx
Since you are using the OnAjaxUpdate event of the tooltip manager this means that you are loading the user control with AJAX and you encounter the issue explained above.
Since this is general problem you can find many different approaches to solve it. What I suggest is to use code-behind to inject the script from the server in similar manner as explained below (simply register the block instead of executing on start up):
http://blogs.telerik.com/blogs/posts/09-05-05/executing_javascript_function_from_server-side_code.aspx
The approach with putting the script on the main page is also a valid one and different solution of getting IDs are also available on the net. You can for example use global js variables and initialize them ClientIDs by using script from the server, you can use hidden fields on the main page, reference them from the user control's code-behind and set the ClientID's in them so that you will be able to read them in js on the main page, etc.
All the best,
Svetlina
the Telerik team
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.
This problem is not directly related to RadControls but to the fact that MS AJAX does not parse scripts as explained below:
http://blogs.telerik.com/tervelpeykov/posts/08-10-20/ajax_using_ajax_to_load_a_usercontrol_that_has_javascript_declared_in_it.aspx
Since you are using the OnAjaxUpdate event of the tooltip manager this means that you are loading the user control with AJAX and you encounter the issue explained above.
Since this is general problem you can find many different approaches to solve it. What I suggest is to use code-behind to inject the script from the server in similar manner as explained below (simply register the block instead of executing on start up):
http://blogs.telerik.com/blogs/posts/09-05-05/executing_javascript_function_from_server-side_code.aspx
The approach with putting the script on the main page is also a valid one and different solution of getting IDs are also available on the net. You can for example use global js variables and initialize them ClientIDs by using script from the server, you can use hidden fields on the main page, reference them from the user control's code-behind and set the ClientID's in them so that you will be able to read them in js on the main page, etc.
All the best,
Svetlina
the Telerik team
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Follow the status of features or bugs in PITS and vote for them to affect their priority.
0
Zeke Sheppard
Top achievements
Rank 1
Rank 1
answered on 17 Feb 2010, 02:17 PM
Following your example, after adding this call to the function to the control:
And adding this script to the same .ascx
The control cannot be dynamically loaded since the following exception is raised;
error BC30456: 'InternalCall' is not a member of 'ASP.salesintent_si_usercontrols_salesintentpage_ascx'.
Curiously, it appears no one else responsding to the referenced thread had any success implementing these suggestions. Where is this breaking?
OnClientClick
="InternalCall();return false;"
And adding this script to the same .ascx
<
script type="text/javascript">
function
InternalCall()
{
alert(
"Javascript declared directly in the user control called form <%=Button1.ClientID %>");
}
</
script>
The control cannot be dynamically loaded since the following exception is raised;
error BC30456: 'InternalCall' is not a member of 'ASP.salesintent_si_usercontrols_salesintentpage_ascx'.
Curiously, it appears no one else responsding to the referenced thread had any success implementing these suggestions. Where is this breaking?
0
Zeke Sheppard
Top achievements
Rank 1
Rank 1
answered on 17 Feb 2010, 02:39 PM
Update: after adding the global handler to the .aspx container, the following error is displayed;
rgs.get_response()._xmlHttpRequest has no properties.
In viewing the thread
http://blogs.telerik.com/tervelpeykov/posts/08-10-20/ajax_using_ajax_to_load_a_usercontrol_that_has_javascript_declared_in_it.aspx
it appears others are experiencing this issue, but there is no solution given.
Why is this breaking?
0
Hi guys,
This problem occurs when other RadControls are used in the loaded user control and we are aware of it. there is a workaround but the workaround itself as well as the solution is pretty complex and also uneffective for this particular case (it is handy in simple scenarios where the user control is not diplicated as many times on the pages). I strongly recommend to better implement the solution I have already suggested in my previous post which for your convenience I pasted below:
Since this is general problem you can find many different approaches to solve it. What I suggest is to use code-behind to inject the script from the server in similar manner as explained below (simply register the block instead of executing on start up):
http://blogs.telerik.com/blogs/posts/09-05-05/executing_javascript_function_from_server-side_code.aspx
The approach with putting the script on the main page is also a valid one and different solution of getting IDs are also available on the net. You can for example use global js variables and initialize them ClientIDs by using script from the server, you can use hidden fields on the main page, reference them from the user control's code-behind and set the ClientID's in them so that you will be able to read them in js on the main page, etc.
Kind regards,
Svetlina
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
This problem occurs when other RadControls are used in the loaded user control and we are aware of it. there is a workaround but the workaround itself as well as the solution is pretty complex and also uneffective for this particular case (it is handy in simple scenarios where the user control is not diplicated as many times on the pages). I strongly recommend to better implement the solution I have already suggested in my previous post which for your convenience I pasted below:
Since this is general problem you can find many different approaches to solve it. What I suggest is to use code-behind to inject the script from the server in similar manner as explained below (simply register the block instead of executing on start up):
http://blogs.telerik.com/blogs/posts/09-05-05/executing_javascript_function_from_server-side_code.aspx
The approach with putting the script on the main page is also a valid one and different solution of getting IDs are also available on the net. You can for example use global js variables and initialize them ClientIDs by using script from the server, you can use hidden fields on the main page, reference them from the user control's code-behind and set the ClientID's in them so that you will be able to read them in js on the main page, etc.
Kind regards,
Svetlina
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Zeke Sheppard
Top achievements
Rank 1
Rank 1
answered on 22 Feb 2010, 01:50 PM
Interesting...this thread is over a year and a half old and you are finally revealing the fact that your controls are breaking this functionality. Incredible.
Since you have know about this issue for some time, and currently don't have the a) desire, b) time, or c) skill to resolve, is the a planned fix in the future?
Since you have know about this issue for some time, and currently don't have the a) desire, b) time, or c) skill to resolve, is the a planned fix in the future?
0
Hello Zeke,
The workaround in question (http://blogs.telerik.com/tervelpeykov/posts/08-10-20/ajax_using_ajax_to_load_a_usercontrol_that_has_javascript_declared_in_it.aspx) shows possible solutions to solve a general MS AJAX problem. Please note, that we do not claim that this workaround works in all cases - that is why in your exact case we suggested to use either registering scripts from code-behind or declaring them on the main page. Have you tried these suggestions?
All the best,
Svetlina
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
The workaround in question (http://blogs.telerik.com/tervelpeykov/posts/08-10-20/ajax_using_ajax_to_load_a_usercontrol_that_has_javascript_declared_in_it.aspx) shows possible solutions to solve a general MS AJAX problem. Please note, that we do not claim that this workaround works in all cases - that is why in your exact case we suggested to use either registering scripts from code-behind or declaring them on the main page. Have you tried these suggestions?
All the best,
Svetlina
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Zeke Sheppard
Top achievements
Rank 1
Rank 1
answered on 22 Feb 2010, 03:40 PM
If you actually look at the thread you are referencing ( http://blogs.telerik.com/tervelpeykov/posts/08-10-20/ajax_using_ajax_to_load_a_usercontrol_that_has_javascript_declared_in_it.aspx ) you will see that this did not appear to work for anyone, including me, on 2/17.
To quote;
'Getting args.get_response()._xmlHttpRequest has no properties. Any resolution to this?'
Again, no workable solution given, and no response from your group after the initial post.
0
Hi Zeke,
The blogs on our side are community resort and although we monitor the comments in them, sometimes we miss to reply all comments - unfortunately this is what happened with that blog post for which we apologize. I will ask Svetlina to post a reply there as as soon as possible.
As for the problem itself, we prepared a small sample that shows the approach that we suggest you to use in such scenario - I hope it will be of help.
Regards,
Georgi Tunev
Senior Support
Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
The blogs on our side are community resort and although we monitor the comments in them, sometimes we miss to reply all comments - unfortunately this is what happened with that blog post for which we apologize. I will ask Svetlina to post a reply there as as soon as possible.
As for the problem itself, we prepared a small sample that shows the approach that we suggest you to use in such scenario - I hope it will be of help.
Regards,
Georgi Tunev
Senior Support
Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Zeke Sheppard
Top achievements
Rank 1
Rank 1
answered on 26 Feb 2010, 05:31 PM
Any chance of actually keeping client side code on the client side only instead of adding it from the server side?
0
Zeke Sheppard
Top achievements
Rank 1
Rank 1
answered on 01 Mar 2010, 05:48 PM
The issue at hand regarding this (and several other) thread is getting Javascript to run on dynamically loaded user controls. Your sample does not address this issue and, per your group, only addresses the most simple implementations. To date, a satisfactory solution has yet to be provided, despite the fact that this appears to be an open issue on your site for nearly two years.
Nice job, guys!
Nice job, guys!
0
Zeke Sheppard
Top achievements
Rank 1
Rank 1
answered on 03 Mar 2010, 07:50 PM
Telerik,
The 6 line demo code you recently submitted will not compile. Brilliant!
This is coming from Senior Support Telerik team ?
Perhaps we have discovered the problem.....
The 6 line demo code you recently submitted will not compile. Brilliant!
This is coming from Senior Support Telerik team ?
Perhaps we have discovered the problem.....
0
Hi Zeke,
I apologize for missing a reference to another user control on the main page - in order to run the demo you should remove the following line:
(it was left from another sample - I apologize for the omission).
I am not completely sure however what exactly you mean by "The issue at hand regarding this (and several other) thread is getting Javascript to run on dynamically loaded user controls" - the demo I provided deals exactly with a dynamically loaded user control - it is loaded by using the LoadControl method as follows:
Furthermore no matter whether you load the control dynamically or static, this have nothing to do with the registering the script since it is registered in the load event and it will fire in both cases.
I attached a fully working demo along with a trial dll and Web.config and the deleted reference. If you still experience problems, it will be best to open a support ticket and to send us a sample project that reproduces your exact setup - this way we will provide you with the most appropriate solution for your scenario.
Regards,
Svetlina
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
I apologize for missing a reference to another user control on the main page - in order to run the demo you should remove the following line:
<%@ Register Src="ProductDetails.ascx" TagName="ProductDetails" TagPrefix="uc1" %>I am not completely sure however what exactly you mean by "The issue at hand regarding this (and several other) thread is getting Javascript to run on dynamically loaded user controls" - the demo I provided deals exactly with a dynamically loaded user control - it is loaded by using the LoadControl method as follows:
e.UpdatePanel.ContentTemplateContainer.Controls.Add(Page.LoadControl("~/UserControlWithScript.ascx"));Furthermore no matter whether you load the control dynamically or static, this have nothing to do with the registering the script since it is registered in the load event and it will fire in both cases.
I attached a fully working demo along with a trial dll and Web.config and the deleted reference. If you still experience problems, it will be best to open a support ticket and to send us a sample project that reproduces your exact setup - this way we will provide you with the most appropriate solution for your scenario.
Regards,
Svetlina
the Telerik team
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.