Wordpress: POST to .php with Ajax

Question

I'm having a lot of trouble with getting this code working:

<script type = "text/javascript">

 jQuery(document).ready(function($){ 

 $('#submitbutton').click(function(){

     var email=document.getElementById('emailadd').value;
     var password=document.getElementById('pass').value;

     $.ajax({
     type: "POST",
     url: "/wp-content/themes/roots-master/login.php",
     data: {emailaddress:'email', password:'password'},
     dataType: "text",
     success:function(response){
     alert("success");
     }
     });
 });
}); 
</script>

When I comment out the $.ajax function, the javascript works fine(I tested it with an alert). However, the $.ajax part doesn't seem to be working. Does anybody have any suggestions?

When I change the code to the following, the javascript appears to not work as well:

   $('#submitbutton').click(function(){

     var email=document.getElementById('emailadd').value;
     var password=document.getElementById('pass').value;
     $.ajax({
     alert(password);
     });
     });

I am using wordpress so I didn't put any links to jquery in the head. Instead, I put the following into my functions.php and then jquery started working.

wp_deregister_script('jquery');
wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery               /1/jquery.min.js', false, '1.9.1', false);
wp_enqueue_script('jquery');

UPDATE: For some reason, when I put an alert after the $.ajax, it works!

jQuery(document).ready(function($){ 
$('#submitbutton').click(function(){
     var email=document.getElementById('emailadd').value;
     var password=document.getElementById('pass').value;
     $.ajax({
     dataType: "html",
     type: "POST",
     evalScripts: true,
     url: "/wp-content/themes/roots-master/login.php",
     data: {emailaddress:'email', password:'password'},
     dataType: "text",
     success:function(){
     alert("success");
     }
     });
     alert("testing");
 });
});

Does anyone know why this would be?

what isn't working ? is the request launched ? is it landing ? what is the response ? Have you considered debugging it with, for example, firebug ? — Laurent S.
– Laurent S., Commented Oct 15, 2013 at 17:05
The alert is not being triggered. Also, When I put an alert in the code(above the $.ajax code) that alert does not work. — pj409
– pj409, Commented Oct 15, 2013 at 17:12
And do you have any error message in the console ? Also, are you sure you're loading jquery before doing this ? it's hard to say as you don't post much ... — Laurent S.
– Laurent S., Commented Oct 15, 2013 at 17:14
I updated my post. I'm doing this through wordpress, so i don't link to any scripts in the head. — pj409
– pj409, Commented Oct 15, 2013 at 17:20

pj409 · Accepted Answer · 2013-10-15 17:39:15Z

1

Solved it!! It should have looked like this:

 $('#submitbutton').click(function(j){
     j.preventDefault();

I was missing the preventDefault()...doh!

answered Oct 15, 2013 at 17:39

pj409

3372 gold badges9 silver badges21 bronze badges

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

Collectives™ on Stack Overflow

Wordpress: POST to .php with Ajax

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related