javascript - How can I make a form within a tooltip? -


i want use jquery make form has simple yes or no shows when hover on it. problem can't seem jquery acknowledge creation of tooltip dynamically created (e.g. "$('#word_form').size() = 0") , submit alert doesn't run. tested form alone , working. here code:

html:

<script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> <p> example 1 : <a href="#" class = "word">cat</a> example 2 : <a href="#" class = "word">dog</a> </p> 

javascript:

$( document ).ready( function() {     $(".word").tooltip({         items: '.word',         content: '         <div class="tooltip">is word cool?<br> \             <form id = "word_form" method="post"> \                 <input type="image" src="http://upload.wikimedia.org/wikipedia/commons/8/87/symbol_thumbs_up.svg" style="width:50px;height:50px;"> \                 <input type="image" src="http://upload.wikimedia.org/wikipedia/commons/8/84/symbol_thumbs_down.svg" style="width:50px;height:50px;"> \             </form> \         </div>',         hide: {             delay: 1000         }     });     $('#word_form').submit(function() {         alert("why not popping up?");     }); }); 

see fiddle .

is using jquery tooltip form possible? if so, doing wrong if not, might alernative? thanks!

basically jquery ui tooltip html not created until tooltip revealed submit event trying bind not firing because not attached anything.

to bind events elements created on fly use '.on()' method. on submit event should that

$("body").on("submit", "#word_form", function() {         alert("why not popping up?");     }); 

Comments

Popular posts from this blog

database - VFP Grid + SQL server 2008 - grid not showing correctly -

jquery - Set jPicker field to empty value -

.htaccess - htaccess convert request to clean url and add slash at the end of the url -