assign value to a textbox obtained from a javascript function on page load

Question

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...

Answer 1

<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>

Answer 2

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.

assign value to a textbox obtained from a javascript function on page load

Question

2 answers

solution1
1 2011-10-05 01:42:21

solution2
1 ACCPTED 2011-10-05 07:09:34

assign value to a textbox obtained from a javascript function on page load

Question

2 answers

solution1 1 2011-10-05 01:42:21

solution2 1 ACCPTED 2011-10-05 07:09:34

solution1
1 2011-10-05 01:42:21

solution2
1 ACCPTED 2011-10-05 07:09:34