reset values of not selected fields of dropdown

Question

I have a dropbox that when selected it displays its respective fields

in first image you can see there is A person without an ID so when selected it displays something like:

enter image description here

if you see I added 12

Now if i change my mind and select the other option (person with ID) one field is displayed like: enter image description here

I added 9999

That is ok, but now if I change my mind again and return to other selected option the values are still there like: enter image description here

I would like to clean them... How can I accomplish that?

It does not matter to fill all respective fields again, I want to reset values in that case if select person without ID, delete the 9999, on the other hand, if i select person with Id, i want to reset the vakue 12

please take a look at my fiddle

some of the jquery code is:

//function available 
function validate(id, msg) {
    var obj = $('#' + id);
    if(obj.val() == '0' || obj.val() == ''){
        $("#" + id + "_field_box .form-error").html(msg)
        return true;
    }
    return false;
}

$(function () {
    $('#has_id').show();
    $('#select_person').change(function () {
        $('.persons').hide();
        if ($('#select_person').val() == 'typeA') {
            $("#has_id").html('');
            $("<option/>").val('0').text('--Choose Type A--').appendTo("#has_id");
            $("<option/>").val('person-A-withID').text('person-A-withID').appendTo("#has_id");
            $("<option/>").val('person-A-withoutID').text('person-A-withoutID').appendTo("#has_id");
        }

        if ($('#select_person').val() == 'typeB') {
            $("#has_id").html('');
            $("<option/>").val('0').text('--Choose Type B--').appendTo("#has_id");
            $("<option/>").val('person-B-withID').text('person-B-withID').appendTo("#has_id");
            $("<option/>").val('person-B-withoutID').text('person-B-withoutID').appendTo("#has_id");
        }


    });

    $('#has_id').change(function () {
        $('.persons').hide();
        $('#' + $(this).val()).show();
    });

});







var validation = function(){
            var err = 0;
            err += validate('select_person', "select person.");
            err += validate('has_id', "Select whether it has an ID or not.");   

            if(err == 0){
               alert('continue');
            }else{
                alert('error');
            }

        };

It seems like it already does what you're saying it should do — Explosion Pills
– Explosion Pills, Commented May 1, 2013 at 1:58
yeah, if ypu play with that you see the value is not reseted, it is stored, so I want to reset the corresponding values of dropdown that is not selected — edgarmtze
– edgarmtze, Commented May 1, 2013 at 2:03

Jonah · Accepted Answer · 2013-05-01 02:05:19Z

1

Simply make this change:

$('#has_id').change(function () {
    $('.persons input').val('');
    $('.persons').hide();
    $('#' + $(this).val()).show();
});

New fiddle: http://jsfiddle.net/6m27M/

This simply clears out all the values any time a change is made to the #has_id dropdown.

answered May 1, 2013 at 2:05

Jonah

16.3k23 gold badges94 silver badges172 bronze badges

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

Collectives™ on Stack Overflow

reset values of not selected fields of dropdown

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