Dec 22, 2009, 9:44 AM
Passing JavaScript variables between different UserControls
Hi folks,
I want to make a little survey how you pass javascript variables between user controls
What is your favorite way?
For example I have this little control (yes I know, Coolite 1.0 has resizeable Buttons :-) ):
This is a little UserControl which provides a NumPad for using in a touchscreen.
"var value" contains the current value.
At the moment I am assuming in my webpages (which use this control) that the "var value" exists.
But IMHO that´s not a very good and clean coding style, because I have no IntelliSense etc. for that value.
How do you use it? Is it maybe a better solution to use AjaxEvents or AjaxValues?
AFAIK AjaxEvents or Values are slower, which is not very usefull for a small little NumPad-Touchscreen application.
Regards,
Martin
I want to make a little survey how you pass javascript variables between user controls
What is your favorite way?
For example I have this little control (yes I know, Coolite 1.0 has resizeable Buttons :-) ):
<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="NumberInputControl.ascx.cs"
Inherits="etask.App.Controls.GL.NumberInputControl" %>
<%@ Register Assembly="Coolite.Ext.Web" Namespace="Coolite.Ext.Web" TagPrefix="ext" %>
<script type="text/javascript">
var value = "";
var addValue = function(val) {
if (val == 'x') {
if (value.length > 0) {
value = value.substring(0, value.length - 1);
}
}
else {
value += val;
}
return value;
}
</script>
<ext:Panel ID="InputPanel" Width="240" runat="server">
<Body>
<ext:TableLayout runat="server" Columns="3">
<ext:Cell>
<ext:ImageButton ID="Button1" runat="server" AlternateText="1" OverImageUrl="../../layout/pics/keypad/1_hover.png"
ImageUrl="../../layout/pics/keypad/1.png">
<Listeners>
<Click Handler="addValue('1');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button2" runat="server" AlternateText="2" OverImageUrl="../../layout/pics/keypad/2_hover.png"
ImageUrl="../../layout/pics/keypad/2.png">
<Listeners>
<Click Handler="addValue('2');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button3" runat="server" AlternateText="3" OverImageUrl="../../layout/pics/keypad/3_hover.png"
ImageUrl="../../layout/pics/keypad/3.png">
<Listeners>
<Click Handler="addValue('3');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button4" runat="server" AlternateText="4" OverImageUrl="../../layout/pics/keypad/4_hover.png"
ImageUrl="../../layout/pics/keypad/4.png">
<Listeners>
<Click Handler="addValue('4');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button5" runat="server" AlternateText="5" OverImageUrl="../../layout/pics/keypad/5_hover.png"
ImageUrl="../../layout/pics/keypad/5.png" >
<Listeners>
<Click Handler="addValue('5');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button6" runat="server" AlternateText="6" OverImageUrl="../../layout/pics/keypad/6_hover.png"
ImageUrl="../../layout/pics/keypad/6.png" >
<Listeners>
<Click Handler="addValue('6');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button7" runat="server" AlternateText="7" OverImageUrl="../../layout/pics/keypad/7_hover.png"
ImageUrl="../../layout/pics/keypad/7.png" >
<Listeners>
<Click Handler="addValue('7');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button8" runat="server" AlternateText="8" OverImageUrl="../../layout/pics/keypad/8_hover.png"
ImageUrl="../../layout/pics/keypad/8.png" >
<Listeners>
<Click Handler="addValue('8');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button9" runat="server" AlternateText="9" OverImageUrl="../../layout/pics/keypad/9_hover.png"
ImageUrl="../../layout/pics/keypad/9.png" >
<Listeners>
<Click Handler="addValue('9');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="Button0" runat="server" AlternateText="0" OverImageUrl="../../layout/pics/keypad/0_hover.png"
ImageUrl="../../layout/pics/keypad/0.png" >
<Listeners>
<Click Handler="addValue('0');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
<ext:Cell>
<ext:ImageButton ID="ButtonDelete" runat="server" AlternateText="x" OverImageUrl="../../layout/pics/keypad/del_hover.png"
ImageUrl="../../layout/pics/keypad/del.png" >
<Listeners>
<Click Handler="addValue('x');" />
</Listeners>
</ext:ImageButton>
</ext:Cell>
</ext:TableLayout>
</Body>
</ext:Panel>
This is a little UserControl which provides a NumPad for using in a touchscreen.
"var value" contains the current value.
At the moment I am assuming in my webpages (which use this control) that the "var value" exists.
But IMHO that´s not a very good and clean coding style, because I have no IntelliSense etc. for that value.
How do you use it? Is it maybe a better solution to use AjaxEvents or AjaxValues?
AFAIK AjaxEvents or Values are slower, which is not very usefull for a small little NumPad-Touchscreen application.
Regards,
Martin