Link to home
Start Free TrialLog in
Avatar of myester
myester

asked on

HTML textbox contents cleared when clicking on webcontrols.button control

I'm very new to asp.net so please forgive my ingnorace:


I have a webform with an html textbox and a webcontrols.button control. Whenever I click on the webcontrols.button control the contents of the html textbox is cleared. This does not happen with a webcontrols.textbox. Why does this happen, and how can I keep if from happening? I'm using a javascript date picker (from http://javascript.internet.com/calendars/date-picker.html) that utilizes the html texbox. I need the textbox to maintain the value whenever a webcontrols.button is clicked. As an alternative is it possible make javascript date picker work with a webcontrols.textbox instead of an html textbox?

Thanks
Avatar of SThorogood
SThorogood

WebControls (and HtmlControls, I think) will automatically 'remember' their value across postbacks whereas normal html form elements don't by default. I assume that you are using a html texbox (with no runat=server attribute) to avoid the ID of the element being changed?

If this is the case, you could consider writing the input element into the page dynamically using a Literal Control or <%= %> syntax. On each postback, you can then manually set the value of the control based on the posted form value.
just out of curiousity...have you set the property "EnableViewState" of your textbox to "True"?

Also, in your page delcaration of your html page, have you set the EnableSessionState="true" as well?
ASKER CERTIFIED SOLUTION
Avatar of dharmesh_amity
dharmesh_amity

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of myester

ASKER

SThorogood, I am using an html textbox, but I put in the runat=server attribute so I can use it in the code behind.

brdrok, I don't see a "EnableViewState" property for the html textbox. The webcontrols.textbox has this property, but I don't see it for the html textbox.
myester:

because the html textbox is not a web server control.  if you changed the html textbox to a web server control...you should see "EnableViewState" as one of the  choices inside your property box.  
Avatar of myester

ASKER

dharmesh I'm trying your suggestion, but I have a question. What does ("SomeText") represent in ViewState("SomeText") = ""? Is this the id= or the name= in the Input tag? Here is what I have, but it's not working:

<body MS_POSITIONING="GridLayout">
            <div id="overDiv" style="Z-INDEX: 101; VISIBILITY: hidden; POSITION: absolute"></div>
            <form id="form1" method="post" runat="server">
                  <asp:Button id="Button3" style="Z-INDEX: 102; LEFT: 344px; POSITION: absolute; TOP: 88px" runat="server"
                        Text="Button"></asp:Button>
            </form>
            <form name="sample" method="post" action="popupcalsample.html">
                  <p>
                        Beginning date: <input id="T1" type="text" name="T1" size="20" value='<%# GetValue()%>' >
                        <!-- ggPosX and ggPosY not set, so popup will autolocate to the right of the graphic -->
                        <a href="javascript:show_calendar('sample.T1');" onMouseOver="window.status='Date Picker'; overlib('Click here to choose a date from a one month pop-up calendar.'); return true;"
                              onMouseOut="window.status=''; nd(); return true;"><img src="http://nordenterprises.com/h-o-a-home/images/show-calendar.gif" width="24"
                                    height="22" border="0"></a>
                  </p>
                  <p><input type="submit" value="Submit" name="B1"><input type="reset" value="Reset" name="B2"></p>
            </form>
      </body>

And in the code behind I have this:

Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
        'Put user code to initialize the page here
        If IsPostBack Then
            ViewState("T1") = Request.Form("T1")
        End If
        DataBind()
    End Sub
    Function GetValue() As String
        If Not IsPostBack Then
            GetValue = ""
            ViewState("T1") = ""
        Else
            GetValue = DirectCast(ViewState("T1"), String)
        End If
    End Function

Thanks for your help!
ViewState is a key/value collection. So "SomeText" is a key. You can use anything instead. It has nothing to do with the id or name of the html control.

I see that you have two <form> tags in your code.

Keep everything in one form which is generated by ASP.NET WebForm. I just tried this method and it works for me. In ASP.NET Webform should have only on form element with runat=server
SOLUTION
Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
I think that the multiple form tags are the issue here - The value of the html text control will not be posted to the server unless the control is in the same form as the button that initiates the postback.

I agree that ViewState is not relevant .
I do not agree with you guys. ViewState is maintained by a hidden control. ASP.NET will put this control in the form where there is runat="server". So the problem will be the ViewState will not be posted if you have another form being submitted and you will not get what you want. Michael youcan try that, it will not work.

Thanks,

Dharmesh
oh I agree with you there 100% dharmesh_amity, the only way you could get it to work is to run some js with the non-runat=server form submits to copy over the viewstate.  I didn't realize that there were multiple forms (why would you need that anyway?)
Avatar of myester

ASKER

dharmesh, Michael, again I'm totaly new to this so it wouldn't surprise me if the whole thing is totally messed up. The reason there are two form tags is because I copied and pasted the date picker code into an existing form that already had a form tag generated by VS2003. I will get rid of the form tag that does not have runat="server". There is some js that is a part of the date picker. I will post it here if that would help. In the mean time I will keep trying. By the way I got the code I'm trying to use from http://javascript.internet.com/calendars/date-picker.html. Thanks for all your help!

{EDIT - removed javascript code to keep size of post down, go to above link to see it}
Raterus - ASP.net page editor
This is actually my favorite for a date-picker, I wrote my own asp.net control around it I liked it so much!

http://www.mattkruse.com/javascript/calendarpopup/

You should be able to use it in your site, and it is a little more straight forward.  There are many others, some that work right off the bat with asp.net, I don't have access to my favorites at work, I'll post a fully asp.net control in the morning.

--Michael
Avatar of myester

ASKER

Thanks raterus for cleaning me up! The popup calendar in your post is really nice. I was hoping to be able to use just the straight javascript datepicker to avoid problems with pop-up blockers causing a problem. Anyway I will look forward to your other suggestions tomorrow, and may just inplement your favorite and see how it works on my site.

Thanks for your time and help.
Usually popup blockers leave any popup alone that was caused as a direct result of you clicking on a button, at least they should.  You probably saw it as well, but the popup I suggested will also pop-up in a <div>, so it's not a real popup.
just for the record wanted to mention that viewstate for tetbox are not controlled the way it done for other controls ..  u can check this out by creating a form with all viewstate disabled and adding a textbox .. and submitting the page to itself .. I think it will maintain the state ...
explained over here .. also explains where viewstate is exaclty used in the case of controls like textbox etc .. it seems it used to check whether the textvhanged event has to fired .. style too seems to be stored in viewstate ..
http://www.mcse.ms/archive109-2003-12-223561.html
BTW, i haven't tested all that is mentioned in the above link .. anyone interested could try it and let us know ..

raterus, the link u provided is really good ... am planning to create a "date input" web control using the javascript provided over there .. thx ...
Avatar of myester

ASKER

Okay raterus I now have the html textbox retaining a date that I manually enter into it. But with the form set to runat="server" my datepicker calendar will not populate the box with a date when I click on the calendar. The calendar pops up okay, but clicking at day on it no longer puts that date in the textbox. Could this be because the javascript is client side while the form is running at the server? It seems like I'm really close to have this work the way I want.

Thanks!
form runat="server" has nothing to do with the clientside operations, like this calendar.  You probably just have a simple error in how you've set up the calendar.  Can you post the HTML of the rendered page, at least the key parts, textbox, hyperlink.  My guess is you haven't correctly set the ID property of the textbox in the picker
Avatar of myester

ASKER

raterus here is the code you requested. Again the calendar works fine until I put runat="server" in the form tag.

<body MS_POSITIONING="GridLayout">
            <div id="overDiv" style="Z-INDEX:1000; VISIBILITY:hidden; POSITION:absolute"></div>
            <form name="_ctl0" method="post" action="WebForm1.aspx" id="_ctl0">
<input type="hidden" name="__VIEWSTATE" value="dDwtMTI3OTMzNDM4NDs7PrG2iTkunKAUsFWNJi1FtWJJQ73S" />

                  <p>Beginning date: <input type="text" name="T1" size="20">
                        <!-- ggPosX and ggPosY not set, so popup will autolocate to the right of the graphic -->
                        <a href="javascript:show_calendar('sample.T1');" onMouseOver="window.status='Date Picker'; overlib('Click here to choose a date from a one month pop-up calendar.'); return true;"
                              onMouseOut="window.status=''; nd(); return true;"><img src="http://nordenterprises.com/h-o-a-home/images/show-calendar.gif" width="24"
                                    height="22" border="0"></a>
                  </p>
            </form>
      </body>

Thanks for your help.
In my opnion raterus's comments should be accepted .....