I have a form that seems to POST successfully after submitting via AJAX. Under "NET" in Firebug the posted info displays properly. But I cannot echo this data at all.
I'm trying this, which is the 1st field in my form: <?php echo $_POST['sun_exposure']; ?>
Does this have anything to do with the form's ACTION not having a url?
Also, I'm trying to POST data to the same page, and not a PHP file. Maybe this is part of the problem? This is also a Wordpress page, and not a file.
Here's the live url: http://www.richmindonline.com/container-creations/personal-creations-assistant/
Here's the form code:
<form id="quotation_form" name="vdmQuotationForm" action="#" method="post">
<div id="page1">
<div id="step0_header" class="steps-headers" onClick="step0ToggleClick();">Step 1<span style="margin-left:30px;">Sun Exposure</span></div>
<div id="step0" class="quotation-steps"><strong>Describe the sun exposure of your planter...</strong><br/>
<div class="radio-container"><input onchange="go_to_next_step();" type="radio" name="sun_exposure[]" id="full_sun" value="Full Sun"<?php checked( 'Full Sun',$_POST['sun_exposure[]']); ?> /><label class="label-quotation-steps">Full Sun</label><br class="clear"/></div>
<div class="radio-container"><input onchange="go_to_next_step();" type="radio" name="sun_exposure[]" id="part_sun" value="Part Sun"<?php checked( 'Part Sun',$_POST['sun_exposure[]']); ?> /><label class="label-quotation-steps">Part Sun</label><br class="clear"/></div>
<div class="radio-container"><input onchange="go_to_next_step();" type="radio" name="sun_exposure[]" id="full_shade" value="Full Shade"<?php checked( 'Full Shade',$_POST['sun_exposure[]']); ?> /><label class="label-quotation-steps">Full Shade</label><br class="clear"/></div>
</div>
</div>
</div>
</form>
Here's the AJAX request, which is wrapped up in the jQuery validate script:
<script type="text/javascript">
jQuery(document).ready(function($) {
$('#quotation_form').validate({ // initialize the plugin
rules: {
'sun_exposure[]': {
required: true,
},
'height[]': {
required:true,
},
'diameter[]': {
required:true,
},
'shape[]': {
required:true,
},
'placement[]': {
required:true,
},
},
messages: {
'sun_exposure[]': {
required: 'Please choose a sun exposure for your plant',
},
'height[]': {
required: 'Please choose the height of your planter'
},
'diameter[]': {
required: 'Please choose the diamter of your planter'
},
'shape[]': {
required: 'Please choose the shape of your planter'
},
'placement[]': {
required: 'Please choose the placement of your planter'
},
},
errorPlacement: function (error, element) {
alert(error.text());
},
submitHandler: function (form) { // for demo
alert('valid form submitted'); // for demo
var form_data = $("#quotation_form").serialize();
$.ajax({
url: "http://www.richmindonline.com/container-creations/personal-creations-assistant/",
type: 'POST',
data: form_data,
cache: true,
success: function(data) {
alert(data);
}
});
$('#page1').hide();
$('html, body').animate({ scrollTop: $('body').offset().top }, 10);
$('#page2').show();
$('.intro').hide();
$('.to_page1').show();
return false;
}
}); // end .validate()
});
</script>
Related
I have a problem with my radio button.
Since i styled my radio buttons, the function is not working as it should.
I've heard somewhere that i have to change something in my jquery, but i dont know what.
Can someone help me?
here is the Html code
<div class="form-group">
<div class="form-check">
<input class="form-check-input" name="state" data-order="<?php echo $obj->order_id; ?>" value="1" type="radio" id="gridCheck1"
<?php if($obj->status == '1'){ echo 'checked'; } else { ''; } ?> >
<label class="form-check-label" for="gridCheck1">
Koude producten
</label>
</div>
</div>
Script
$(document).ready(function(){
$('#gridCheck1,#gridCheck2,#gridCheck3').click(function() {
if(this.checked){
$.ajax({
type: "POST",
url: 'change_state.php',
data: {
state: $(this).attr('value'),
order_id: $(this).data('order'),
}, //--> send id of checked checkbox on other page
success: function(data) {
$('#container').html(data);
},
error: function() {
//alert('it broke');
},
complete: function() {
setInterval(function() {
location.reload();
}, 1000);
}
});
}
});
I am using CodeIgniter. I have a form and fields are Name, Email, Mobile no, Message.
I am able to submit the data in the database using AJAX. There is no issue with AJAX.
Now What I did, I fill the form and click on submit button twice then I check my database and I found the same records twice because of two clicks. If I click three times on the submit button then I am getting same records three times in the database.
Is there any way to stop this issue. Like one click should work on submit button till the data submitting in the database?
View
<div class="i_p_aboutTeam_alert" id="popup_verify-1" style="display: none;">
<div class="profile_content">
<div class="profile_header clearfix">
<i class="fas fa-times"></i>
</div>
<div class="profile_body">
<div class="form_heading">
<h2>CONTACT FORM</h2>
</div>
<form action="" method="post" name="form" id="form" autocomplete="off">
<div class="form-group ffl-wrapper">
<label for="name" class="ffl-label">Name</label>
<input type="text" name="name" class="form-control" id="name">
</div>
<div class="form-group ffl-wrapper">
<label for="mobileno" class="ffl-label">Mobile Number</label>
<input type="text" name="mobileno" class="form-control" id="mobileno">
</div>
<div class="form-group ffl-wrapper">
<label for="email" class="ffl-label">Email</label>
<input type="email" name="email" class="form-control" id="email">
</div>
<div class="form-group ffl-wrapper">
<label for="message" class="ffl-label">Message</label>
<textarea class="form-control" name="message" id="message"></textarea>
</div>
<div class="form-group text-center">
<input type="submit" name="send" class="i_btn i_btn_bg i_btn_round w_100p" value="Submit">
</div>
</form>
</div>
</div>
</div>
AJAX
$("#form").validate({
rules: {
name: {
required: true,
minlength: 3,
lettersonly: true
},
mobileno: {
required: true,
minlength: 10,
maxlength: 10,
number: true
},
email: {
required: true,
email: true
},
message: {
required: true,
minlength: 10
}
},
submitHandler: function(form) {
//form.submit();
$.ajax({
url: "<?php echo base_url('Home_control/contact');?>",
type: "POST",
data: $('#form').serialize(),
success: function(data) {
$("#popup_verify-1").hide();
$("#popup_success-1").show();
},
}); // AJAX Get Jquery statment
}
});
Controller
public function contact() {
$this -> form_validation -> set_error_delimiters('<div class="error">', '</div>');
$this -> form_validation -> set_rules('name', 'Name', 'trim|required|min_length[3]');
$this -> form_validation -> set_rules('mobileno', 'Mobile no', 'trim|required|regex_match[/^[0-9]{10}$/]');
$this -> form_validation -> set_rules('email', 'email', 'required|valid_email');
$this -> form_validation -> set_rules('message', 'Message', 'required');
if ($this -> form_validation -> run() == FALSE) {
//$this->index();
} else {
$form_data = array(
'name' => $this -> input -> post('name', TRUE),
'mobileno' => $this -> input -> post('mobileno', TRUE),
'email' => $this -> input -> post('email', TRUE),
'message' => $this -> input -> post('message', TRUE)
);
$success = $this -> db -> insert('form', $form_data);
echo json_encode(array("data" => $success)); // return to the ajax
}
}
maintain flag for request in progress
<script type="text/javascript">
var isReqInprogress = false;
$("#form").validate({
rules: {
name: {
required: true,
minlength: 3,
lettersonly: true
},
mobileno: {
required: true,
minlength: 10,
maxlength: 10,
number: true
},
email: {
required: true,
email: true
},
message: {
required: true,
minlength: 10
}
},
submitHandler: function(form) {
//form.submit();
if(isReqInprogress){
return;
}
isReqInprogress = true;
$.ajax({
url: "<?php echo base_url('Home_control/contact');?>",
type: "POST",
data: $('#form').serialize(),
success: function(data) {
$("#popup_verify-1").hide();
$("#popup_success-1").show();
isReqInprogress = false;
},
}); // AJAX Get Jquery statment
}
});
</script>
Here is the AJAX code that you can use:
Solution 1: If you want to disable the submit button click until AJAX call is complete.
$.ajax({
type: "POST",
url: "<?php echo base_url('Home_control/contact');?>",
data: $('#form').serialize(),
beforeSend: function() {
$('#form').find("input[type='submit']").prop('disabled', true); // disable button
},
success:function(data){
$("#popup_verify-1").hide();
$("#popup_success-1").show();
$('#form').find("input[type='submit']").prop('disabled', false); // enable button
}
});
Solution 2: If you don't want to disable the submit button but prevent AJAX call from being used multiple times.
$("#form").validate({
var isCurrentReqInprogress = false;
...
...
submitHandler: function(form) {
//form.submit();
if(isCurrentReqInprogress){
return;
}
isCurrentReqInprogress = true;
$.ajax({
url: "<?php echo base_url('Home_control/contact');?>",
type: "POST",
data: $('#form').serialize(),
success: function(data) {
$("#popup_verify-1").hide();
$("#popup_success-1").show();
isCurrentReqInprogress = false;
},
}); // AJAX Get Jquery statment
}
});
I have a fullcalendar that inserts data into a database table ondrag and drop event.The fullcalendar also edits the event name onclick and saves the new event name to the database.Onclick a prompt dialog is used to edit the event name.I recently added a custom boostrap modal popup to my fullcalendar to display the events and edit the event name but i cant seem to figure out how to edit the event name and save it to the database using the custom modal.This only seems to work when i use the javascript prompt.
This is my edit event code Using javascript Prompt:
var title = prompt('Event Title:', event.title, { buttons: { Ok: true, Cancel: false}});
if (title){
event.title = title; console.log('type=changetitle&title='+title+'&name='+name+'&email='+email+'&numb='+numb+'&start='+start+'&end='+end+'&eventid='+event.id);
$.ajax({
url: 'process.php',
data: 'type=changetitle&title='+title+'&name='+name+'&email='+email+'&numb='+numb+'&start='+start+'&end='+end+'&eventid='+event.id,
type: 'POST',
dataType: 'json',
success: function(response){
if(response.status == 'success')
$('#calendar').fullCalendar('updateEvent',event);
},
error: function(e){
alert('Error processing your request: '+e.responseText);
}
});
}
},
Now i have added a custom boostrap modal to display the events.but cant seem to figure out how to edit the event name using the custom modal.
Heres my code using a custom modal onclick event:
eventClick: function(event, jsEvent, view) {
console.log(event.id);
$('#modalTitle').html(event.title);
$('#modalName').html(event.name);
$('#modalEmail').html(event.email);
$('#modalNumb').html(event.numb);
$("#modalDate1").html(moment(event.start).format('MMM Do h:mm A'));
$('#modalDate2').html(moment(event.end).format('MMM Do h:mm A'));
$('#dialog').modal("show")
var title = modal('Event Title:', event.title, { buttons: { Ok: true, Cancel: false}});
if (title){
.......//the rest of the code is the same as above
And here is the html code for the modal:
<div class="modal" id="dialog" >
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
<h4 class="modal-title" id="modalTitle"></h4>
<input class="modalTitle" type="text" id="Edit"/>
<div class="external-event bg-fuchsia" id="status"></div>
</div>
<div class="modal-body" id="modalBody">
Client:<h3 id="modalName"></h3>
<hr>
Email:<h3 id="modalEmail"></h3>
<hr>
Number:<h3 id="modalNumb"></h3>
<hr>
CheckIn:<h3 id="modalDate1"></h3>
<hr>
CheckOut:<h3 id="modalDate2"></h3>
</div>
<button type="button primary" class="btn btn-danger" aria-hidden="true" id="true">Save</button>
<button type="button primary" class="btn btn-danger" aria-hidden="true" id="false">Cancel</button>
</div>
</div>
</div>
I basically need to be able to edit the event using the custom modal instead of a prompt.Your help will be greatly appreciated.
You need to cache the event in a variable that you can have access after the modal opens and attach to the save button a click event that updates the fullcalendar event to your database.
something like this
var myEvent;
eventClick: function(event, jsEvent, view) {
myEvent= event;
// code
}
....
$( '#true' ).click(function(){
myEvent.title = $( '#Edit' ).val();
$.ajax({
url: 'process.php',
data: 'type=changetitle&title='+myEvent.title+'&name='+name+'&email='+email+'&numb='+numb+'&start='+start+'&end='+end+'&eventid='+event.id,
type: 'POST',
dataType: 'json',
success: function(response){
if(response.status == 'success')
$('#calendar').fullCalendar('updateEvent',myEvent);
},
error: function(e){
alert('Error processing your request: '+e.responseText);
}
});
});
I used this is a way for me to get all the required data from my modal and back to the controller via AJAX, even has validation and alerts for server messages.
dayClick: function (date, allDay, jsEvent, view) {
$('#LeaveStart').val(date.format('DD-MM-YYYY 00:00'));
$('#LeaveFinish').val(date.format('DD-MM-YYYY 23:59'));
$('#popupEventForm').modal('show');
$('#myform').validate({
rules: {
StaffID: {
required: true
},
SelectRole: {
required: true
},
customdescription: {
required: true
},
SicknessType: {
required: true
},
SicknessSubType: {
required: true
},
StartDate: {
required: true
},
EndDate: {
required: true
},
EventStatus: {
required: true
},
},
/*MESSAGES*/
messages: {
StaffID: {
required: "Please select staff member"
},
SelectRole: {
required: "Please select a role"
},
customdescription: {
required: "Please enter leave details"
},
SicknessType: {
required: "Please select a leave type"
},
SicknessSubType: {
required: "Please select a leave sub type"
},
StartDate: {
required: "Please Enter a start date"
},
EndDate: {
required: "Please Enter an end date"
},
EventStatus: {
required: "Please confirm a status"
},
},
highlight: function (element) {
$(element).closest('.form-group').addClass('has-error');
},
unhighlight: function (element) {
$(element).closest('.form-group').removeClass('has-error');
},
errorElement: 'span',
errorClass: 'help-block',
errorPlacement: function (error, element) {
if (element.parent('.input-group').length) {
error.insertAfter(element.parent());
} else {
error.insertAfter(element);
}
},
submitHandler: function (form) {
var dataRow = {
'Id': $('#id').val(),
'Subject': $('#title').val(),
'Description': $('#customdescription').val(),
'StartTime': $('#LeaveStart').val(),
'EndTime': $('#LeaveFinish').val(),
'SelectRole': $('#SelectRole').val(),
'ETADType': $('#SicknessType').val(),
'ETADSubType': $('#SicknessSubType').val(),
'StaffID': $('#StaffID').val(),
'EventStatus': $('#EventStatus').val(),
'AllRoles': $('#AllRoles').is(':checked'),
'AllDay': $('#AllDay').is(':checked'),
'isAMLeave': $('#AM').is(':checked'),
'isPMLeave': $('#PM').is(':checked'),
};
$.ajax({
type: 'POST',
url: "/BookingTwo/SaveEvent",
data: dataRow,
success: function () {
$("#myform")[0].reset();
ClearPopupFormValues();
$('#popupEventForm').modal('hide');
},
statusCode: {
201: function (reponose) {
$('#calendar').fullCalendar('refetchEvents');
ClearPopupFormValues();
$('#alert').addClass('alert alert-success').removeClass('alert-warning');
$("#alert").removeClass("hidden");
$("P").replaceWith("Success - Event Created")
$("#alert").fadeTo(2000, 500).slideUp(500, function () {
$('#alert').addClass("hidden");
})
},
500: function (reponse) {
$('#calendar').fullCalendar('refetchEvents');
ClearPopupFormValues();
$("#alert").removeClass("hidden");
$('#popupEventForm').modal('hide');
$("P").replaceWith("The Error Been forwarded to system admin")
$("#alert").fadeTo(2000, 500).slideUp(500, function () {
$('#alert').addClass("hidden");
})
},
400: function (reponse) {
$('#calendar').fullCalendar('refetchEvents');
ClearPopupFormValues();
$("#alert").removeClass("hidden");
$('#popupEventForm').modal('hide');
$("P").replaceWith("Duration Service returned 0 - Please Ensure Correct Shift Days are selected. Record NOT Created.")
$("#alert").fadeTo(2000, 500).slideUp(500, function () {
$('#alert').addClass("hidden");
})
},
409: function (reponse) {
$('#calendar').fullCalendar('refetchEvents');
ClearPopupFormValues();
$("#alert").removeClass("hidden");
$('#popupEventForm').modal('hide');
$("P").replaceWith(reponse.messages)
$("#alert").fadeTo(2000, 500).slideUp(500, function () {
$('#alert').addClass("hidden");
})
}
}
});
}
})
},
});
I have seen this example and applied it in my code yet nothing worked, its not working.
Referral ans-1
Referral ans-2
I need to apply jquery validation in ckeditor and I have seen all those past examples even I have mentioned those links above, by doing that step my validation is still not working.
Here is my HTML Code
<div class="elementbox">
<label class="form-label">Content<span class="required">*</span></label>
<div class="controls">
<textarea name="content_body" id="content_body" rows="10" cols="80"><?php echo $content_body; ?></textarea>
</div>
</div>
<script>
var url = "<?php echo base_url(); ?>";
CKEDITOR.replace( 'content_body',{
//extraPlugins: 'imageuploader'
} );
</script>
My Jquery validation code
$("#add_content_pages").validate({
ignore: [],
debug: false,
rules: {
title: {
required: true
},
content_id: {
required: true
},
content_body:{
required: function()
{
CKEDITOR.instances.content_body.updateElement();
}
}
},
messages: {
title: {
required: "Please enter Title"
},
content_id: {
required: "Please Select Content Type"
},
content_body: {
required: "Please enter Content"
}
},
errorPlacement: function (error, element) {
var attr_name = element.attr('name');
if (attr_name == 'type') {
error.appendTo('.type_err');
} else {
error.insertAfter(element);
}
}
});
Any Solution what I am missing?
please check this code
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.validation/1.15.0/jquery.validate.min.js"></script>
<script src="https://cdn.ckeditor.com/4.6.2/standard/ckeditor.js"></script>
then html form
<form action="" method="post" id="check_form">
<div class="elementbox">
<label class="form-label">Content<span class="required">*</span></label>
<div class="controls">
<textarea name="content_body" id="content_body" rows="10" cols="80"></textarea>
<div id="error_check_editor"></div>
</div>
</div>
<script>
CKEDITOR.replace('content_body');
</script>
<br/>
<input name="submit" type="submit" value="Submit" class="button" id="submit"/>
</form>
then script
<script>
$.validator.addMethod("check_ck_add_method",
function (value, element) {
return check_ck_editor();
});
function check_ck_editor() {
if (CKEDITOR.instances.content_body.getData() == '') {
return false;
}
else {
$("#error_check_editor").empty();
return true;
}
}
$(document).ready(function () {
$("#check_form").validate(
{
ignore: [],
debug: false,
errorPlacement: function (error, element) {
if (element.attr("name") == "content_body") {
error.insertAfter(element);
}
},
rules: {
content_body: {
check_ck_add_method: true
}
},
messages: {
content_body: {}
}
});
});
</script>
I am a bit of a noob with jQuery and am learning for Uni.
I am working on a HTML web site with an associated HTML mobile application that I will compile in phonegap build.
I have a HTML form that I want to include on both the site and the app which I have coded and is successfully validating with jQuery. I would also like to post the form data with jQuery but am struggling to find how best to achieve this.
My form looks like this
<form action="http://myaddress.com/process.php" method="post" name="jform" id="jform">
<div>
<label for="name"><b>Name:</b></label><br>
<input type="text" name="name" id="name">
</div>
<div>
<label for="dob"><b>Date of Birth:</b></label><br>
<input type="text" name="dob" id="dob">
</div>
<div>
<label for="visit"><b>Date of Visit:</b></label><br>
<input type="text" name="visit" id="visit">
</div>
<div class="labelBlock">
<b>Favourite Exhibit:</b>
<div class="indent">
<input type="radio" name="fave" id="exhibit1" value="Exhibit1">
<label for="exhibit1">Exhibit 1</label><br>
<input type="radio" name="fave" id="exhibit2" value="Exhibit2">
<label for="exhibit2">Exhibit 2</label><br>
<input type="radio" name="fave" id="exhibit3" value="Exhibit3">
<label for="exhibit3">Exhibit 3</label>
</div>
</div>
<div>
<label for="comment"><b>Comments:</b></label><br>
<textarea name="comment" id="comment" rows="10" cols="40" draggable="false"></textarea>
</div>
<div id="center-button">
<input name="submit" type="submit" id="submit" value="Submit" class="center-text">
</div>
</form>
My validation script looks like this:
<script>
$(document).ready(function() {
$('#jform').validate({
rules: {
name: "required",
dob: "required",
visit: "required",
fave: "required",
comment: "required"
}, //end rules
messages: {
name: {
required: "Please tell us your name"
},
dob: {
required: 'Please select your Date of Birth'
},
visit: {
required: 'Please select the date you visited'
},
fave: {
required: 'Please select your favourite exhibit'
},
comment: {
required: 'Please tell us about your visit'
}
},//end messages
errorPlacement: function(error, element) {
if ( element.is(":radio") ) {
error.appendTo( element.parent());
} else {
error.insertAfter(element);
}
}
}); // end validate
submitHandler: function(form) { //This is the submit handler.
var name = $('#name').val();
var dob = $('#dob').val();
var visit = $('#visit').val();
var fave = $("input[name='fave']:radio:checked").val();
var comment = $('#comment').val();
$.ajax({
type: 'POST',
url: 'process-post.php',
data: {name:name, dob:dob, visit:visit, fave:fave, comment:comment},
success: function(data1){
if (data1 == 'success') {
window.location.href = 'index.html';
}
else {
alert('Oops! It looks like something has gone wrong. Please try again.');
}
}
});
}}); // end ready
I really am struggling with this so would appreciate any help.
My PHP Looks like this
<?php # PROCESS JOURNAL ENTRY.
# Check form submitted.
if ($_SERVER['REQUEST_METHOD'] == 'POST')
{
# Open database connection.
require ( '../connect_db.php' ) ;
# Execute inserting into 'forum' database table.
$q = "INSERT INTO journal(name,dob,visit,fave,comment,date)
VALUES ('{$_POST[name]}','{$_POST[dob]}','{$_POST[visit]}','{$_POST[fave]}','{$_POST [comment]}',NOW() )";
$r = mysqli_query ( $dbc, $q ) ;
# Report error on failure.
if (mysqli_affected_rows($dbc) != 1) { die ('Error' . mysqli_error($dbc)); } else { echo "success"; }
# Close database connection.
mysqli_close( $dbc ) ;
}
?>
Yes he is correct jquery's ajax will accomplish this or http post. You will use one of the mentioned methods to get the data from the HTML form and send it to the sever.
You will need jQuery ajax. This is a very powerful function that is used any time jQuery validation is used. It also lets you submit to the PHP file and get the results without refreshing the page.
EDIT:
Depending on the complexity of your project, ajax may be overkill. You can just normally submit the form after it is validated like this:
<script>
$(document).ready(function() {
$('#jform').validate({
rules: {
name: "required",
dob: "required",
visit: "required",
fave: "required",
comment: "required"
}, //end rules
messages: {
name: {
required: "Please tell us your name"
},
dob: {
required: 'Please select your Date of Birth'
},
visit: {
required: 'Please select the date you visited'
},
fave: {
required: 'Please select your favourite exhibit'
},
comment: {
required: 'Please tell us about your visit'
}
},//end messages
errorPlacement: function(error, element) {
if ( element.is(":radio") ) {
error.appendTo( element.parent());
} else {
error.insertAfter(element);
}
}
}); // end validate
submitHandler: function(form) { //This is the submit handler.
$(form).submit();
}
}); // end ready
</script>
Here is the part that I add:
submitHandler: function(form) { //This is the submit handler.
$(form).submit();
}
This will submit a form normally, meaning that it will run the PHP script and then refresh the page.
If you decide you want to use ajax, you can just replace $(form).submit(); with this:
var name = $('#name').val();
var dob= $('#dob').val();
var visit = $('#visit').val();
var fave = $("input[type='radio'][name='fave']:checked").val();
var comment = $('#comment').val();
$.ajax({
type: 'POST',
url: 'http://myaddress.com/process.php',
data: {name:name, dob:dob, visit:visit, fave:fave, comment:comment},
success: function(data){
if (data == 'success') {
//do something
}
else {
//do something
}
}
});
The data that I am using in the success portion of the function is the value returned from the PHP script. Since you mentioned comments, I am assuming that you PHP is not returning data, but more or less a completion message. In that case, you would just have your PHP echo 'success'; if it was successful. Then fill in the "do somethings" in the jQuery.