onselect diaplay checkbox

joycecsy
joycecsy used Ask the Experts™
on
how can I disply a group of checkboxes based on the value selected from a drop down menu?

the dropdown menu and checkbox are calling values from the database.
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

Commented:
Try this:

<html>
<script language="javascript">
  function displayCB()
  {
    switch (document.all.dropdown.selectedIndex) {
      case 1:
        document.all.area.innerHTML = "<input type=\"checkbox\" name=\"cb1\">Checkbox 1";
        break;
      case 2:
        document.all.area.innerHTML = "<input type=\"checkbox\" name=\"cb1\">Checkbox 2";
        break;
    }
  }
</script>
<body>
  <select name="dropdown" onchange="displayCB();">
    <option value="0">-select-</option>
    <option value="1">1</option>
    <option value="2">2</option>
  </select>
  <div id="area">
  </div>
</body>
</html>
Here's a slight modification to Majzes answer to get it working in Mozilla as well as IE.

<html>
<script language="javascript">
 function displayCB()
 {
   switch (document.getElementById('dropdown').selectedIndex) {
     case 1:
       document.getElementById('area').innerHTML = "<input type=\"checkbox\" name=\"cb1\">Checkbox 1";
       break;
     case 2:
       document.getElementById('area').innerHTML = "<input type=\"checkbox\" name=\"cb1\">Checkbox 2";
       break;
   }
 }
</script>
<body>
 <select id="dropdown" name="dropdown" onchange="displayCB();">
   <option value="0">-select-</option>
   <option value="1">1</option>
   <option value="2">2</option>
 </select>
 <div id="area">
 </div>
</body>
</html>

Commented:
I think you want something like this...


<html>
<head>

<script language="javascript">
function displayCB(val)
{
for(i=0;i<val;i++)
{
document.getElementById('area').innerHTML = "<input type=\"checkbox\" name=\"cb"+i+"\">Checkbox"+i;
  }
}
</script>

</head>
<body>
<select id="dropdown" name="dropdown" onchange="displayCB(this.value);">
  <option value="0">-select-</option>
  <option value="1">1</option>
  <option value="2">2</option>
</select>
<div id="area">
</div>
</body>
</html>

Ensure you’re charging the right price for your IT

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Author

Commented:
nope it's exactly what I wanted

the select and checkbox part is actually calling from a database and that make it the tough part.

the code goes like this

<SELECT NAME="usrtype" class="select">
<OPTION NAME="">Select User Type</OPTION>
<% Do While not Rs2.EOF %>
<OPTION value="<%=trim(RS2("usraccid"))%>"
<%if trim(Rs2("usraccid"))=trim(Rs("usrtype")) then%>
Selected<%end if%>>
<%=trim(Rs2("usracctype"))%>
<%
   Rs2.MoveNext
   Loop              
   Rs2.Close
%>
</SELECT>

<TABLE WIDTH="200" BORDER="0" CELLSPACING="0" CELLPADDING="0">    
<%
Dim aSelected
aSelected = split(Rs("usrfunctacc"),",")
Do While not Rs3.EOF %>
<TR>
<TD WIDTH="20" ALIGN="left">
<INPUT TYPE="checkbox" NAME="functacc" ID="functacc" VALUE="<%=trim(RS3("functid"))%>"
<%
 For n=0 to UBound(aSelected)
 if trim(Rs3("functid")) = trim(aSelected(n)) then
%>Checked<%
 end if
 Next
%>>
</TD>
<TD WIDTH="180" ALIGN="left"><FONT CLASS="txt">
<%=trim(RS3("function"))%></FONT></TD>
</TR>
<%
Rs3.MoveNext
Loop              
Rs3.Close
%>
</TABLE>


Thanks.

Commented:
so, no points for no one?

Author

Commented:
i dun think i should give points to anyone when my questions has not been answered, rite?

Author

Commented:
sorry typo,
what i mean is it's not exactly what i wanted coz it doesn't solved the issues sinces it calling from database.

Commented:
As far as I see it, the above solutions do exactly what you're looking for. All you have to do is substitute hardcoded values for values you get from database.

Author

Commented:
it didnn't work as i come to the part of displaying the checkboxes..

perharps you didn't understand my question.
when the form is first loaded, all the checkboxes options are displayed.

but once i've selected the usertype, it is to display only those that belongs to the selected usertype.

Commented:
Let me see if I understand your question:
When the page is loaded, all checkboxes should be displayed. If user selects an option, only certain checkboxes should be displayed.
If this is so, then here's you answer.

<html>
<script language="javascript">
function displayCB(val)
{
  document.getElementById('area').innerHTML = "";
  switch (document.getElementById('dropdown').selectedIndex) {
    case 0:
    case 1:
      document.getElementById('area').innerHTML += "<input type=\"checkbox\" name=\"cb1a\">Checkbox 1a<br>";
      document.getElementById('area').innerHTML += "<input type=\"checkbox\" name=\"cb1b\">Checkbox 1b<br>";
      if (val != 0)
        break;
    case 2:
      document.getElementById('area').innerHTML += "<input type=\"checkbox\" name=\"cb2a\">Checkbox 2a<br>";
      document.getElementById('area').innerHTML += "<input type=\"checkbox\" name=\"cb2b\">Checkbox 2b<br>";
      document.getElementById('area').innerHTML += "<input type=\"checkbox\" name=\"cb2c\">Checkbox 2c";
      if (val != 0)
        break;
  }
}
</script>
<body onload="displayCB(0);">
<select id="dropdown" name="dropdown" onchange="displayCB(this.value);">
  <option value="0">-select-</option>
  <option value="1">1</option>
  <option value="2">2</option>
</select>
<div id="area">
</div>
</body>
</html>

Author

Commented:
i've solved the problem. thanks anyway.

Commented:
Dear expert(s),

A request has been made to close this Q in CS:
http://www.experts-exchange.com/Community_Support/CleanUp/Q_20424914.html

Without a response in 72 hrs, a moderator will finalize this question by:

 - Saving this Q as a PAQ and refunding the points to the questionner

When you agree or disagree, please add a comment here.

Thank you.

modulo

Community Support Moderator
Experts Exchange
Commented:
Saving this Q as a PAQ and refunding the points to the questionner

modulo

Community Support Moderator
Experts Exchange

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial