It appears you have not yet registered with DEVPPL. To register please click here... (it's fast, easy and free!)

Forum

Log In Sponsors
Board index ‹ Programming ‹ HTML Forum

clearing input boxes onloading of the page

Post a reply

clearing input boxes onloading of the page

Postby bigman85 on Fri Mar 16, 2007 11:28 am

Hello All

I dont know how to clear several input boxes when the page is loaded for the first time and everyother time.

Can anyone show me how to do it i have looked everywhere for the answer?

Help would be very greatfully appresiated

Thanks
bigman85
 
Posts: 3
Joined: Fri Mar 16, 2007 11:20 am
Top

Postby sachav on Fri Mar 16, 2007 2:08 pm

First, you need a name to your form.
Let's say your form name is "frm".
Let's say the input 1 that you want to clear is called "myinput1"
Then you should put right after </body> :
Code: Select all
<script language="javascript">
document.frm.myinput1.value=""
</script>


Because the syntax to assign a value to an input is:
Code: Select all
<script language="javascript">
document.FORMNAME.INPUTNAME.value="NEW VALUE"
</script>


Let's say you want to clear 5 different inputs; then just put:
Code: Select all
<script language="javascript">
document.frm.myinput1.value=""
document.frm.myinput2.value=""
document.frm.myinput3.value=""
document.frm.myinput4.value=""
document.frm.myinput5.value=""
</script>


Or let's say you want to clear ALL THE INPUTS of the form:
Code: Select all
<script language="javascript">
document.frm.reset()
</script>
sachav
 
Posts: 32
Joined: Sat Mar 03, 2007 3:40 pm
Top

Postby bigman85 on Fri Mar 16, 2007 2:39 pm

that doesnt Work because i can not enter anything into the boxes at all.
any other ideas?
bigman85
 
Posts: 3
Joined: Fri Mar 16, 2007 11:20 am
Top

Postby sachav on Fri Mar 16, 2007 5:18 pm

Show me the entire code
sachav
 
Posts: 32
Joined: Sat Mar 03, 2007 3:40 pm
Top

Postby bigman85 on Tue Mar 20, 2007 4:52 pm

here is the complete html code it is generated via JavaServer Faces Page

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="expires" content="0" />
<title>ScotlandsPeople Centre -Book</title>
<link rel="stylesheet" type="text/css" href="/book2/css/base.css" />
<link rel="stylesheet" type="text/css" href="/book2/css/buttons.css" />
<link rel="stylesheet" type="text/css" href="/book2/js/skins/calendar-blue.css" title="Awinter" />
<script type="text/javascript" src="/book2/js/calendar.js"></script>
<script type="text/javascript" src="/book2/js/calendar-setup.js"></script>
<script type="text/javascript" src="/book2/js/calendar-handler.js"></script>
<script type="text/javascript" src="/book2/js/lang/calendar-en.js"></script>
<script type="text/javascript" src="/book2/js/prototype.lite.js"></script>
<script type="text/javascript" src="/book2/js/moo.fx.js"></script>
<script type="text/javascript" src="/book2/js/moo.fx.pack.js"></script>
<script type="text/javascript" src="/book2/js/global.js"></script>
<link rel="stylesheet" type="text/css" href="/book2/css/tabs/book.css" />
</head>

<body>
<div id="container" class="clearfix">

<div id="logo" class="floatleft">
<h1><img src="/book2/images/logo.gif" alt="ScotlandsPeople - Connecting Generations" />
</h1>
</div>

<div id="header">
<ul id="tabnav">
<li><a id="index" href="/book2/index.jsf" title="ScotlandsPeople Centre Home Page">ScotlandsPeople Centre</a></li>
<li><a id="book" href="/book2/book/index.jsf" title="Book your Seat for ScotlandsPeople Centre">Seat Booking</a></li>
<li><a id="account" href="/book2/account/index.jsf" title="View your account information">Your Account</a></li>

<li class="reader"><a id="subnav" href="#subnav">Skip to section navigation</a></li>
<li class="reader"><a id="rightcontent" href="#right_content">Skip to main content</a></li>
<li class="reader"><a id="searchlinks" href="#search_links">Skip to search form links</a></li>
</ul>
</div>

<div id="content" class="clearfix">
<div id="bar">

<div class="spacer"></div><a href="">Useful Websites</a>
&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;<a href="">Help</a>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
</div>

<div id="right_content">
<h1>Seat Booking - Choose Dates.</h1><form id="form1" method="post" action="/book2/book/individual.jsf" enctype="application/x-www-form-urlencoded">

<p>Bookings are charged at <strong>&pound;10</strong> per day.</p>
<div id="main_content_top_bar">
<p>Book seats for 20 dates for one or two people.</p>

</div>
<div id="subheading">
<p class="assist">Click Here for Assistance <a href="#" class="help_tooltip" id="assisted" onmouseover="ajax_showTooltip('help/gender.htm',this);return false" onmouseout="ajax_hideTooltip()">?</a></p>

</div>
<div id="main_content">
<p class="numpeople">
No of People.&nbsp;<select id="form1:noofpeople" name="form1:noofpeople" size="1"> <option value="0">1</option>
<option value="1">2</option>
</select>
For more than two people please contact SFHS for group booking.

</p>

<div id="calenderdat" class="floatleft">
Please enter each date you wish to book in the format <em>dd/mm/yy</em>:<br /><br /><br /><br />
<p><a href="#" id="caltrigger" onmouseout="return nd();">Click here to open calendar..<img alt="calendar icon" src="/book2/images/calendar.gif" /></a></p>
</div>

<div>

<table id="dates">
<tr>
<td><input id="form1:bookDate1" type="text" name="form1:bookDate1" value="Wed 21 Mar 07" onblur="return checkdates(this.is, 1)" />

</td>
<td><input id="form1:bookDate2" type="text" name="form1:bookDate2" value="Thu 22 Mar 07" onblur="return checkdates(this.is, 2)" />

</td>
<td><input id="form1:bookDate3" type="text" name="form1:bookDate3" value="Fri 23 Mar 07" onblur="return checkdates(this.is, 3)" />

</td>
<td><input id="form1:bookDate4" type="text" name="form1:bookDate4" value="" onblur="return checkdates(this.id, 4)" />

</td>
<td><input id="form1:bookDate5" type="text" name="form1:bookDate5" value="" onblur="return checkdates(this.id, 5)" />

</td>
</tr>
<tr>
<td><input id="form1:bookDate6" type="text" name="form1:bookDate6" value="" onblur="return checkdates(this.id, 6)" />
</td>
<td><input id="form1:bookDate7" type="text" name="form1:bookDate7" value="" onblur="return checkdates(this.id, 7)" />
</td>
<td><input id="form1:bookDate8" type="text" name="form1:bookDate8" value="" onblur="return checkdates(this.id, 8)" />
</td>
<td><input id="form1:bookDate9" type="text" name="form1:bookDate9" value="" onblur="return checkdates(this.id, 9)" />
</td>
<td><input id="form1:bookDate10" type="text" name="form1:bookDate10" value="" onblur="return checkdates(this.id, 10)" />
</td>
</tr>
<tr>
<td><input id="form1:bookDate11" type="text" name="form1:bookDate11" value="" onblur="return checkdates(this.id, 11)" />
</td>
<td><input id="form1:bookDate12" type="text" name="form1:bookDate12" value="" onblur="return checkdates(this.id, 12)" />
</td>
<td><input id="form1:bookDate13" type="text" name="form1:bookDate13" value="" onblur="return checkdates(this.id, 13)" />
</td>
<td><input id="form1:bookDate14" type="text" name="form1:bookDate14" value="" onblur="return checkdates(this.id, 14)" />
</td>
<td><input id="form1:bookDate15" type="text" name="form1:bookDate15" value="" onblur="return checkdates(this.id, 15)" />
</td>
</tr>
<tr>
<td><input id="form1:bookDate16" type="text" name="form1:bookDate16" value="" onblur="return checkdates(this.id, 16)" />
</td>
<td><input id="form1:bookDate17" type="text" name="form1:bookDate17" value="" onblur="return checkdates(this.id, 17)" />
</td>
<td><input id="form1:bookDate18" type="text" name="form1:bookDate18" value="" onblur="return checkdates(this.id, 18)" />
</td>
<td><input id="form1:bookDate19" type="text" name="form1:bookDate19" value="" onblur="return checkdates(this.id, 19)" />
</td>
<td><input id="form1:bookDate20" type="text" name="form1:bookDate20" value="" onblur="return checkdates(this.id, 20)" />
</td>
</tr>
</table>
</div>

<script type="text/javascript">
Calendar.setup(
{
ifFormat : "%a %d %b, %Y",
button : "caltrigger",
weekNumbers : false,
range : [2005, 2010],
dateStatusFunc : sfhsDateStatusFunc,
multiple : MA,
cache : false,
onClose : closed
}
);
</script>


</div>
<div class="specialmargins">
<p>If you have any special requirements please call SFHS on 01313140999 </p>


<p class="bookingbuttonrightalign"><input type="submit" name="form1:_id57" value="Continue" class="bookingbutton" />
</p>
</div><input type="hidden" name="form1" value="form1" /></form>
<div id="copyrightLinks">
<p><a id="about" href="/book2/info/about.jspx">About ScotlandsPeople</a>
&nbsp;&nbsp;|&nbsp;&nbsp;<a id="terms" href="/book2/info/terms.jspx">Terms &amp; Conditions</a>
&nbsp;&nbsp;|&nbsp;&nbsp;<a id="copy" href="/book2/info/copy.jspx">Copyright</a>
&nbsp;&nbsp;|&nbsp;&nbsp;<a id="access" href="/book2/info/access.jspx">Accessibility</a>
&nbsp;&nbsp;|&nbsp;&nbsp;<a id="contact" href="mailto:allan.calder@gro-scotland.gsi.gov.uk">Contact Us</a>
</p>

</div>
</div>


<div id="left_menu">
<ul id="subnav" class="blue_block">
<li><a href="/book2/account/details.jspx">Account Details</a>
</li>
<li><a href="/book2/account/history.jspx">Booking History</a>
</li>
<li><a href="/book2/account/credits.jspx">Buy Credits</a>
</li>
</ul>
<div id="login_div">

<div class="loginandregister">

<div class="loginlink"><a id="login" href="/book2/login.jsf">Login or Register</a>
</div>
<div><a id="ForgottenPassword" href="/book2/forgotpass.jsf">Forgotten Password</a>
</div>
</div>

</div>
<div id="footer">
<p>A partnership between General Register Office for Scotland,
the National Archives of Scotland and the Court of the lord Lyon
</p>
<p id="copyright"><strong>&copy; Crown copyright</strong></p>
</div>
</div>
</div>

</div>
</body>
<script type="text/javascript">
//document.form1.reset();
document.form1.form1:bookDate1.value="";
document.form1.form1:bookdate2.value="";
document.form1.form1:bookDate3.value="";
document.form1.form1:bookDate4.value="";
document.form1.form1:bookDate5.value="";
document.form1.form1:bookate6.value="";
document.form1.form1:bookDate7.value="";
document.form1.form1:bookDate8.value="";
document.form1.form1:bookDate9.value="";
document.form1.form1:bookDate10.value="";
document.form1.form1:bookDate11.value="";
document.form1.form1:bookDate12.value="";
document.form1.form1:bookDate13.value="";
document.form1.form1:bookDate14.value="";
document.form1.form1:bookDate15.value="";
document.form1.form1:bookDate16.value="";
document.form1.form1:bookDate17.value="";
document.form1.form1:bookDate18.value="";
document.form1.form1:bookDate19.value="";
document.form1.form1:bookDate20.value="";
</script>
</html>
bigman85
 
Posts: 3
Joined: Fri Mar 16, 2007 11:20 am
Top
Post a reply

Who is online

Users browsing this forum: No registered users and 10 guests