How to get the value of a selected option and save it into a variable? (Javascript)

I am creating a simple calculator that calculates the number of days left in a month. I have 2 dropdown lists. I've declared the variables and the formula. Now, I just need to assign values to the variables. How should I do it?

<html>
<body>
<form>
    What month ?
    <select id="month">
        <option selected disabled>Choose one</option>
        <option>Jan</option>
        <option>Feb</option>
        ...
        <option>Oct</option>
        <option>Nov</option>
        <option>Dec</option>
    </select>
    What date?
    <select id="date">
        <option selected disabled>Choose one</option>
        <option>1</option>
        <option>2</option>
        ...
        <option>29</option>
        <option>30</option>
        <option>31</option>
    </select>
</form>
<script>
    var result, finaldate, currentdate;

    result = finaldate - currentdate;
    document.write("There are "+result+" days left in this month.")
</script>

</body>
</html>

Thank you!

<html>
<body>
<form>
    What month ?
    <select id="month">
        <option selected disabled>Choose one</option>
        <option>Jan</option>
        <option>Feb</option>
        ...
        <option>Oct</option>
        <option>Nov</option>
        <option>Dec</option>
    </select>
    What date?
    <select id="date">
        <option selected disabled>Choose one</option>
        <option>1</option>
        <option>2</option>
        ...
        <option>29</option>
        <option>30</option>
        <option>31</option>
    </select>
</form>
<script>
    var result, finaldate, currentdate;

    result = finaldate - currentdate;
    document.write("There are "+result+" days left in this month.")
</script>

</body>
</html>

Thank you!

Share Improve this question edited Nov 1, 2015 at 1:55 Eduardo Ponce de Leon 9,71613 gold badges56 silver badges86 bronze badges asked Aug 22, 2015 at 4:27 Clover Leaf 331 gold badge1 silver badge3 bronze badges

1 I do not understand what you intend to do. Can you tell me the exact steps you intend to do, what did you try and how did it fail? Telling us that you need to put those into variables is not enough information. – Lajos Arpad Commented Aug 22, 2015 at 4:37
1 So I have 3 variables, (result, finaldate, and currentdate), and 2 dropdown lists (month and date). I want the "finaldate" to be the final date of the month. For example, if Feb in the month dropdown list is selected, finaldate = 28; if Aug is selected, finaldate = 31. And the "currentdate" would be whatever date is selected in the date dropdown list, if 22 in the date dropdown list is selected, currentdate = 22; if 25 is selected, currentdate = 25. Thank you for helping – Clover Leaf Commented Aug 22, 2015 at 4:44

Add a ment |

2 Answers 2

Sorted by: Reset to default 3

PLEASE READ MY NEXT ANSWER FOR THE ACTUAL SOLUTION TO THE PROBLEM...

You are missing a lot of things here, first values on your options, then you need a trigger, either a button or when each drop down changes.

Then even if you get the values, the way you are trying to calculate the difference in dates is not going to work. You need many more variables and values in your equation. But back to your question, here is an example of how to get the value from the select:

<select id="month" onchange="setMonth()">
        <option selected disabled>Choose one</option>
        <option value="Jan">Jan</option>
        <option value="Feb">Feb</option>
        ...
        <option value="Oct">Oct</option>
        <option value="Nov">Nov</option>
        <option value="Dec">Dec</option>
    </select>

Then create the functions to set the variables. Here is an example, if the alert displays the month, then you are doing it right.

<script>
var month;
function setMonth(){
  month = document.getElementById('month').value;
  alert(month);
}

</script>

   var month;
    function setMonth(){
      month = document.getElementById('month').value;
      alert(month);
    }

<select id="month" onchange="setMonth()">
            <option selected disabled>Choose one</option>
            <option value="Jan">Jan</option>
            <option value="Feb">Feb</option>
            <option value="Oct">Oct</option>
            <option value="Nov">Nov</option>
            <option value="Dec">Dec</option>
        </select>

I just noticed your explanation on the ments, and there is an easy way of solving this by adding the right values on the selected month.

Write the maximum number of days in the value of the month. Then your subtraction will work. Add a button that will trigger the function.

Here is how to do it for a couple of months (you will need to add validation for cases when the days don't match the maximum number of days in a month, for example if the user selects 31 and February as the month!)

function calcDays(){
  var monthDay = document.getElementById('month').value;
  var day = document.getElementById('day').value;
  var result = parseInt(monthDay) - parseInt(day);
  alert("There are "+result+" days left in this month");
}

//parseInt() allows you to use input strings as integers

<select id="month" onchange="setMonth()">
	<option selected disabled>Choose one</option>
	<option value="31">Oct</option>
	<option value="30">Nov</option>
</select>

<select id="day">
  <option value="1">1</option>
  <option value="2">3</option>
  <option value="4">4</option>
  <option value="5">5</option>
</select>

<button onclick="calcDays()">Get missing days in the month</button>


<!-- Finish your select options -->

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

How to get the value of a selected option and save it into a variable? (Javascript) - Stack Overflow

2 Answers 2

与本文相关的文章

评论列表(0)