?
Solved

use month from current date as default for select list

Posted on 2016-10-14
3
Medium Priority
?
95 Views
Last Modified: 2016-10-15
I have this ddl fiddle

http://jsfiddle.net/L5z6e2ga/

In the select list i'm defaulting to october on page load llike this:  
<option selected="selected" value="10/01/2016">October</option>

Instead of hard coding it like this. How do I use date function and look up today's month and use that month to then set the selected month on the input select.

So if I launch this fiddle this month (which is October) it will default to October, but if I launch it next month. I will launch with November by default.
0
Comment
Question by:maqskywalker
3 Comments
 
LVL 22

Accepted Solution

by:
Kim Walker earned 1000 total points
ID: 41844627
You've selected jQuery as a tag for your question so I assume you want to do this on the front end after the page loads. Correct?

First you need to make it easier to select the correct month from the select list by adding unique ids to each option.
                       <select id="DDLMonth1" name="DDLMonth1" class="DDLMonth1">
                           <option id="month6" value="07/01/2016">July</option>
                           <option id="month7" value="08/01/2016">August</option>
                           <option id="month8" value="09/01/2016">September</option>
                           <option id="month9" value="10/01/2016">October</option>
                           <option id="month10" value="11/01/2016">November</option>
                           <option id="month11" value="12/01/2016">December</option>
                           <option id="month0" value="01/01/2017">January</option>
                           <option id="month1" value="02/01/2017">February</option>
                           <option id="month2" value="03/01/2017">March</option>
                           <option id="month3" value="04/01/2017">April</option>
                           <option id="month4" value="05/01/2017">May</option>
                           <option id="month5" value="06/01/2017">June</option>
                       </select>

Open in new window

Then you can paste the following code at the bottom of the page to determine the current month and select it. Javascript dates use 0 (zero) for January and 11 for December.
<script type="text/ecmascript">
    var d = new Date();
    $('#month'+d.getMonth() ).prop('selected',true);
</script>

Open in new window

You could also use the values as a selector instead of adding the ids but then you'd have to deal with the leading zero.
0
 
LVL 36

Assisted Solution

by:Miguel Oz
Miguel Oz earned 1000 total points
ID: 41844748
There is no need for ids (Kim's comment) if you only use month values as shown below:
 <select id="DDLMonth1" name="DDLMonth1" class="DDLMonth1">
    <option value="7">July</option>
    <option value="8">August</option>
    <option value="9">September</option>
    <option value="10">October</option>
    <option value="11">November</option>
    <option value="12">December</option>
    <option value="1">January</option>
    <option value="2">February</option>
    <option value="3">March</option>
    <option value="4">April</option>
    <option value="5">May</option>
    <option value="6">June</option>
</select>

Open in new window


Your start up javascript  is:
<script type="text/javascript">
        var d = new Date();
	$('#DDLMonth1').val(d.getMonth()+1); //Set selected value
</script>

Open in new window


Note: The Jquery val function is very handy.
1
 
LVL 1

Author Closing Comment

by:maqskywalker
ID: 41845048
thanks.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

840 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question