Form is not submit using ajax.form submit on click li. Give me some solution
My js code is here
$(document).ready(function(){
$('#sortable li').click(function() {
$("#frmgallery").submit(function(event) {
event.preventDefault();
var formdata = $(this).serialize();
alert(formdata);
$.ajax({
type: "POST",
url: "gallery.php",
data: formdata,
success: function(){alert('success');}
});
});
});
HTML is here
<form method="post" enctype="multipart/form-data" id="frmgallery" name="gallery" action="<?php get_template_directory();?>admin.php?page=gallery/gallery.php">
<ul id="sortable">
Query
<li class="ui-state-default" name='liindex' id="<?php echo $row['glryRecordId'];?>" >
<span style="display:none"><?php echo $row['glryRecordId'];?></span>
<img class='thumbnail' alt='' src='<?php echo get_site_url();?>/wp-content/themes/townsley/upload/<?php echo $row['glryName']; ?>' width='80' height='60'
style="border: 1px solid #D3D3D3;padding:2px;"/><input type="hidden" value="<?php echo $row['glryRecordId'];?>" name="recordId[]" />
<a href="<?php get_template_directory();?>admin.php?page=gallery/gallery.php&delid=<?php echo $row['glryRecordId'];?>" style="display:block;text-align:center" title="DELETE this image from the record" class="arial-red">Remove</a>
</li>
</ul>
</form>
Please help me Thanks
ajax jquery javascript
You should provide your HTML too in your question, but as far as i can see, you have event
in event
callbacks with actually nothing to initiate the submit
event. So basically you should consider something like this :
$(document).ready(function(){
$('#sortable li').click(function() {
event.preventDefault();
var formdata = $("#frmgallery").serialize();
alert(formdata);
$.ajax({
type: "POST",
url: "gallery.php",
data: formdata,
success: function(){alert('success');}
});
});
});
You can use the ajaxForm/ajaxSubmit functions from Ajax Form Plugin or the jQuery serialize function.
Example:
$("#frmgallery").ajaxForm({url: 'gallery.php', type: 'post'})
or
$("#frmgallery").ajaxSubmit({url: 'gallery.php', type: 'post'})
ajaxForm
will send when the submit button is pressed. ajaxSubmit
sends immediately.
Have you tried return false at the end of your submit function?
$("#frmgallery").submit(function(e) {
e.preventDefault();
var formdata = $(this).serialize();
alert(formdata);
$.ajax({
type: "POST",
url: "gallery.php",
data: formdata,
success: function(){alert('success');}
error: function(){alert('error');}
});
return false;
});
$('#sortable li').click(function() {
$("#frmgallery").submit();
});
Also post what you get from $.ajax
call
$("#frmgallery").ajaxForm({url: 'gallery.php', type: 'post'})
Have you tried return false at the end of your submit function?
$("#frmgallery").submit(function(e) {
e.preventDefault();
var formdata = $(this).serialize();
alert(formdata);
$.ajax({
type: "POST",
url: "gallery.php",
data: formdata,
success: function(){alert('success');}
error: function(){alert('error');}
});
return false;
});
$('#sortable li').click(function() {
$("#frmgallery").submit();
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.