CODEWITHSUNDEEP
javascriptjqueryhtml
LolBB
LolBB

Reputation: 75

Failing to get value of an html input field

I've got a html dialog window, with a simple input field, and two buttons (OK and Cancel).

The user will be prompted to enter text into the input field and then select OK, then I want to take the contents of the input (type text) field and use it. However, I cant seem to get the contents of the input field.

Here is the code I have:

Html dialog contents:

<div id="DescriptionDialog" title="Update Settings" style="display: none;">
    <p>Please enter the reason for this update: </p>
    <input id="StateDescription" name="StateDescription" class="longer" type="text" placeholder="enter description of change"/>
</div>

The javascript function - the function is triggered by another button on the main page - to open the dialog:

function DialogFunction() {

    $('#DescriptionDialog').show();

    $('#DescriptionDialog').dialog({
        open: function () { $('.ui-dialog :button').blur(); },
        width: 500,
        modal: true,
        resizable: false,
        buttons: {
            "OK": function () {
                alert('OK');

                var description = $('#StateDescription').val();

                alert(description);

                //This is where i will make an ajax call to use the description entered.

                $('#StateDescription').val("");
                $('#DescriptionDialog').hide();
                $(this).dialog('close');

            },
            "Cancel": function () {// get rid of the dialog and reset the form
                $(this).dialog('close');
                $('#StateDescription').val("");
                $('#DescriptionDialog').hide();
            }
        }
    });
}

For some reason when i select OK, the alert to show "OK" appears, then no matter what i have entered in the input field, the alert for the description is always blank or if i set a value in the html then it is that.

Any ideas?

Upvotes: 0

Views: 136

Answers (1)

Pirata21
Pirata21

Reputation: 449

are you sure that you don't have another input with the Id "StateDescription"? because your code are pretty good, and when I try to run this on jsfiddle after the "OK" alert I can see the value for the input:

Look it here: http://jsfiddle.net/paqrL/

This are ok dude!

            var description = $('#StateDescription').val();
            alert(description);

Upvotes: 1

Related Questions