/    Sign up×
Community /Pin to ProfileBookmark

Textfields and Date help asap

Copy linkTweet thisAlerts:
Jan 05.2007

I’m creating a form, and need to have a bit on it which has a drop down for “No. of pieces”. Each Piece needs a weight and dimension specified, so if 2 pieces are selected, 2 sets of boxes will appear. and so on.

Could someone point me in the right direction as i’m unsure of what to google for!

Also,
I already have one javascript running on my page… will this interfere with it at all?

I tried popping in a script that allows the current Date to be automatically inputted into the form, but it doesn’t seem to work when it’s places in my form.

Any help appreciated. & i finish work at 5:30 so asap if possible ?

to post a comment
JavaScript

5 Comments(s) ↴

Copy linkTweet thisAlerts:
@mjdamatoJan 05.2007 — And the code you have so far is...?

For the textboxes you could either include all the possible checkboxed per the max number in the select field and then hide/unhide as appropriate or you could dynamically create the fields. I would go with the former. Then just run a script onchange of the select field. Assuming the value of the select field is the number of sets of text boxes you need the script would go something like this:

function showText(textNum) {
var i=1;
while (document.formname["box_a_"+i] && document.formname["box_b_"+i]) {
if (i<=textNum) { dispVal = "none"; }
else { dispVal = "inline"; }
document.formname["box_a_"+i].style.display = dispVal;
document.formname["box_b_"+i].style.display = dispVal;
i++;
}

}
Copy linkTweet thisAlerts:
@beckaauthorJan 05.2007 — And the code you have so far is...?

[/QUOTE]

too long to copy & paste into here

thanks for the help ? i'll see what i can come up with
Copy linkTweet thisAlerts:
@mjdamatoJan 05.2007 — too long to copy & paste into here

thanks for the help ? i'll see what i can come up with[/QUOTE]
I meant just the code relating to your problems.
Copy linkTweet thisAlerts:
@beckaauthorJan 05.2007 — How do i go about hiding/showing the weight/dimension boxes then? Based on what number is selected in the Pieces drop down?

Also i'm presuming i will need another script for this, how do i get it to not clash with the existing one?

Sorry you'll have to bare with me, i'm pretty new to all this.

[code=html]
<center><table border="0" width="75%" id="table2">
<tr>
<td><b><font size="2">Origin Airport:</font></b> <font face="Tahoma">
<input type="text" name="T2" size="18" style="border: 1px solid #FF9933"></font><br>
<b><font size="2">Origin Port:&nbsp;&nbsp;&nbsp;&nbsp; </font></b>&nbsp;<font face="Tahoma"><input type="text" name="T2" size="18" style="border: 1px solid #FF9933"></font></td>
<td><b><font size="2">Dest. Country:</font></b> <font face="Tahoma">
<input type="text" name="T2" size="18" style="border: 1px solid #FF9933"></font><br>
<b><font size="2">Dest. Airport:</font></b>&nbsp;
<font face="Tahoma">
<input type="text" name="T2" size="18" style="border: 1px solid #FF9933"></font><br>
<b><font size="2">Dest. Port:</font></b>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<font face="Tahoma">
<input type="text" name="T2" size="18" style="border: 1px solid #FF9933"></font></td>
<td><b><font face="Verdana" size="2">Pieces:</font></b><font face="Verdana">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<select size="1" name="D2" style="border: 1px solid #FF9933">
<option selected>Select...</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select></font><br>
</td>
</tr>
</table><br>
<table border="1" width="75%">
<tr>
<td> <b><font face="Verdana" size="2">Weight:</font></b><font face="Verdana">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br>
<b><font face="Verdana" size="2">Dimensions:</font></b><font face="Verdana">
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br></td>
<td> <b><font face="Verdana" size="2">Weight:</font></b><font face="Verdana">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br>
<b><font face="Verdana" size="2">Dimensions:</font></b><font face="Verdana">
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br></td>
<td> <b><font face="Verdana" size="2">Weight:</font></b><font face="Verdana">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br>
<b><font face="Verdana" size="2">Dimensions:</font></b><font face="Verdana">
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br></td>
<td> <b><font face="Verdana" size="2">Weight:</font></b><font face="Verdana">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br>
<b><font face="Verdana" size="2">Dimensions:</font></b><font face="Verdana">
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br></td>
<td> <b><font face="Verdana" size="2">Weight:</font></b><font face="Verdana">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br>
<b><font face="Verdana" size="2">Dimensions:</font></b><font face="Verdana">
<input type="text" name="T2" size="8" style="border: 1px solid #FF9933"></font><br></td>
</tr>
</table>
[/code]
Copy linkTweet thisAlerts:
@mjdamatoJan 11.2007 — Scripts shouldn't clash unless you make them clash. You *could* have hunders of scripts on the same page if you really wanted to.

Anyway, to show/hide the dimension fields here is one approach:

1) Give each TD for the dimension fields an id. Something like: dim-1, dim-2, etc. You can name them anything you want, but there should be an incrementing value. Also, you should give the following style to the TD's: [b]style="display:none;"[/b]

2) For the "pieces" select field, give each option a value parameter with the "Select..." option having a value of 0 and then going from 1 to 5.

3) In the "pieces" select field, give it an onchange trigger to the function that will be created. Let's say [b]onchange="showDimensions(this.value);"[/b]

4) Create the function:
function showDimensions(dimToShow) {
for (i=1; i&lt;6; i++) {
displayVal = (i &lt;= dimToShow) ? "" : "none";
document.getElementById('dim-'+i).style.display = displayVal;
}
}
×

Success!

Help @becka spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.27,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...