Question

i want to use user input in jquery dialog input box to be used when jquery dialog ok button is pressed.

now the problem is the code after jquery dialog box also get executed withought waiting for jquery input field to be filled by user

<p id="text"> click me </p>
<div id="test" class="sandy" > 
    <input id="username" class="sandy1" />
</div>​

$('#text').click(function(){
    $('.sandy').dialog({ 
     buttons: { 
    "OK": function() { 
     $(this).dialog('close'); 
    }}
    });
    var myvalue= $("#test").val();
    alert(myvalue);
})

you can check the demo at this link : http://jsfiddle.net/zCFD5/86/

please suggest me some way out to hold on to jquery dialog till user presses ok button and then move on to code after it.

Answer 1

Try this JS:

$('#text').click(function(){
    $('.sandy').dialog({
        buttons: {
            "OK": function() {
                if($('#username').val() == '') {
                    $('#username').focus();
                } else {
                    var myvalue= $("#username").val();
                    $(this).dialog('close');
                    alert(myvalue);
                }
            }
        }
    });
});

EDIT: I also updated the code at JSFIDDLE and it works fine 🙂 http://jsfiddle.net/zCFD5/96/