Jump to content

Dynamically populate checkbox through drop down box


dlebowski

Recommended Posts

What I want to do is similar to the code provided except that I want to check certain existing check boxes or uncheck them depending on what the user selects.  The code below will populate text boxes with data based off of a users selection, I want checkboxes to check or uncheck depending on a users selection.  Can someone help me with this?  Thank you!

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script type="text/javascript">

// Format of StoreDetails()
// Name,Addr1,Addr2,Addr3,Phone,FAX,Email,Webpage
var StoreDetails = [
  ['Please select an option','','','','','','','',''],
  ['Store 1','Name 1','Addr 1','Addr 1','Addr 1','Phone 1','FAX 1','Email 1','Webpage 1'],
  ['Store 2','Name 2','Addr 2','Addr 2','Addr 2','Phone 2','FAX 2','Email 2','Webpage 2'],
  ['Store 3','Name 3','Addr 3','Addr 3','Addr 3','Phone 3','FAX 3','Email 3','Webpage 3'],
  ['Store 4','Name 4','Addr 4','Addr 4','Addr 4','Phone 4','FAX 4','Email 4','Webpage 4'],
  ['Store 5','Name 5','Addr 5','Addr 5','Addr 5','Phone 5','FAX 5','Email 5','Webpage 5'] // Note: no comma
];
function Setup(TA) {
  var str = "<select id='Store' onchange='StoreInfo()'>";
  for (var i=0; i<StoreDetails.length; i++) {
    str += '<option value="'+StoreDetails[i].join('|')+'">'+StoreDetails[i][0]+'</option>';
  }
  str +='</select>';
  document.write(str);

}
function StoreInfo() {
  var sel = document.getElementById('Store').selectedIndex;
  var tmp = [];  tmp.push(sel);
  for (var i=1; i<9; i++) { tmp.push(StoreDetails[sel][i]); }
  document.getElementById('txtName').value = tmp[1];
  document.getElementById('txtAddr1').value = tmp[2];
  document.getElementById('txtAddr2').value = tmp[3];
  document.getElementById('txtAddr3').value = tmp[4];
  document.getElementById('txtPhone').value = tmp[5];
  document.getElementById('txtFAX').value = tmp[6];
  document.getElementById('txtEmail').value = tmp[7];
  document.getElementById('txtWebpage').value = tmp[8];
}
</script>
</head>
<body>
<form name="theform" onsubmit="CheckForm()">
<script type="text/javascript">Setup();</script>
<table border="0">
<tr><td>Name:</td><td><input type="text" id="txtName" size="30" value=""></td></tr>
<tr><td>Address 1:</td><td><input type="text" id="txtAddr1" size="30" value=""></td></tr>
<tr><td>Address 2:</td><td><input type="text" id="txtAddr2" size="30" value=""></td></tr>
<tr><td>Address 3:</td><td><input type="text" id="txtAddr3" size="30" value=""></td></tr>
<tr><td>Phone:</td><td><input type="text" id="txtPhone" size="30" value=""></td></tr>
<tr><td>FAX:</td><td><input type="text" id="txtFAX" size="30" value=""></td></tr>
<tr><td>Email:</td><td><input type="text" id="txtEmail" size="30" value=""></td></tr>
<tr><td>Webpage:</td><td><input type="text" id="txtWebpage" size="30" value=""></td></tr>
</table>
</form>
</body>
</html>

I can't see what you are struggling with.  If it is the way you check checkboxes then a simple google (javascript check checkboxes) will tell you.

 

My real puzzle though is why you need the checkboxes at all.  Can't you just use the value of the dropdown when the form is submitted?

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.