html5 - How to make editable list item using jQuery? -
i want display user information in listview data pulled db. target make listview editable when user clicks on listview, responds "textbox" , keyboard appears (for mobile). after editing, user can press "save" button save his/her editable contents db. using html, jquery, , css adobe phonegap api.
i have created fiddle , think want :
http://jsbin.com/ijexak/2/edit
in fiddle click on text edit , on focusout of input element text save , input element hide.
updated
i checked comment, should try this:
html
<ul> <li> <span class="display">erum</span> <input type="text" class="edit" style="display:none"/> </li> <li> <span class="display">ingress</span> <input type="text" class="edit" style="display:none"/> </li> </ul> js
$(".display").click(function(){ $(this).hide().siblings(".edit").show().val($(this).text()).focus(); }); $(".edit").focusout(function(){ $(this).hide().siblings(".display").show().text($(this).val()); }); hope helps!
Comments
Post a Comment