javascript - create dynamically buttons to show dialog -
i have button (create) , when it's clicked, creates new button (change coordinates) should able open dialog when it's clicked.
first of created body of dialog window, created via javascript, how looks in html:
<div id="dialog-form" title="change coordinates"> <p class="validatetips">both fields required.</p> <form> <fieldset> <label for="lon">longitude (decimal)</label> <input type="text" name="lon" id="lon" value="" class="text ui-widget-content ui-corner-all"> <label for="lat">latitude (decimal)</label> <input type="text" name="lat" id="lat" value="" class="text ui-widget-content ui-corner-all"> <input type="submit" tabindex="-1" style="position:absolute; top:-1000px"> </fieldset> </form> </div>
now when create button clicked crate new button able open dialog:
$( "#create" ).button().on( "click", function() { var btn = document.createelement("button"); btn.id = "change_coord"; var t = document.createtextnode("change coordinates"); btn.appendchild(t); document.body.appendchild(btn); });
and how dialog looks like:
dialog = $( "#dialog-form" ).dialog({ autoopen: false, height: 300, width: 350, modal: true, buttons:{ "create account": adduser, cancel: function(){ dialog.dialog( "close" ); } }, close: function(){ form[ 0 ].reset(); allfields.removeclass( "ui-state-error" ); } });
weird works when i'm creating body of dialog , button open in
$(function() { .... });
but when i'm dynamically creating button open dialog doesn't work @ all.
here fiddle show problem.
per charlietfl, correct "live" has been deprecated, still remains common solution problem. other method i've used, works is:
$(document).on("mouseenter","#lstmfmenu", function() {
however, cannot jquery work against dynamically loaded html using $("#selector").on(), must use $(document).on statement shown above.
thanks.
Comments
Post a Comment