PDA

View Full Version : [CLOSED] button handle assign code behind does not work



jstifel
Oct 04, 2013, 8:10 PM
I tripped with a little problem when trying to assign a javascript code to the click handle of a button. Basically on the DirectEvent of a Button I set the handle property of a second Button to "alert('ok2');".
I now try to click the second button after pressed the first one and nothing happens. I guess I should get the alert message.
I understand this is a regular procedure to assign javascript code to the click event so I wonder what I am doing wrong or if it is finally due to a bug in the Ext.Net library.
By the way, I have tried the some example with different types of navigators getting the some all the times.

Thanks for your help.

Here goes the test code:

default.aspx:


<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="extnet_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<extnet:ResourceManager runat="server" />
<extnet:Hidden runat="server" ID="hidden1"></extnet:Hidden>
<extnet:Button runat="server" ID="Button1" Text="Cambiar click">
<DirectEvents>
<Click OnEvent="Changeclick">
</Click>
</DirectEvents>
</extnet:Button>
<extnet:Button runat="server" ID="btn1" Text="Probar Click">
</extnet:Button>
<extnet:TextField runat="server" ID="textbox1"></extnet:TextField>
</form>
</body>
</html>

default.aspx.vb:


Imports Ext.Net

Partial Class extnet_Default
Inherits BasicPage

Protected Sub Page_Load(sender As Object, e As System.EventArgs) Handles Me.Load
textbox1.Text = hidden1.Text
End Sub

Public Sub Changeclick()
btn1.Listeners.Click.Handler = "alert('ok2');"
'btn1.Listeners.Click.Fn = "function(){alert('ok2');}"
'btn1.On("click", New JFunction("alert('ok2');", "button", "e"))
'btn1.OnClientClick = "alert('ok2');"
hidden1.Text = "ok1"
End Sub
End Class

Baidaly
Oct 04, 2013, 11:58 PM
Hello!

Please, don't forget to wrap your code in CODE tag. Read paragraph 3 here: http://forums.ext.net/showthread.php?3440

During DirectEvents you should call methods instead of using properies, so your method should look like that:


Public Sub Changeclick()
btn1.AddListener("click", "function() {alert('ok2'); }")
hidden1.Text = "ok1"
End Sub

jstifel
Oct 05, 2013, 10:11 AM
Thank you very much. It worked perfectly.
You may now close the case.

jstifel
Oct 05, 2013, 10:55 AM
Sorry to bother you again but I realized that if I click twice the first button and once the second button I get the alert message twice. I guess click events start to pile up when using the addListener method. Is it there any way to clear all previous listeners in code behind? I tried the btn1.Listeners.ClearListeners method with no result. I also tried btn1.clearListeners but this time when clicking the button I get no alert message.

Baidaly
Oct 05, 2013, 10:27 PM
You can use Single property:


Button1.AddListener("click", "function() {alert('ok2'); }", "this", new HandlerConfig { Single = true });

Or you can use hidden field which you can set when you have a handler and send it to the server as an ExtraParam.

To remove all listeners, you can use ClearListeners method:


Button1.ClearListeners();

jstifel
Oct 06, 2013, 12:45 PM
Calling AddListener with the extra Param Single does not really works because the event associated to the click runs only once time not allowing the user to be able to click it again to obtain the some result.
I think Button1.ClearListeners() should be the right way to do it calling it just before the AddListener method. Problem is if I do that, no event handler seems to be associated so clicking then second button does nothing. It is like the ClearListeners method not only clears the previous handlers but also disable the new ones.

I have worked around the situation associating a DirectEvent on click to the second button and in code behind used the addScript method to add the javascript code that I want executed based on the context set by the first button. I used as you mention a hidden field to keep the context. It works fine although it forces a second trip to the server to get the proper javascript which I would not really like to have to make.

Daniil
Oct 07, 2013, 5:51 AM
Yes, the ClearListeners should be used carefully, it removes all the listeners including the internal ones.

You might use the RemoveListener. Though, in this case a JavaScript function must have a name.

Example AddListener/RemoveListener

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
protected void Add(object sender, DirectEventArgs e)
{
this.Button1.RemoveListener("click", "myClickHanlder");
X.Js.AddScript(string.Format("var myClickHanlder = function () {{ alert({0}); }};", DateTime.Now.Second));
this.Button1.AddListener("click", "myClickHanlder");
}
</script>

<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />

<ext:Button ID="Button1" runat="server" Text="Click me" />

<ext:Button runat="server" Text="Add new Click listener" OnDirectClick="Add" />
</form>
</body>
</html>


Another approach is using a Button's SetHandler method.

Example SetHandler

<%@ Page Language="C#" %>

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>

<script runat="server">
protected void Add(object sender, DirectEventArgs e)
{
this.Button1.SetHandler(string.Format("function () {{ alert({0}); }}", DateTime.Now.Second), null);
}
</script>

<!DOCTYPE html>
<html>
<head runat="server">
<title>Ext.NET v2 Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />

<ext:Button ID="Button1" runat="server" Text="Click me" />

<ext:Button runat="server" Text="Add new Click listener" OnDirectClick="Add" />
</form>
</body>
</html>