I have a dynamic modal window with a form. when i update the form fields and click on update button, i am unable to get the changed values in js but it gives me the original values.
How do get the changed values instead of original form vlaue.
in PHP i formed the content of the modal window and returned it to ajax to populate the content in modal:
$content="
<div class='modal-header'>
<button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>
<h4 class='modal-title' id='formModalLabel'>Edit Banner</h4>
</div>
<form class='form-horizontal' role='form'>
<div class='modal-body'>
<div class='form-group'>
<div class='col-sm-3'>
<label for='title' class='control-label'>Title</label>
</div>
<div class='col-sm-9'>
<input type='text' name='title' id='title' class='form-control' placeholder='title' value='$title'>
</div>
</div>
<div class='form-group'>
<div class='col-sm-3'>
<label for='alt' class='control-label'>Alternate</label>
</div>
<div class='col-sm-9'>
<input type='text' name='alt' id='alt' class='form-control' placeholder='alt' value='$alt'>
</div>
</div>
<div class='form-group'>
<div class='col-sm-3'>
<label for='url' class='control-label'>Image URL</label>
</div>
<div class='col-sm-9'>
<input type='text' name='url' id='url' class='form-control' placeholder='url' value='$url'>
</div>
</div>
<div class='form-group'>
<div class='col-sm-3'>
<label for='link' class='control-label'>Link</label>
</div>
<div class='col-sm-9'>
<input type='text' name='link' id='link' class='form-control' placeholder='link' value='$link'>
</div>
</div>
</div>
<div class='modal-footer'>
<button type='button' class='btn btn-default' data-dismiss='modal'>Cancel</button>
<button type='button' id='$pid' class='btn btn-primary updatebtn'>Update</button>
</div>
</form>
";
echo $content;
JS code to populate the modal with the content
success: function(html)
{
$('.modal-content').show().html(html);
$("#formModal").modal("show");
}
JS code on click of update button in modal window
$('.modal-content').delegate('.updatebtn', 'click', function() {
var title = $("#title").val(); // this gives original vlaues
});
Thanks
AJ