Results 1 to 4 of 4

Thread: Add a dynamic text field??

  1. #1
    Join Date
    Jun 2014

    Add a dynamic text field??

    Hey I was wondering if someone can clue me in on what I'm trying to do.
    I have a select box in html that looks like this:
    <select id="selectBox" onchange="changeFunc();">
    		<option value = "0">Other</option>
    		<option selected = "1">GSD AMS</option>
    		<option value = "2">GSD APJ</option>
    		<option value = "3">GSD EMEA</option>
    		<option value = "4">GSD Customer Solution Center</option>
    		<option value = "5">GSD Supply Chain</option>
    		<option value = "6">Delivery Readiness</option>
    		<option value = "7">Business Process, Customer Experience and Quality</option>
    		<option value = "8">Business Operations</option>
    		<option value = "9">GSD Engineering Resolution</option>
    		<option value = "10">GSD Escalation Management</option>
    and it calls a Javascript like this:
    <script type="text/javascript">
    	function changeFunc() {
    	var selectBox = document.getElementById("selectBox");
    	var selectedValue = selectBox.options[selectBox.selectedIndex].value;
    	if(selectedValue < 1)
                      what I'm trying do is when the selectedValue = 0 
                      then add a dynamic text field to all me to type in 'other' on my html.
                      I'm very new at javascript and any help that could be given would be appreciated!
    Last edited by jedaisoul; 06-06-2014 at 04:24 AM. Reason: code tags added

  2. #2
    Join Date
    Dec 2005


    Slight modification...
    <!DOCTYPE html>
    <html lang="en">
    <meta charset="UTF-8" />
    <title> HTML5 page </title>
    <style type="text/css">
     #otherValue { color:#ffffff; background-color:#ff0000; }
    <select id="selectBox" onchange="changeFunc(this.value)">
     <option value="0">Select</option>
     <option value="1">GSD AMS</option>
     <option value="2">GSD APJ</option>
     <option value="3">GSD EMEA</option>
     <option value="4">GSD Customer Solution Center</option>
     <option value="5">GSD Supply Chain</option>
     <option value="6">Delivery Readiness</option>
     <option value="7">Business Process, Customer Experience and Quality</option>
     <option value="8">Business Operations</option>
     <option value="9">GSD Engineering Resolution</option>
     <option value="10">GSD Escalation Management</option>
     <option value="11">Other</option>
    <span id="otherValue" style="display:none"> Other: <input type="text" id="other" value=""> </span>
    <script type="text/javascript">
    function changeFunc(info) {
      if (info == '11') { document.getElementById('otherValue').style.display = ''; }
                   else { document.getElementById('otherValue').style.display = 'none'; }
    BTW, you should put [ code] and [ /code] tags (without the spaces) around your script
    to make it easier for others to see, copy, debug, etc. It also retains the formatting of your code.

  3. #3
    Join Date
    Jun 2014
    Thank you very much JMRKER, that was exactly what I was looking for!! And the advice is appreciated also.

  4. #4
    Join Date
    Dec 2005
    You're most welcome.
    Happy to help.
    Good Luck!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
HTML5 Development Center

Recent Articles