G
Guest
I'm trying to pass two values from client script (Javascript) to the
code-behind for a page using three hidden fields - two to hold the values and
a third to fire the ValueChanged event.
I have tried every method I can think of to get the event to fire, but it
will not, so either I am missing some code or am misunderstanding the nature
of the event. If anyone can review the test code posted below (which I
created to try to debug the problem) and provide some help, it would be much
appreciated.
What I'm doing is using a Javascript function (moveValues()) to copy
whatever is typed into the two text boxes to the hidden fields, and also
change the value of the third hidden field in an attempt to fire the event.
I've used the VS2005 debugging facility to confirm that the Javascript
function is working correctly; however, the c# code is never called.
Web form code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs"
Inherits="HFTest" %>
<!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>Hidden Field Test</title>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:HiddenField ID="HiddenField1" runat="server" value="" />
<asp:HiddenField ID="HiddenField2" runat="server" value="" />
<asp:HiddenField ID="HiddenField3" runat="server" value=""
OnValueChanged="OnHiddenValuesChanged" />
</div>
<div>
<input id="Text1" type="text" />
<br />
<input id="Text2" type="text" />
<br />
<input id="Button2" type="button" value="Submit"
onclick="moveValues()" />
<br />
</div>
<div id="results" runat="server">
</div>
</form>
</body>
</html>
Javascript function:
function moveValues()
{
var txt1 = document.getElementById('Text1').getAttribute('value');
var txt2 = document.getElementById('Text2').getAttribute('value');
document.getElementById('HiddenField1').setAttribute('value', txt1);
document.getElementById('HiddenField2').setAttribute('value', txt2);
form1.HiddenField3.value = 'change';
}
Code-behind function:
protected void OnHiddenValuesChanged(object sender, EventArgs e)
{
StringBuilder sb = new StringBuilder("<b>Text Box 1: </b>");
sb.Append(HiddenField1.Value);
sb.Append("<br />");
sb.Append("<b>Text Box 2: </b>");
sb.Append(HiddenField2.Value);
results.InnerHtml = sb.ToString();
}
code-behind for a page using three hidden fields - two to hold the values and
a third to fire the ValueChanged event.
I have tried every method I can think of to get the event to fire, but it
will not, so either I am missing some code or am misunderstanding the nature
of the event. If anyone can review the test code posted below (which I
created to try to debug the problem) and provide some help, it would be much
appreciated.
What I'm doing is using a Javascript function (moveValues()) to copy
whatever is typed into the two text boxes to the hidden fields, and also
change the value of the third hidden field in an attempt to fire the event.
I've used the VS2005 debugging facility to confirm that the Javascript
function is working correctly; however, the c# code is never called.
Web form code:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs"
Inherits="HFTest" %>
<!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>Hidden Field Test</title>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:HiddenField ID="HiddenField1" runat="server" value="" />
<asp:HiddenField ID="HiddenField2" runat="server" value="" />
<asp:HiddenField ID="HiddenField3" runat="server" value=""
OnValueChanged="OnHiddenValuesChanged" />
</div>
<div>
<input id="Text1" type="text" />
<br />
<input id="Text2" type="text" />
<br />
<input id="Button2" type="button" value="Submit"
onclick="moveValues()" />
<br />
</div>
<div id="results" runat="server">
</div>
</form>
</body>
</html>
Javascript function:
function moveValues()
{
var txt1 = document.getElementById('Text1').getAttribute('value');
var txt2 = document.getElementById('Text2').getAttribute('value');
document.getElementById('HiddenField1').setAttribute('value', txt1);
document.getElementById('HiddenField2').setAttribute('value', txt2);
form1.HiddenField3.value = 'change';
}
Code-behind function:
protected void OnHiddenValuesChanged(object sender, EventArgs e)
{
StringBuilder sb = new StringBuilder("<b>Text Box 1: </b>");
sb.Append(HiddenField1.Value);
sb.Append("<br />");
sb.Append("<b>Text Box 2: </b>");
sb.Append(HiddenField2.Value);
results.InnerHtml = sb.ToString();
}