• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 85
  • Last Modified:

How to show multiple options in dropdown and not one option

I have a select that is populating but I need it to list all number of days instead of the total of days. For example if its 3 days  I need the dropdown to have option 1 day, option 2 days , option 3 days and not just option 3 days

var selectedDate = new Date();
				$( "#checkout" ).datepicker({
					dateFormat: 'yy-mm-dd',
					defaultDate: "+1w",
					changeMonth: false,
					numberOfMonths: 1,
					showOn: 'button',
					buttonText: '<i class="calendar"></i>',					
					prevText: '<i class="chevron-left"></i>',
					nextText: '<i class="chevron-right"></i>',			
				$("#checkout").datepicker("option", "minDate", selectedDate);

$('#checkout').datepicker().bind("change", function () {

function calculate() {
    var d1 = new Date();
    var d2 = $('#checkout').datepicker('getDate');
    var diff = 1;
    if (d1 && d2) {
        diff = diff + Math.floor((d2.getTime() - d1.getTime()) / 86400000); // ms per day
	var QTY = [diff];    
    var sel = document.getElementById('duration');
for(var i = 0; i < QTY.length; i++) {
    var opt = document.createElement('option');
    opt.innerHTML = QTY[i];
    opt.value = QTY[i];

Open in new window

1 Solution
Robert SchuttSoftware EngineerCommented:
Try changing lines 26-33 to:
        var sel = document.getElementById('duration');
        sel.innerHTML = ""; // clear
        for(var i = 0; i < diff; i++) {
            var opt = document.createElement('option');
            opt.innerHTML = (i+1) + ' day' + (i>0?'s':''); // opt.text
            opt.value = i+1;

Open in new window

Note that the option value and text are different (on purpose). I made a jsFiddle, when you click submit you see the form values: http://jsfiddle.net/robert_schutt/heamy7LL/1/
ucohockeyAuthor Commented:
Works perfect thanks
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Keep up with what's happening at Experts Exchange!

Sign up to receive Decoded, a new monthly digest with product updates, feature release info, continuing education opportunities, and more.

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