I want to open a jQuery UI dialog box and the box will have an input field which will take username. I want that when user presses the OK key on the dialog box, the dialog should return the username back to jQuery somehow
$("#dialog").dialog({
autoOpen: false,
width: 600,
buttons: {
"Ok": function() {
$(this).dialog("close");}}
});
A dialog is asynchronous, which makes it meaningless to "return" something.
You can, however, use one of the callback functions to perform actions with the user input.
For example, using the 'OK' button callback:
$("#dialog")
.append(
$("<input>")
.attr({
"type" : "text",
"id" : "user-input"
})
)
.dialog({
autoOpen: false,
width: 600,
buttons: {
"Ok": function() {
alert( $("#user-input").val() );
$(this).dialog("close");
}}
});
If you just have a div on your page with ID dialog
that contains the input field, just select it using a regular jQuery selector when the user presses OK.
Try this on "OK" funcion
var myvalue= $("#yourinputtext").val();
alert(myvalue);
You can capture the value in the ok
button click handler, and then do with it as your require:
$("#dialog").dialog({
autoOpen: false,
width: 600,
buttons: {
"Ok": function() {
var inputValue = $("#myInput").val();
// do stuff with the value...
$(this).dialog("close");}
}
}
);