CODEWITHSUNDEEP
phpjavascriptjqueryjquery-ui
user1364146
user1364146

Reputation: 35

How to return user input from jQuery UI dialog box

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");}}
        });

Upvotes: 1

Views: 1979

Answers (4)

Rory McCrossan
Rory McCrossan

Reputation: 337590

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");}
        }
    }
);

Upvotes: 1

EyalAr
EyalAr

Reputation: 3170

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");
            }}
    });

Upvotes: 2

coder
coder

Reputation: 13248

Try this on "OK" funcion

var myvalue= $("#yourinputtext").val();
alert(myvalue);

Upvotes: 1

Fiona - myaccessible.website
Fiona - myaccessible.website

Reputation: 14921

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.

Upvotes: 2

Related Questions