jquery - JQueryUI Submit button found in dialog box only works after second time opening the dialog -
i have dialog box opens when double click on draggable element. it's purpose append ip address underneath image:
it works fine after close dialog box , open again click on submit button.
here's codes:
html
<div id="configbox" title="ipv6 configuration" style="font-size:15px;"> <form> <b>dhcp</b> <input type="radio" name="option" value="dhcp"/> <b>auto config</b> <input type="radio" name="option" value="auto"/> <b>static</b> <input type="radio" name="option" value="static"/> <br/><br/> <table> <tr> <td> <b>ipv6 address:</b> </td> <td> <input type="text" id="address" size="25"/> / <input type="text" id="subnet" size="3"/> </td> </tr> <tr> <td> <b>link local address:</b> </td> <td> <input type="text" id="local" size="35"/> </td> </tr> <tr> <td> <b>ipv6 gateway:</b> </td> <td> <input type="text" id="gateway" size="35"/> </td> </tr> <tr> <td> <b>ipv6 dns server:</b> </td> <td> <input type="text" id="dns" size="35"/> </td> </tr> <tr> <td> </td> <td> </td> </tr> </table> </form> <center> <button id="submit" style="background-color:#b4ba22; border-radius:3px; font-size:17px; font-weight:bold; cursor:pointer;">submit </button> <button id="cancel" style="border-radius:3px; font-size:17px; font-weight:bold; cursor:pointer;"> cancel </button> </center> </div>
jquery
$(document).click(function (e) { // matches children of droppable, change selector needed currentdragimg = $(e.target).closest(".drag"); if ($(e.target).closest(".drag").length > 0) { $(e.target).closest(".drag").find(".ui-resizable-handle").show(); } else { $("#droppable").find(".ui-resizable-handle").hide(); $("#tools").hide(); } $('.drag').dblclick(function () { //the dialog box enter ip address opens on double click $('#configbox').dialog('open'); return false; }); }); /*the submit button*/ $(function () { $("#submit").click(function () { enter = $("#address").val(); $("<div>"+enter+"</div>").appendto(currentdragimg); }); });
any idea why happening? input appreciated. thanks.
i not sure, might try this.
at first submit button not working, because there not element id = submit
(probably display: none
) . after open dialog i.e element id = configbox
. submit button on dom , hence next time open dialog box click event binded submit buttom.
you can add click event after opennng dialog below.
$('.drag').dblclick(function () { //the dialog box enter ip address opens on double click $('#configbox').dialog('open'); $(function () { $("#submit").click(function () { enter = $("#address").val(); $("<div>"+enter+"</div>").appendto(currentdragimg); }); return false; });
please try , comment. hope helps.
Comments
Post a Comment