Member Avatar for tonyledenko

Hello, I would like to pass the values of multiple check boxes in a string, separated by a "^".

For example: RAM-VB-162^RAM-VB-154^RAM-VB-133

When the page is submitted only the last value is passed to the next page: Here is the url

http://www.ram-mount.com/wizards/test5.htm

<script language="javascript" type="text/javascript">
function compilePartsList(form){
  var i = 0;
  var end = form.elements.part.length;
  var partsList = "";
  while (i < end) {
    if(form.elements.part[i].checked){
      if (i>0) {
        partsList += "^";
      }
      partsList += form.elements.part[i].value;
    }
    i++;
  }
  form.elements.partsList.value = partsList;
}
</script>
</head>

<body>


<form name="CartItem" action="https://www.ram-mount.com/RamCart/CartPutItem.php" method="POST" onsubmit="compilePartsList(this);">  
<input type="checkbox" name="part" value="RAM-VB-162">   
<input type="checkbox" name="part" value="RAM-VB-154">  
<input type="checkbox" name="part" value="RAM-VB-133"> 
<input type="hidden" name="partsList" id="partsList"> 
<input type="submit" name="partsList" value="submit">
</form>

Thanks in advance

  • 3 Contributors
  • 2 Replies
  • 109 Views
  • 21 Hours Discussion Span
  • Latest Post Latest Post by essential
Member Avatar for Atli

Hi.

Try changing the name of the submit button.

The hidden field and the submit button have the same name, and because the button is later in the markup, it will probably override the hidden field when the form is submitted.

Member Avatar for essential

Sorry to keep you waitin! Here's the code and hope my sample wil brighten you up!
Enjoy coding...

<html>
<head>
<title>Some title</title>
<script type="text/javascript">
<!-- BEGIN HIDING
var s = "";

document.onclick =  compilePartsList; 
function compilePartsList(form, e )
{ e = e ? e : window.event;
var thisPart = e.target ? e.target : e.srcElement;
 
if (( thisPart.name ) && ( thisPart.name == 'part' ) && ( thisPart.checked ))
{
 
var pItem = document.getElementById('partsList');

//I make this visible so you can check if it is working!
pItem.value += s + thisPart.value;


if ( pItem.value.length > 27 ) {
for ( var i = 0; i <= 2; i++ ) { CartItem.part[i].checked = false; 
  } 
}
if ( pItem.value.length > 38 ) { s = ''; pItem.value = ''; 
return false;  
}

s = pItem.value.length >= 9 ? '^' : s;
 
document.getElementById('tester').innerHTML = thisPart.value;
 } 
} 
// DONE HIDING -->
</script>
</head>
<body> 
<form name="CartItem" action="#" method="post" onsubmit="return compilePartsList(this.form);">
<label>
<input type="checkbox" name="part" value="RAM-VB-162" />&nbsp;RAM-VB-162</label><br />
<label>
<input type="checkbox" name="part" value="RAM-VB-154" />&nbsp;RAM-VB-154;</label><br />
<label>
<input type="checkbox" name="part" value="RAM-VB-133" />&nbsp;RAM-VB-133</label><br />
<!-- Just to check if the hidden input received the last value of checked box! -->
<!-- You can remove this part-->
<p>
<font color="#000088"><nobr>This is last item selected from the list!</nobr>
</font>
<span id="tester">
</span></p>
<!-- End of the line -->
<nobr><input type="text" name="partsList" id="partsList" size="35" />
<input type="submit" name="partsList" value="submit" /></nobr>
</form>
</body>
</html>
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.