Client-Side dynamically replacing form element

aztarac · Feb 22, 2007

I wonder wether it is possible to dynamically change an element.
I'm using client-side VBS, an example is that I have a checkbox in a cell of a table. I want to be able to change this to a drop down list?
I want to let the user click checkbox when only 1 of an option is the only quantity allowed but then replace the checkbox with a numeric dropdown list when the user can choose a quantity which can be more than 1.

Any help appreciated

ChrisHirst · Feb 22, 2007

client side VBScript forum329

I want to let the user click checkbox when only 1 of an option

Only in Internet Explorer if you use VBScript

Chris.

Indifference will be the downfall of mankind, but who cares?
Woo Hoo! the cobblers kids get new shoes.
People Counting Systems

So long, and thanks for all the fish.

mbiro · Feb 22, 2007

Put both form elements on your form. Then use VBS to make the needed one visible and the other not visible, based on your criteria.

mbiro · Feb 22, 2007

Only in Internet Explorer if you use VBScript

True, I would use javascript. I don't think that vbs is even on by default in IE... or at least it used to not be...

aztarac · Feb 22, 2007

Thanks for the tip.
I know IE is the only browser this will work on....I'm a VB6 man learning VBS/ASP, I dont want to learn JS....but doesn't most people have IE installed even if it isnt their default browser?

Tarwn · Feb 23, 2007

I have IE6 installed, but I don't use it. There are a whole lot of Mac + Linux people that probably don't use it as well.

Using Javascript to hide or show elements is not difficult and using Javascript in general for your client-side scripting is better because you don't restrict your users' browser choice.

In this case you want to define a function you can call that will switch the checkbox to a dropdown, and vice versa. Then inside that function define the show/hide code. Something like:

Code:

<html>
<head>
   <script language="javascript">
   //-- Define the function
   function showChoices(numChoices){
      //-- which one to show?
      if(numChoices > 1){
         // Show the dropdown, hide the checkbox
         document.getElementById("MyDropdown").style.display = "inline";
         document.getElementById("MyCheckbox").style.display = "none";
      }
      else{
         // hid the dropdown, show the checkbox
         document.getElementById("MyDropdown").style.display = "none";
         document.getElementById("MyCheckbox").style.display = "inline";
      }
   }
   </script>
</head>
<body>
<input type="button" onClick="showChoices(1);" value="1 Choice"/>
<input type="button" onClick="showChoices(5);" value="5 Choices"/><br/>
How Many? 
   <input type="checkbox" value="1" id="MyCheckbox" name="choice_one" />
   <select id="MyDropdown" name="choice_many" style="display: none;">
      <option value="0"> None </option>
      <option value="1"> One </option>
      <option value="2"> Two </option>
      <option value="3"> Three </option>
      <option value="4"> Four </option>
      <option value="5"> Five </option>
   </select>
</body>
</html>

Basically what this code is doing is using a function to show and hide the pair of elements. To hide or show them it is using the CSS attribute "display" and switching this between inline and none. The dropdown's style is initially set to "display: none;" and then the javascript function alters that setting based on the number passed to the function.

I realize you were looking for a VBScript solution, but I would highly suggest you brench out a little bit and do your client-side scripting in Javascript. There is a javascript forum that can be helpful as well as tons of resources online.

-T

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!

Client-Side dynamically replacing form element

aztarac

Programmer

ChrisHirst

IS-IT--Management

mbiro

Programmer

mbiro

Programmer

aztarac

Programmer

Tarwn

Programmer

Similar threads

Part and Inventory Search

Sponsor