[jQuery] Form built by ajax doesn't submit
Hello,
I'm making a utility where you can upload multiple files at once then
one by one write up a description for them as they display on the
screen. This works for the first file.
I send the request to a php file through ajax and the php file will
respond with the next file and form. I can see the second file but the
form will not submit into the same ajax/jquery call as before.
This is what I have:
$(".button").click(function() {
var photo_ID = $("input#photo_ID").val();
var photo_title = $("input#photo_title").val();
var photo_description = $("textarea#photo_description").val();
var dataString = 'photo_title='+photo_title
+'&photo_description='+photo_description;
alert(photo_title);
$.ajax({
type: "POST",
url: "form-parse.php?update_photo_text="+photo_ID,
data: dataString,
success: function() {
$("#photo_wrapper").fadeOut("slow");
setTimeout(function(){ get_next_photo() },1500);
}
});
return false;
});
function get_next_photo()
{
$.post("form-parse.php?get_next_photo=yes", function(theResponse)
{
$('#photo_wrapper').html(theResponse);
$('#photo_wrapper').fadeIn("slow");
});
return false;
}
and the html form:
<form name="photo_text_update" action="">
Title of Photo<br />
<input name="photo_title" id="photo_title" type="text"
size="45" />
Description of Photo<br />
<textarea name="photo_description" cols="80" rows="7"
id="photo_description"></textarea>
<input type="hidden" name="photo_ID" id="photo_ID"
value="<? echo $val; ?>" />
<input type="submit" name="submit" class="button"
id="submit_btn" value="Send" />
</form>
what i get back from ajax looks exactly the same as the form above
just with updated values.
thanks