Search jQuery

jQuery Forum

Using jQuery UI

zhshqzyc

Function doesn't run

in Using jQuery UI • 7 months ago

I created a dialog. The snapshot likes:

There is a textbox, a drop down menu that has two items. And a submit button. The code is as below.

<div id="generatePinsDialog" title="Generate New PINs">
    <input id="newCount" type="text" size="25" value="Enter the number!" />
    <br />
    <select>
        <option value="sameAsID">Same as ID</option>
        <option value="appendID">AppendID</option>
    </select>
    <br />
    <button id="submit" name="subject" type="submit" value="submit">Submit</button>
</div>

To pop up this dialog, I created a button.

<div style="float: left; padding: 5px 0px 5px 10px;">
<input type="button" value="Generate PINs" id="btnGeneratePINs" onclick="OpenGeneratePINsDialog();" />
</div>

What I want is to call a WCF method by clicking "submit" button then close the dialog. However the function is not working, please help me to correct the code.

function OpenGeneratePINsDialog() {
    $("#generatePinsDialog").dialog('open');
    var appendIDGenerated = 0; sameAsID = 0;
    var c = $("#newCount").val();
    var e = $("#generatePinsDialog option:selected").val();
    if (e == 0) {
        sameAsID = 1;
    }
    else {
        appendIDGenerated = 1
    }
    if (this.id == "submit")
        $.getJSON('/MyServices/eService.svc/ + c + '/' + sameAsID + '/' + appendIDGenerated, function (response) {
        });
    $("#generatePinsDialog").dialog('close');
}

Many many thanks.

Replies(3)

kbwood.au

Re: Function doesn't run

7 months ago

You need to initialise the dialog before you can open it. Remove the submit button and use the dialog buttons instead. Something like this:

function OpenGeneratePINsDialog() {
$('#generatePinsDialog').dialog('open'); //Open it
}
$(function() {
$('#generatePinsDialog').dialog({autoOpen: false, buttons: { // Initialise it
Submit: function() { // On submit
var c = $('#newCount').val();
var e = $('select', this).val();
var sameAsID = (e == 'sameAsID' ? 1 : 0);
var appendIDGenerated = 1 - sameAsID;
$.getJSON('/MyServices/eService.svc/' + c + '/' +
sameAsID + '/' + appendIDGenerated,
function (response) { });
$(this).dialog('close'); // Close it
}
}});
});

zhshqzyc

Re: Function doesn't run

7 months ago

If you remove the submit button. The code becomes:

<div id="generatePinsDialog" title="Generate New PINs">
<input id="newCount" type="text" size="25" value="Enter the number!" />
<br />
<select>
<option value="sameAsID">Same as ID</option>
<option value="appendID">AppendID</option>
</select>
<br />
</div>

Then what is the position of dialog submit button, below the textbox?

kbwood.au