Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Set all of select and/or text boxes to the same value?? 3

Status
Not open for further replies.
kuolung

kuolung

Programmer
Sep 2, 1999
51
US
Does anyone have the script that can set all select boxes or text to the same value? I need to set up for something looks like the screen design below:

absolutevv3.jpg


Thanks so much in advance!!! Your help/hint would be greatly appreciated!!!
 
Sort by date Sort by votes
Hi

As you have multiple sets of [tt]select[/tt] controls, it would be better to not let us guess how the elements of logical groups can be recognized. It could be done be just counting even/odd [tt]select[/tt]s, but that is stupid and not flexible. Post your actual HTML code.

Feherke.
 
Upvote 0 Downvote
This can be done pretty easily if you make all respective boxes the same name as each other.

Example, all textboxes under "Quantity" be given the name "quantityText".

Give your "All" inputs ids, say like id = "quantityAll"

Also, encapsulate all your input boxes UNDER the headings inside a div and give it an id = "contentDiv".

Your code would look something like this:

Code: 
var quantityAllValue = document.getElementById("quantityAll").value;
var inputArray = document.getElementById("contentDiv").getElementsByTagName("input");
var inputArrayLength = inputArray.length;
for (a = 0 a < inputArrayLength; a++) {
   if (inputArray[a].name == "quantityText") {
      inputArray[a].value = quantityAllValue;   
   }
   //Repeat If statement for Unit of Measure
   //Repeat If statement for Disposition
}

Put that code above in a function that get called on the click of the anchors that say "All".





[monkey][snake] <.
 
Upvote 0 Downvote
Since Unit of Measure and Disposition are in dropdown boxes, you would create a similar function like I posted above, but loop with a getElementsByTagName("select").

[monkey][snake] <.
 
Upvote 0 Downvote
here is my html code, and also I'm testing out monksnake's suggestion..

Code: 
<table cellpadding="0" cellspacing="0" border="0" style="width: 700px; position: relative; float: left;" class="topBorder">
	<tr>
		<td class="pad2px" width="200">Set all of the below to:</td>
		<td class="pad2px" width="80"><input type="text" name="keySHIPMENT_QUANTITY" value="" size="3"></td>
		<td class="pad2px" width="140"><select name="keyUNIT_MEASURE_ID">
		<option value="">-- select --</option>
		
		<option value="1">Specimens</option>
		
		<option value="2">Kilograms</option>
		
		<option value="3">ac/ft</option>
		
		<option value="4">Lbs</option>
		
		</select></td>
		<td class="pad2px" width="200"><select name="keySHIPMENT_DISPOSITION_ID">
		<option value="">-- select --</option>
		
		<option value="1">Package Released, Carrier Notified</option>
		
		<option value="3">Pending Inspection</option>
		
		</select></td>
		<td class="pad2px" width="40"></td>
	</tr>
	<tr class="columnHeaderBG">
		<td class="pad2px" width="200"><span class="columnHeaderFont">Article Name</span></td>
		<td class="pad2px" width="80"><span class="columnHeaderFont">Quantity</span></td>
		<td class="pad2px" width="140"><span class="columnHeaderFont">Unit of Measures</span></td>
		<td class="pad2px" width="200"><span class="columnHeaderFont">Disposition</span></td>
		<td class="pad2px" width="40"></td>
	</tr>
	
	
	<tr>
		<td class="pad2px" valign="top">Artichoke Aegean ringspot virus</td>
		<td class="pad2px" valign="top"><input type="text" name="SHIPMENT_QUANTITY1" value="" size="3"></td>
		<td class="pad2px" valign="top"><select name="UNIT_MEASURE_ID1">
		<option value="" selected>-- select --</option>
		
		<option value="1">Specimens</option>
		
		<option value="2">Kilograms</option>
		
		<option value="3">ac/ft</option>
		
		<option value="4">Lbs</option>
		
		</select></td>
		<td class="pad2px" valign="top"><select name="SHIPMENT_DISPOSITION_ID1">
		<option value="" selected>-- select --</option>
		
		<option value="1">Package Released, Carrier Notified</option>
		
		<option value="3">Pending Inspection</option>
		
		</select><br /></td>
	</tr>
	
	<tr class="rowDivider"><td colspan="5"></td></tr>
	
	
	
	<tr>
		<td class="pad2px" valign="top">Artichoke mottled crinkle virus</td>
		<td class="pad2px" valign="top"><input type="text" name="SHIPMENT_QUANTITY2" value="" size="3"></td>
		<td class="pad2px" valign="top"><select name="UNIT_MEASURE_ID2">
		<option value="" selected>-- select --</option>
		
		<option value="1">Specimens</option>
		
		<option value="2">Kilograms</option>
		
		<option value="3">ac/ft</option>
		
		<option value="4">Lbs</option>
		
		</select></td>
		<td class="pad2px" valign="top"><select name="SHIPMENT_DISPOSITION_ID2">
		<option value="" selected>-- select --</option>
		
		<option value="1">Package Released, Carrier Notified</option>
		
		<option value="3">Pending Inspection</option>
		
		</select><br /></td>
	</tr>
	
	<tr class="rowDivider"><td colspan="5"></td></tr>
	
	
	
	<tr>
		<td class="pad2px" valign="top">Duckweed</td>
		<td class="pad2px" valign="top"><input type="text" name="SHIPMENT_QUANTITY3" value="" size="3"></td>
		<td class="pad2px" valign="top"><select name="UNIT_MEASURE_ID3">
		<option value="" selected>-- select --</option>
		
		<option value="1">Specimens</option>
		
		<option value="2">Kilograms</option>
		
		<option value="3">ac/ft</option>
		
		<option value="4">Lbs</option>
		
		</select></td>
		<td class="pad2px" valign="top"><select name="SHIPMENT_DISPOSITION_ID3">
		<option value="" selected>-- select --</option>
		
		<option value="1">Package Released, Carrier Notified</option>
		
		<option value="3">Pending Inspection</option>
		
		</select><br /></td>
	</tr>
	
	
	</table>
 
Upvote 0 Downvote
it doesn't work, and I get no javascript error? something is missing? please help!


Code: 
<script>
function setAllValues() {
var quantityAllValue = document.getElementById("keySHIPMENT_QUANTITY").value;
var inputArray = document.getElementById("contentDiv").getElementsByTagName("input");
var inputArrayLength = inputArray.length;
for (a = 0; a < inputArrayLength; a++) {
   if (inputArray[a].name == "SHIPMENT_QUANTITY") {
      inputArray[a].value = quantityAllValue;
   }
}
}
</script>

<table cellpadding="0" cellspacing="0" border="0" style="width: 700px; position: relative; float: left;" class="topBorder">
	<tr>
		<td class="pad2px" width="200">Set all of the below to:</td>
		<td class="pad2px" width="80"><input type="text" name="keySHIPMENT_QUANTITY" value="" size="3" id="keySHIPMENT_QUANTITY"><a href="#" onclick="setAllValues();" id="keySHIPMENT_QUANTITY">All</a></td>
		<td class="pad2px" width="140"><select name="keyUNIT_MEASURE_ID">
		<option value="">-- select --</option>

		<option value="1">Specimens</option>

		<option value="2">Kilograms</option>

		<option value="3">ac/ft</option>

		<option value="4">Lbs</option>

		</select></td>
		<td class="pad2px" width="200"><select name="keySHIPMENT_DISPOSITION_ID">
		<option value="">-- select --</option>

		<option value="1">Package Released, Carrier Notified</option>

		<option value="3">Pending Inspection</option>

		</select></td>
		<td class="pad2px" width="40"></td>
	</tr>
	<tr class="columnHeaderBG">
		<td class="pad2px" width="200"><span class="columnHeaderFont">Article Name</span></td>
		<td class="pad2px" width="80"><span class="columnHeaderFont">Quantity</span></td>
		<td class="pad2px" width="140"><span class="columnHeaderFont">Unit of Measures</span></td>
		<td class="pad2px" width="200"><span class="columnHeaderFont">Disposition</span></td>
		<td class="pad2px" width="40"></td>
	</tr>

	<div id = "contentDiv">
	<tr>
		<td class="pad2px" valign="top">Artichoke Aegean ringspot virus</td>
		<td class="pad2px" valign="top"><input type="text" name="SHIPMENT_QUANTITY" value="" size="3"></td>
		<td class="pad2px" valign="top"><select name="UNIT_MEASURE_ID1">
		<option value="" selected>-- select --</option>

		<option value="1">Specimens</option>

		<option value="2">Kilograms</option>

		<option value="3">ac/ft</option>

		<option value="4">Lbs</option>

		</select></td>
		<td class="pad2px" valign="top"><select name="SHIPMENT_DISPOSITION_ID1">
		<option value="" selected>-- select --</option>

		<option value="1">Package Released, Carrier Notified</option>

		<option value="3">Pending Inspection</option>

		</select><br /></td>
	</tr>
	</div>
	<tr class="rowDivider"><td colspan="5"></td></tr>



	<tr>
		<td class="pad2px" valign="top">Artichoke mottled crinkle virus</td>
		<td class="pad2px" valign="top"><input type="text" name="SHIPMENT_QUANTITY" value="" size="3"></td>
		<td class="pad2px" valign="top"><select name="UNIT_MEASURE_ID2">
		<option value="" selected>-- select --</option>

		<option value="1">Specimens</option>

		<option value="2">Kilograms</option>

		<option value="3">ac/ft</option>

		<option value="4">Lbs</option>

		</select></td>
		<td class="pad2px" valign="top"><select name="SHIPMENT_DISPOSITION_ID2">
		<option value="" selected>-- select --</option>

		<option value="1">Package Released, Carrier Notified</option>

		<option value="3">Pending Inspection</option>

		</select><br /></td>
	</tr>

	<tr class="rowDivider"><td colspan="5"></td></tr>



	<tr>
		<td class="pad2px" valign="top">Duckweed</td>
		<td class="pad2px" valign="top"><input type="text" name="SHIPMENT_QUANTITY" value="" size="3"></td>
		<td class="pad2px" valign="top"><select name="UNIT_MEASURE_ID3">
		<option value="" selected>-- select --</option>

		<option value="1">Specimens</option>

		<option value="2">Kilograms</option>

		<option value="3">ac/ft</option>

		<option value="4">Lbs</option>

		</select></td>
		<td class="pad2px" valign="top"><select name="SHIPMENT_DISPOSITION_ID3">
		<option value="" selected>-- select --</option>

		<option value="1">Package Released, Carrier Notified</option>

		<option value="3">Pending Inspection</option>

		</select><br /></td>
	</tr>


	</table>


 
Upvote 0 Downvote
Hi

My way, using your naming convention :
Code: 
function all(what)
{
  el=document.fo.elements[what];
  for (i=0;i<document.fo.elements.length;i++) {
    if (document.fo.elements[i].type!=el.type) continue;
    if (document.fo.elements[i].name.indexOf(el.name.substr(3))!=0) continue;
    switch (el.type) {
      case 'text': document.fo.elements[i].value=el.value; break;
      case 'select-one': document.fo.elements[i].selectedIndex=el.selectedIndex; break;
    }
  }
}
And call it like this :
Code: 
        <td class="pad2px" width="80"><input type="text" name="keySHIPMENT_QUANTITY" value="" size="3">[red]<a href="#" onclick="all('keySHIPMENT_QUANTITY');return false">all</a>[/red]</td>

Feherke.
 
Upvote 0 Downvote
thank you so much feherke !!! your codes work so well for my problem. you saved my day !!!

Again, much appreciated your help!! kudos to both feherke and monksnake!!!



 
Upvote 0 Downvote
Hi

Well done sakura, you figured out that I gave the name "fo" to the [tt]form[/tt] containing all that stuff... I should remember to mention such "minor" details next times... or I should just change to the current standard [tt]getElement***[/tt]...

Feherke.
 
Upvote 0 Downvote
As a side note, try not to use a reference to .length when looping through arrays that contain objects.
Code: 
el=document.fo.elements[what];
for (i=0;i<document.fo.elements.length;i++) {
You will find your code will run MUCH faster if you assign a variable to the length then loop with it.
Code: 
el=document.fo.elements[what];
var elementArrayLength = el.length
for (i=0;i<elementArrayLength;i++) {






[monkey][snake] <.
 
Upvote 0 Downvote
Thank you both feherke & monksnake for giving me more helpful information, i'm still working on the codes to make it optimal for my problem.

Thank you so much!!!
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

jomat
  • Locked
  • Question
JS to show the timer in html under title instead of in the status bar
Replies
2
Views
330
xwb
xwb
malpa
  • Locked
  • Question
Graph the selection of a html table row
Replies
0
Views
299
malpa
malpa
coldbohemia
  • Locked
  • Question
jquery function always returns contents of the same table cell, no matter which table cell i click
Replies
0
Views
267
coldbohemia
coldbohemia
Mike Lewis
  • Locked
  • Question
Anyone here got any experience of Grid.JS (a sortable Javascript grid) 1
Replies
5
Views
682
Mike Lewis
Mike Lewis
Kennelbloke
  • Locked
  • Question
Can't Get Markers to show on Map
Replies
0
Views
357
Kennelbloke
Kennelbloke

Part and Inventory Search

Sponsor

Back
Top