Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    Regular Coder
    Join Date
    Sep 2007
    Posts
    238
    Thanks
    9
    Thanked 0 Times in 0 Posts

    Date of Birth Drop-downs into 1 field

    I have a date of birth drop down for 'Day', 'Month' and a text field for Year.

    How can I get the select value of the drop down and year text field into a single text field, separated by '-'?

    The single text field would need to update if someone changed the drop down / year selections.

    Hope someone can help - I'm stumped!

  • #2
    New Coder
    Join Date
    Aug 2009
    Posts
    94
    Thanks
    0
    Thanked 16 Times in 16 Posts
    Hope this code will help you

    Code:
    <html>
    <head>
    
    <script>
    function updateDate(){
       
       var date = document.getElementById("date").value;
       var month = document.getElementById("month").value;
       var year = document.getElementById("year").value;
    
       if(year == ""){
    		alert("Enter Year");
    		return
       }
    
       if(isNaN(year)){
    		alert("Year should be numeric");
    		return
       }
    	
       if(year.length != 4){
    		alert("Enter valid Year");
    		return
       }
    
      document.getElementById("result").value = date + "-" + month + "-" + year;
    
    }
    
    </script>
    
    
    </head>
    
    <body>
    
    Date: <select id = "date">
    <option value = "01">01</option>
    <option value = "02">02</option>
    <option value = "03">03</option>
    <option value = "04">04</option>
    <option value = "05">05</option>
    <option value = "06">06</option>
    <option value = "07">07</option>
    <option value = "08">08</option>
    <option value = "09">09</option>
    <option value = "10">10</option>
    </select>
    
    &nbsp;&nbsp;
    
    Month: <select id = "month">
    <option value = "Jan">Jan</option>
    <option value = "Feb">Feb</option>
    <option value = "Mar">Mar</option>
    <option value = "Apr">Apr</option>
    <option value = "May">May</option>
    <option value = "Jun">Jun</option>
    <option value = "Jul">Jul</option>
    <option value = "Aug">Aug</option>
    <option value = "Sep">Sep</option>
    <option value = "Oct">Oct</option>
    <option value = "Nov">Nov</option>
    <option value = "Dec">Dec</option>
    </select>
    
    &nbsp;&nbsp;
    
    Year <input type = "text" id = "year" value = "2010" />
    
    
    &nbsp;&nbsp;
    
     <input type = "button" onClick = "updateDate()" value = "Update" />
    
    &nbsp;&nbsp;&nbsp;&nbsp;
    <input type = "text" id = "result" />
    
    </body>
    </html>

  • #3
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,211
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    I *might* mildly disagree with Jolly.

    If you are going to send your <form> fields to some server code for processing, and you want the server code to be able to read those "raw" dropdown (and text field, for year) values, then you need to give them names!! Fields without names are not sent on to the server.

    In which case, instead of using document.getElementById("xxx").value to get those form field values, you would be better off using document.formname.fieldname.value

    HOWEVER... If you do *not* want the fields to be sent to the server--if you only want the "results" field to be sent to the server--then Jolly's answer is exactly correct: Only give the fields IDs (no names) and they won't be sent.

    This also points out the fact that *NONE* of those field's in Jolly's <form> will be sent to the server. I would think that at a minimum he should have done
    Code:
    <form name="whatever" ...>
    ...
    <input type="text" id="result" name="result" />
    </form>
    The lack of a <form> would also prevent the info from being sent to the server, of course.

    And then I would argue that, in that case, Jolly should have used document.whatever.result.value to put the result in place (just to make sure the "result" field *has* a name, so it will be sent to the server). I dislike giving fields both names and ids unless there is a pretty good reason. (Typically, the only reason is so that they can be the target of a <label for="someid"> ... but of course creating fields that won't be sent to the server is another reason.)
    Last edited by Old Pedant; 08-26-2010 at 07:59 PM.
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #4
    New Coder
    Join Date
    Aug 2009
    Posts
    94
    Thanks
    0
    Thanked 16 Times in 16 Posts
    I answered to the question asked by htcilt. If he would have also asked as how do I send the value to the server, I would have definitely added a form tag and attribute name to the result field.

  • #5
    Supreme Master coder! Old Pedant's Avatar
    Join Date
    Feb 2009
    Posts
    25,211
    Thanks
    75
    Thanked 4,343 Times in 4,309 Posts
    LOL! Well, that's why my handle is "Old Pedant".

    (You'll notice I said I *might* disagree with you...and only mildly at that. Depends on his ultimate aim.)
    An optimist sees the glass as half full.
    A pessimist sees the glass as half empty.
    A realist drinks it no matter how much there is.

  • #6
    Regular Coder
    Join Date
    Sep 2007
    Posts
    238
    Thanks
    9
    Thanked 0 Times in 0 Posts
    Thanks for the replies - exactly what I'm after

    Dont worry guys, I should have been clearer in my question. Only the result field (combination of Day drop-down, Month drop-down and year text input) will be sent to the server/database.

    Thanks again.


  •  

    Posting Permissions

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