jQuery dropdown change function

Question

I want to create a function for the following:

<select name="journey_type">
<option value="1">One Way</option>
<option value="2">Return</option>
</select>

<div id="return_datetime_div" style="display:none;">
<input id="Enquiry_return_datetime" type="text">
</div>

The return_datetime_div is displayed when the user selects "Return". If the user then selects "One Way" the return_datetime_div gets hidden (this functionality is working):

$("select[name='journey_type']").change(function()
{
    if($($(this)).val() == "2")
    {
        $("#return_datetime_div").slideDown();
    }
    else
    {
        $("#return_datetime_div").slideUp();
    }
}
});

Now I want to extend this for the following scenario:

User selects "Return"
User enters some text in to #Enquiry_return_datetime
User then selects "One Way"
A 'confirm' popup should be displayed informing the user of the change of journey type
If the user accepts then the text in #Enquiry_return_datetime should be erased and the div gets hidden as per normal
If the user does not accept then the text remains AND the journey_type option should not change and div does not get hidden

Ryan Hamilton · Accepted Answer · 2013-03-11 13:03:24Z

2

Using a selector with an id is a lot faster than checking all selects for having a certain name attribute. I also simplified your "this" syntax.

    $('select#journey_type').change(function() {
        if(this.val() == '2') {
            $('#return_datetime_div').slideDown();
        } else {
            $('#return_datetime_div').slideUp();
        }
    }

Secondly, if the user selects "one-way" after "return" I'd just make that visually obvious instead of bugging them with a warning. I also would not delete the value, just don't process it on the server side, much easier.

If you think your users will misunderstand one way or the other please do some very simple usabilitytest, just ask any non-technical person to do a task and let them comment while they're doing it.

edited Mar 11, 2013 at 13:03

Ryan Hamilton

33 bronze badges

answered Nov 8, 2010 at 13:43

Niels Bom

9,57711 gold badges52 silver badges65 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

jQuery dropdown change function

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related