assign value to a textbox obtained from a javascript function on page load
Quick background: I am new to programming and have been using VisualStudio, ASP.NET, and C# for a couple months. I have no experience with JavaScript. I am trying to convert times from UTC to the time local to the browser viewing a page. After research I believe my best option for the various things I need to do is to detect the local offset from UTC on page load and then hold that information to use for local conversion and postback to the server.
I have written the following js function in my "Source" page:
<script type="text/javascript" >
function calculateOffset() {
var rightNow = new Date();
var UTCTime = rightNow.getUTCHours();
var LocalTime = rightNow.getHours();
var UTCDate = rightNow.getUTCDate();
var LocalDate = rightNow.getDate();
if (UTCDate == LocalDate) {
var offset = LocalTime - UTCTime;
}
else {
var offset = LocalTime - 24 - UTCTime;
}
return offset;
}
</script>
I then have a TextBox Control that I would like to use to hold the offset returned:
<asp:TextBox ID="HiddenOffsetBox" runat="server" Visible="False" 开发者_高级运维Text ="<%# calculateOffset() %>" ></asp:TextBox>
I receive the following error on debugging: Compiler Error Message: CS0103: The name 'calculateOffset' does not exist in the current context
This is in a child page inheriting from a master page, I have tried placing the JS in both the head and body content, I have also created a .js file but haven't figured out how to call it. Primarily I am looking for a way to get the offset output from the JS function into the textbox but if you have any other suggestions I welcome them. Thanks ahead of time!
EDIT I created a test asp.net web form to try the suggestion below, to simplify everything here is the code:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestForm.aspx.cs" Inherits="GTLWebApp.TestForm" %>
<!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">
<script type="text/javascript" >
$(document).ready(function () {
// recommend using jQuery to make sure the page is loaded
document.getElementById('<%= HiddenOffsetBox.ClientID%>').text = calculateOffset();
//or
//jQuery way
//$('#<%= HiddenOffsetBox.ClientID%>').val(calculateOffset());
function calculateOffset() {
var rightNow = new Date();
var UTCTime = rightNow.getUTCHours();
var LocalTime = rightNow.getHours();
var UTCDate = rightNow.getUTCDate();
var LocalDate = rightNow.getDate();
if (UTCDate == LocalDate) {
var offset = LocalTime - UTCTime;
}
else {
var offset = LocalTime - 24 - UTCTime;
}
return offset;
}
</script>
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:TextBox ID="HiddenOffsetBox" runat="server" Visible="True" Text = ""></asp:TextBox>
</div>
</form>
</body>
</html>
When I run this I get no errors but I don't get the offset in the text box, any further help would be appreciated...
The following is working for me.
this.ClientScript.RegisterStartupScript(this.GetType(), "key", "<script type='text/javascript'> calculateOffset() </script>");
Just paste this line on your Page_Load event.
Also instead of "return offset" you can directly assign the value of "offset" to the textbox as:
document.getElementById("<%=HiddenOffsetBox.ClientID %>").value = offset;
Hope this helps.
<script type="text/javascript" >
//un-comment for jQuery
//recommend using jQuery to make sure the page is loaded
//$(document).ready(function() {
// $('#<%= HiddenOffsetBox.ClientID%>').val(calculateOffset());
//});
document.getElementById('<%= HiddenOffsetBox.ClientID%>').value = calculateOffset();
function calculateOffset() {
var rightNow = new Date();
var UTCTime = rightNow.getUTCHours();
var LocalTime = rightNow.getHours();
var UTCDate = rightNow.getUTCDate();
var LocalDate = rightNow.getDate();
if (UTCDate == LocalDate) {
var offset = LocalTime - UTCTime;
}
else {
var offset = LocalTime - 24 - UTCTime;
}
return offset;
}
</script>
<asp:hidden ID="HiddenOffsetBox" runat="server" value="" ></asp:hidden>
加载中,请稍侯......
精彩评论