I am developing an mobile app in which i want to populate ListView once the user fill up the form and click on submit button.
I know how to give List View in jQuery but how to populate items in it dynamically at run time?
Are you looking for something like this?
HTML:
<div id=listView></div>
<input type=button id=mybutt value=Submit />
javascript/jQuery:
$('#mybutt').click(function() {
var out = '<ul><li>Item One</li><li>Item Two</li><li>Item Three</li></ul>';
$('#listView').html(out);
});
Responding to your comment: what i need is on click of button form gets submitted and firstname which user enters on form will get added in list
First, you need to remain on the page after the form was submitted. To do that, you should add e.preventDefault(); in your submit routine:
$( #target ).submit(function( event ) {
//Manually collect form values and
//Use ajax to submit form values here (see notes at bottom)
event.preventDefault();
});
Next, you want to get the data that was in the desired field, and add that to the <ul>. Therefore, change the above like this:
$( #target ).submit(function( event ) {
var fn = $('#fname').val();
$('ul').append('<li>' +fn+ '</li>');
//Manually collect form values and
//Use ajax to submit form values here (see notes at bottom)
event.preventDefault();
});
For the AJAX bit, see this post for tips.
Note that you can use $('#formID').serialize(); to quickly serialize all form data.
