Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 195
  • Last Modified:

Select Field Determines Other Fields

I need a web form that has variable input fields based on a "Select" option.  I imagine that JavaScript is ideal.  I am out of practice on web development skills, and JavaScript was a weak spot.

The Select will have several options:
      Dispense
      Receive
      Return
      Reconcile
When you select "Dispense" I need text fields named:
      Name
      Center
      Number
If you chose "Receiving" text fields appear named:
      Vendor
      Form #
      Invoice #
In the perfect situation each text field is uniquely named verses using the same text fields with different labels.  Some options may need 4 text fields, and another may need 1 field.
In the SQL database I'd have columns named:
   DispName, DispCenter, DispNumber, RecVendor, RecForm, RecInvoice, etc.

I know I've had this in the past, but all my web development code has been lost over time.  I am awarding 500 pts, as this little issue is holding up a database project, and I don't have time to buy a book and learn JavaScript.
0
antcal
Asked:
antcal
  • 3
1 Solution
 
P_RamprathapCommented:
Please try this approach
1. Please have all the controls in the page , please enlose the control and their respective validation control inside a seprate panel
2. on Page load call the function LoadControls ( can be any name of ur choice)
3. based on the Select option you can hide the panel and controls ,. please make sure ur disabling the respective validation controls
4. on Form submition , please pass on relevenat values , and pass default values for hidden controls .
Let me know if you have any queries
 
Thanks
Ram
0
 
antcalAuthor Commented:
Thanks for the tip, I should have a chance to try and implement the suggestion later today.  I'll update you then.
0
 
antcalAuthor Commented:
I am still not 100% with this task.  Here is the sample code I have been playing with.  This code gives me 1,2,3, or 4 Text boxes.  It is close to what I need, however, I want unique sections.

I have included my working code snippet, and it has a desired output section below the working example.  I hope this is enough to help me wrap this up.
<html>
<head>
<script type="text/javascript">
     function showFields(num){
          container = document.getElementById('fields')
          container.innerHTML = ''
 
          for(i = 0; i < parseFloat(num); i ++){
               container.innerHTML += '<input type="text" /><br />'
               }
          }
</script>
</head>
 
<body>
<select onChange="showFields(this.options[this.selectedIndex].value)">
     <option value="0">Choose One:</option>
     <option value="1">Dispensed</option>
     <option value="2">Recieved</option>
     <option value="3">Return to Stock</option>
     <option value="4">REKO</option>
</select>
<br />
<div id="fields"></div>
<br><br><br>
<p><b>Desired Output for option DISPENSED, Recived (and other choices) would have a similar but diffrent output</b><br>
<input name="DispName" type="text" onFocus="value=''" value="Enter Name Here" size="30" maxlength="30"><br />
<input name="DispCenter" type="text" onFocus="value=''" value="Enter Center Here" size="30" maxlength="30"><br>
<input name="DispNumber" type="text" onFocus="value=''" value="Enter Number Here" size="30" maxlength="30"><br>
</body>
</html>

Open in new window

0
 
antcalAuthor Commented:
Good direction for a skilled developer.  Due to my lack of skill in web development, I still had to find my own solution.  My solution used a java script to reveal a section of the web page using "tbody" tag.
0

Featured Post

Free Tool: Port Scanner

Check which ports are open to the outside world. Helps make sure that your firewall rules are working as intended.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now