Problems with ASP.Net object and Javascript

Discussion in 'ASP .Net' started by tshad, Apr 20, 2005.

  1. tshad

    tshad Guest

    I am trying to set some labels to display calculated values with posting
    back to the server. So I am using Javascript to set the values of my
    asp:label. The problem is that an asp:lavel renders into a span element.

    For example:

    function SalaryDisplay(me)
    {
    var salaryMinLabel = document.getElementById("SalaryMin");
    salaryMinLabel.value = 200;
    alert("after setting salaryMinLabel = " + salaryMinLabel.value);
    }

    The asp.net object:

    <asp:label id="SalaryMin" runat="server" />

    Which renders into:

    <span id="SalaryMin"></span>

    The function seems to find the span fine. The alert box shows that it is
    set to 200. But the web page never shows it.

    There seemed to be a problem with the span element.

    Then I found out that the 'value' property on span does not display. The
    newly-created span element
    is empty and needs to have a text node appended. So to create the node I do
    the following:

    var salaryMinLabel = document.getElementById("SalaryMin");
    var sMLText = document.createTextNode("200")
    salaryMinLabel.appendChild(sMLText);
    alert("after setting salaryMinLabel = " +
    salaryMinLabel.firstChild.nodeValue);

    Even though it displays on the page the viewsource displays:

    &nbsp;&nbsp;Yearly Compens:<span id="SalaryMin"></span>&nbsp;/&nbsp;
    <span id="SalaryMax"></span>

    The value is not there.

    This obviously is not going to work. I spent a lot of time getting this
    work correctly and just found that if you go back a page (or forward) and
    then go back to the page - all this SPAN information that was just generated
    is now gone. Probably related to why it doesn't appear in Viewsource even
    though it is displaying on the original page.

    Is there a way to make sure it stays with the page on repost?

    Thanks,

    Tom
     
    tshad, Apr 20, 2005
    #1
    1. Advertising

  2. tshad

    Marina Guest

    First off, anything you change in javascript isn't going to be visible in
    View Source. That just shows the page exactly as it came down from the
    server.

    Try setting the innerText or innerHTML properties of the span. The 'value'
    property is good for input controls, i don't think it works for spans.

    "tshad" <> wrote in message
    news:...
    >I am trying to set some labels to display calculated values with posting
    >back to the server. So I am using Javascript to set the values of my
    >asp:label. The problem is that an asp:lavel renders into a span element.
    >
    > For example:
    >
    > function SalaryDisplay(me)
    > {
    > var salaryMinLabel = document.getElementById("SalaryMin");
    > salaryMinLabel.value = 200;
    > alert("after setting salaryMinLabel = " + salaryMinLabel.value);
    > }
    >
    > The asp.net object:
    >
    > <asp:label id="SalaryMin" runat="server" />
    >
    > Which renders into:
    >
    > <span id="SalaryMin"></span>
    >
    > The function seems to find the span fine. The alert box shows that it is
    > set to 200. But the web page never shows it.
    >
    > There seemed to be a problem with the span element.
    >
    > Then I found out that the 'value' property on span does not display. The
    > newly-created span element
    > is empty and needs to have a text node appended. So to create the node I
    > do the following:
    >
    > var salaryMinLabel = document.getElementById("SalaryMin");
    > var sMLText = document.createTextNode("200")
    > salaryMinLabel.appendChild(sMLText);
    > alert("after setting salaryMinLabel = " +
    > salaryMinLabel.firstChild.nodeValue);
    >
    > Even though it displays on the page the viewsource displays:
    >
    > &nbsp;&nbsp;Yearly Compens:<span id="SalaryMin"></span>&nbsp;/&nbsp;
    > <span id="SalaryMax"></span>
    >
    > The value is not there.
    >
    > This obviously is not going to work. I spent a lot of time getting this
    > work correctly and just found that if you go back a page (or forward) and
    > then go back to the page - all this SPAN information that was just
    > generated
    > is now gone. Probably related to why it doesn't appear in Viewsource even
    > though it is displaying on the original page.
    >
    > Is there a way to make sure it stays with the page on repost?
    >
    > Thanks,
    >
    > Tom
    >
     
    Marina, Apr 20, 2005
    #2
    1. Advertising

  3. Stick with innerHTML as it's in the W3C standard.

    innerText is only support by Internet Explorer.

    "Marina" wrote:

    > First off, anything you change in javascript isn't going to be visible in
    > View Source. That just shows the page exactly as it came down from the
    > server.
    >
    > Try setting the innerText or innerHTML properties of the span. The 'value'
    > property is good for input controls, i don't think it works for spans.
    >
    > "tshad" <> wrote in message
    > news:...
    > >I am trying to set some labels to display calculated values with posting
    > >back to the server. So I am using Javascript to set the values of my
    > >asp:label. The problem is that an asp:lavel renders into a span element.
    > >
    > > For example:
    > >
    > > function SalaryDisplay(me)
    > > {
    > > var salaryMinLabel = document.getElementById("SalaryMin");
    > > salaryMinLabel.value = 200;
    > > alert("after setting salaryMinLabel = " + salaryMinLabel.value);
    > > }
    > >
    > > The asp.net object:
    > >
    > > <asp:label id="SalaryMin" runat="server" />
    > >
    > > Which renders into:
    > >
    > > <span id="SalaryMin"></span>
    > >
    > > The function seems to find the span fine. The alert box shows that it is
    > > set to 200. But the web page never shows it.
    > >
    > > There seemed to be a problem with the span element.
    > >
    > > Then I found out that the 'value' property on span does not display. The
    > > newly-created span element
    > > is empty and needs to have a text node appended. So to create the node I
    > > do the following:
    > >
    > > var salaryMinLabel = document.getElementById("SalaryMin");
    > > var sMLText = document.createTextNode("200")
    > > salaryMinLabel.appendChild(sMLText);
    > > alert("after setting salaryMinLabel = " +
    > > salaryMinLabel.firstChild.nodeValue);
    > >
    > > Even though it displays on the page the viewsource displays:
    > >
    > > Yearly Compens:<span id="SalaryMin"></span> /
    > > <span id="SalaryMax"></span>
    > >
    > > The value is not there.
    > >
    > > This obviously is not going to work. I spent a lot of time getting this
    > > work correctly and just found that if you go back a page (or forward) and
    > > then go back to the page - all this SPAN information that was just
    > > generated
    > > is now gone. Probably related to why it doesn't appear in Viewsource even
    > > though it is displaying on the original page.
    > >
    > > Is there a way to make sure it stays with the page on repost?
    > >
    > > Thanks,
    > >
    > > Tom
    > >

    >
    >
    >
     
    =?Utf-8?B?Z2Vycm9k?=, Apr 20, 2005
    #3
  4. tshad

    tshad Guest

    "gerrod" <> wrote in message
    news:...
    > Stick with innerHTML as it's in the W3C standard.


    How do you set this in Javascript and does it carry over to the asp.net
    page?

    Does that mean I don't need to add a node as I have been doing?

    Thanks,

    Tom

    >
    > innerText is only support by Internet Explorer.
    >
    > "Marina" wrote:
    >
    >> First off, anything you change in javascript isn't going to be visible in
    >> View Source. That just shows the page exactly as it came down from the
    >> server.
    >>
    >> Try setting the innerText or innerHTML properties of the span. The
    >> 'value'
    >> property is good for input controls, i don't think it works for spans.
    >>
    >> "tshad" <> wrote in message
    >> news:...
    >> >I am trying to set some labels to display calculated values with posting
    >> >back to the server. So I am using Javascript to set the values of my
    >> >asp:label. The problem is that an asp:lavel renders into a span
    >> >element.
    >> >
    >> > For example:
    >> >
    >> > function SalaryDisplay(me)
    >> > {
    >> > var salaryMinLabel = document.getElementById("SalaryMin");
    >> > salaryMinLabel.value = 200;
    >> > alert("after setting salaryMinLabel = " + salaryMinLabel.value);
    >> > }
    >> >
    >> > The asp.net object:
    >> >
    >> > <asp:label id="SalaryMin" runat="server" />
    >> >
    >> > Which renders into:
    >> >
    >> > <span id="SalaryMin"></span>
    >> >
    >> > The function seems to find the span fine. The alert box shows that it
    >> > is
    >> > set to 200. But the web page never shows it.
    >> >
    >> > There seemed to be a problem with the span element.
    >> >
    >> > Then I found out that the 'value' property on span does not display.
    >> > The
    >> > newly-created span element
    >> > is empty and needs to have a text node appended. So to create the node
    >> > I
    >> > do the following:
    >> >
    >> > var salaryMinLabel = document.getElementById("SalaryMin");
    >> > var sMLText = document.createTextNode("200")
    >> > salaryMinLabel.appendChild(sMLText);
    >> > alert("after setting salaryMinLabel = " +
    >> > salaryMinLabel.firstChild.nodeValue);
    >> >
    >> > Even though it displays on the page the viewsource displays:
    >> >
    >> > Yearly Compens:<span id="SalaryMin"></span> /
    >> > <span id="SalaryMax"></span>
    >> >
    >> > The value is not there.
    >> >
    >> > This obviously is not going to work. I spent a lot of time getting
    >> > this
    >> > work correctly and just found that if you go back a page (or forward)
    >> > and
    >> > then go back to the page - all this SPAN information that was just
    >> > generated
    >> > is now gone. Probably related to why it doesn't appear in Viewsource
    >> > even
    >> > though it is displaying on the original page.
    >> >
    >> > Is there a way to make sure it stays with the page on repost?
    >> >
    >> > Thanks,
    >> >
    >> > Tom
    >> >

    >>
    >>
    >>
     
    tshad, Apr 21, 2005
    #4
  5. > How do you set this in Javascript and does it carry over to the asp.net
    > page?


    Nope, once it gets back to the server the value will be blank again. If you
    want to keep the value once you've posted back to the server, you'll need to
    put it into some type of input field, for example a HtmlInputHidden (<input
    type="hidden" id="blah" name="blah">). If you don't mark the hidden input
    field as runat="server", you'll still be able to access the value via
    Request.Form["blah"] (in C#, not sure what VB syntax is).

    To set the value via Javascript, it should be just:

    var salaryMinLabel = document.getElementById("SalaryMin");
    salaryMinLabel.innerHTML = '200';

    If you want to set it to a hidden input field (i.e. so it's persisted when
    you post-back), it should be just

    var salaryMinHidden = document.getElementById("SalaryMinHidden");
    salaryMinHidden.value = '200';

    > Does that mean I don't need to add a node as I have been doing?


    Yes, you shouldn't need to add a node.

    HTH -
    /gerrod
     
    =?Utf-8?B?Z2Vycm9k?=, Apr 21, 2005
    #5
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Stephen Gutknecht \(RS\)
    Replies:
    1
    Views:
    501
    Ravikanth[MVP]
    Aug 1, 2003
  2. David Virgil Hobbs
    Replies:
    0
    Views:
    542
    David Virgil Hobbs
    Jan 6, 2004
  3. Replies:
    3
    Views:
    853
    cannontrodder
    Jul 27, 2006
  4. Piotrek
    Replies:
    4
    Views:
    650
    Piotrek
    Aug 4, 2006
  5. tshad
    Replies:
    50
    Views:
    753
    Richard Cornford
    Apr 16, 2005
Loading...

Share This Page