Ajax with submit form and php

Question

I am not sure what I am doing wrong. I have searched over multiple forums but did not get a solution. I have the following ajax defined for submitting values from a form. I have the alert function to make sure that this code is being called (which it is), but process.php is not being executed. Any ideas why? Here is the ajax code (my dataString contains the value for all variables and there seems to be no problem with the $_POST variables.

    // JavaScript Document
$(document).ready(function(){
$(".button").click(function() {
  // validate and process form here
  //alert("yayyy");

   var company = $("input#company").val();
   var jobfunc = $("input#jobfunc").val();
   var location = $("input#location").val();
   var overall = $("input#overall").val();
   var detail = $("textarea#detail").val();
   var pros = $("textarea#pros").val();
   var cons = $("textarea#cons").val();
   var sr_mgmt = $("textarea#sr_mgmt").val();
   var submitted_by = $("input#submitted_by").val();
   var classof = $("input#classof").val();
   var school = $("input#school").val();
   var anonymous = $("input#anonymous").val();
   if (anonymous == 'on')
   {
       var anonymous_tmp = 'Y';
   }
   else
   {
       var anonymous_tmp = 'N';
   }

    var dataString = 
    'company=' + company +
    '&jobfunc=' + jobfunc +
    '&location=' + location +
    '&overall=' + overall +
    '&detail=' + detail +
    '&pros=' + pros +
    '&cons=' + cons +
    '&sr_mgmt=' + sr_mgmt +
    '&submitted_by=' + submitted_by +
    '&classof=' + classof + 
    '&school=' + school +
    '&anonymous=' + anonymous_tmp;

  alert (dataString);
  $.ajax(
  {
    type:"POST",
    url:"process.php",
    data:dataString,
    success:function() 
    {
      $('#testimonials').html("<div id='message'></div>");
      $('#message').html("<h2>Your information has been submitted!</h2>")
      .append("<p>Thank you for your help and support.</p>")
      .hide()
      .fadeIn(1500, function() 
      {
        $('#message').append("<img id='checkmark' src='images/check.png'/>");
      });
    }
  });
  return false;
});
});

use firebug for firefox or google chrome development tools or any other introspection tools by other browsers to see what happens. — Nemoden
– Nemoden, Commented Apr 10, 2012 at 1:39
agrees with @Nemoden, might as well try this plugin (malsup.com/jquery/form) so you won't have a hard time.. — rjmcb
– rjmcb, Commented Apr 10, 2012 at 1:50

marknatividad · Accepted Answer · 2012-04-10 01:58:42Z

1

Is process.php returning a 500 error and is it sitting in the root of your web app? You can find out by inspecting the developer console log in your browser, or change the function

success:function()

to

success:function(res, textStatus, jqXHR) {
console.log(res);
console.log(textStatus);
console.log(jqXHR);
}

and examine what's being returned.

Also, instead of manual constructing the form values, why don't you just use

$('id_of_form').serialize();

and just pass it to $.post?

Hope that helps.

answered Apr 10, 2012 at 1:58

marknatividad

6308 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

amey1908 Over a year ago

Hi Marck,Where do I see the output of console.log? I have process.php in the root file so that shouldn't be a problem. I have never used the serialize() option, but will look into it, seems to be a lot cleaner. Thanks for your prompt reply though.

amey1908 Over a year ago

Hi Mark, I just put wrote the output of console.log and I got the status as success. So I think process.php is being called but the sql statement in process.php doesn't seem to be working. Here are the contents of my process.php. I just have the $_POST variables defined and the sql query executed in process.php. Any idea why it is not getting executed.

marknatividad Over a year ago

@user1322955 can you please upload a snippet of process.php? cheers

Collectives™ on Stack Overflow

Ajax with submit form and php

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related