1

This has been bothering me for quite some time. I'm simply trying to change the value of a textbox defined in asp.net, which normally works when it is not within a LoggedInTemplate.

I've searched everywhere on the net and even here, but the only thing I can find close to doing what I need is here Finding an asp:button and asp:textbox in Javascript. Unfortunately that doesn't work. Here's what I have so far:

<head id="Head1" runat="server">
  <script src="../../scripts/webeffects.js" type="text/javascript" language="javascript"></script>
</head>
<asp:LoginView ID="LoginView1" runat="server">
  <LoggedInTemplate>
  <div class="lotto_pick_container">
    <table runat="server" id="tblLottoPick">
      <tr><th colspan="3">Pick a Lotto Number</th></tr>
  <tr>
    <td><asp:TextBox ID="txt1stNum" runat="server"></asp:TextBox></td>
    <td><asp:TextBox ID="txt2ndNum" runat="server"></asp:TextBox></td>
    <td><asp:TextBox ID="txt3rdNum" runat="server"></asp:TextBox></td>
  </tr>
  <tr>
    <td><asp:Button ID="cmdSubmitPick" runat="server" Text="Submit Lotto Number" 
        onclientclick="return validateLottoPicks()" /></td>
  </tr>
</table>
  </div>
  </LoggedInTemplate>
</asp:LoginView>

Right now I'm trying to use an external js script to find a textbox and modify it with an arbitrary value of 12, just so that I know it can work:

function validateLottoPicks() {
  document.getElementById('<%= LoginView1.FindControl("txt2ndNum").ClientID %>').value = 12
}

When I debug this with Firebug it seems all my other code works, except for this one function. I have verified the function gets called, it's just this line that doesn't work. Can someone please provide some guidance? I'll send milk and cookies.

Update:

Thanks for all the help from everyone. This was my first time using Stack Overflow and I was definitely impressed by the quick responses.

It turns out my actual problem was that using <%= LoginView1.FindControl("txt2ndNum").ClientID %> does not work in external js scripts. I didn't know this. Once, I put the function in the header of my page everything worked. Now I'm going to avoid using ASP.NET controls because I don't want to deal with that again, and it makes more sense if I ever decide to use something other than ASP.NET.

Community
  • 1
  • 1
SantosLHalper
  • 13
  • 1
  • 5
  • What ID is output to the script? What ID does the control actually get? What error is raised? – Dave Jun 20 '11 at 14:20
  • 1
    Don't hack the ASP.NET ViewState on the client using javascript. Either use ASP.NET controls or use HTML inputs and `Form.Request` – Raynos Jun 20 '11 at 14:30
  • @Raynos I didn't know that what I am trying to do is considered hacking ViewState. Really, I'm just trying to do some client-side validation to save trips to the server. Is my whole approach wrong? – SantosLHalper Jun 20 '11 at 16:04
  • clientside validation is fine. ASP.NET is notorious for not remembering state changes made in JavaScript once server side controls get to the server. Btw your approach is wrong, your using ASP.NET ;) – Raynos Jun 20 '11 at 16:11

3 Answers3

2

The problem is that you have set visible=false on this line

<table runat="server" id="tblLottoPick" visible="false">

From that moment the controls are not rendered the javascript can not find this control. If you do not wish to show this table use css, for example style="display:none;" so its rendered but not visible. All the rest seems to me that working.

Update

From the comments also seems that this code is not inside the aspx page, so the ClientID can not work and not found. Add this somewhere in the header in the page that have this LoginView1 control.

function validateLottoPicks() {
  document.getElementById('<%= LoginView1.FindControl("txt2ndNum").ClientID %>').value = 12
}
Aristos
  • 66,005
  • 16
  • 114
  • 150
  • 1
    Good catch. I didn't even see the visible="false" property. – Dave Jun 20 '11 at 14:36
  • I removed the visible="false" and it still doesn't work. I'm getting this message in Firebug: TypeError: document.getElementById("<%= tblLottoPick.FindControl(\"txt2ndNum\").ClientID %>") is null – SantosLHalper Jun 20 '11 at 15:10
  • @Peter Where are you have place the <%= tblLottoPick.FindControl(\"txt2ndNum\").ClientID %>, because seems that you have includ it on JS and is not render it ! – Aristos Jun 20 '11 at 15:11
  • @Peter you need to add the <%= tblLottoPick.FindControl("txt2ndNum").ClientID %> inside the aspx page. ! – Aristos Jun 20 '11 at 15:11
  • I added this to the header and it still doesn't work. Regardless, shouldn't it work anyway, I'm using an external script? – SantosLHalper Jun 20 '11 at 15:53
  • @Peter if you get the error document.getElementById("<%= tblLottoPick.FindControl(\"txt2ndNum\").ClientID %>") is null then seems that the script is not run because you do not get the real clientID. – Aristos Jun 20 '11 at 16:08
  • I used the rendered id as per Trevor's suggestion below, id="LoginView1_txt2ndNum", and it grabs the value through my external script, so the script is running. – SantosLHalper Jun 20 '11 at 16:15
  • I see what you mean. I came across another article where the person had the problem with the variable being populated with the literal "<%= tblLottoPick.FindControl(\"txt2ndNum\").ClientID %>" This is only the case for external scripts though. I tried your suggestion at the top of the page and it works fine. Thanks! – SantosLHalper Jun 20 '11 at 20:23
0

Try

tblLottoPick.FindControl("txt2ndNum").ClientID instead.

Duncan Howe
  • 2,965
  • 19
  • 18
0

Try putting this into a javascript string variable. What are you getting?

'<%= LoginView1.FindControl("txt2ndNum").ClientID %>'

Because you shouldn't have to do that. Can you just do this?

document.getElementById('txt2ndNum')

Also, check in firebug to see what the ID value is set to for that control (i.e. the rendered textbox). I mean see what it's rendered as. You just need to get the right id.

Trevor
  • 4,620
  • 2
  • 28
  • 37