how to submit form when the flip switcher go to on state in jquery mobile

Question

I have simple form contain two input user name & password and flip swithcher I want to sumbitt the form when the flip go to on state I try using this :

<select name="flip-1" id="flip-1" data-role="slider">
<option value="off"></option>
<option value="on"><input type="submit" value="" data-inline="true" /></option>
            </select>

but not work any one can help???

Answer 1

Here's a working code.

HTML :

<form id="some-form">
    <select name="flip-1" id="flip-1" data-role="slider">
        <option value="off"></option>
        <option value="on">Submit</option>
    </select>                                
</form>

Javascript :

$(document).on('change', '#flip-1', function(){    
    if($("#flip-1 option:selected").attr('value') == 'on') {
        $('#some-form').submit();
    }
});

EDIT :

This should do it:

$(document).on('pagebeforeshow', '#index', function(){       
    $(document).on('change', '#flip-1', function(){    
        if($("#flip-1 option:selected").attr('value') == 'on') {
            $('#some-form').submit();
            var timer = setInterval(function() { 
                $('#flip-1 option[value="off"]').attr('selected','selected');
                $('#flip-1').slider('refresh'); 
                clearInterval(timer);
            }, 500)
        }
    });
});

setInterval is here just so it can look like flip switch was turned on then off.