Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

I've been working at this for weeks without success. I've figured out problem after problem with the code, but none of the corrections seem to fix my core problem. The form doesn't insert anything into the database and I don't know why. In this particular example, submit results in going to the following url: (myurl)/?dname=kl&age=56&action=postlesson. The home page is what loads. I am piecing this together from examples and tutorials on the web.

I'm new to ajax and to wordpress plugins so I might be missing something obvious. Please help me know where I am going wrong.

The enqueues:

add_action(
'plugins_loaded',
array ( B5F_SO_13498959::get_instance(), 'plugin_setup' )
);

class B5F_SO_13498959
{
private $cpt = 'post'; # Adjust the CPT
protected static $instance = NULL;
public $plugin_url = '';
public function __construct() {}

public static function get_instance()
{
    NULL === self::$instance and self::$instance = new self;
    return self::$instance;
}

/**
 * Regular plugin work
 */
public function plugin_setup()
{
    $this->plugin_url = plugins_url( '/', __FILE__ );
add_shortcode('the_content', array($this, 'show_form'));
    add_action( 'wp_enqueue_scripts', array( $this, 'enqueue' ) );
    add_action( 'wp_ajax_postlesson', array( $this, 'postlesson' ) );
    add_action( 'wp_ajax_nopriv_postlesson', array( $this, 'postlesson' ) );
}


public function enqueue()
{
//Include Javascript library
wp_enqueue_script('lessonupload', "{$this->plugin_url}demo.js" , array( 'jquery' ));
// including ajax script in the plugin Myajax.ajaxurl
wp_localize_script( 'lessonupload', 'MyAjax', array( 'ajaxurl' => admin_url( 'admin-ajax.php')));
}

The form:

public function show_form(){
?>
<form type="post" name="submitlesson" action="" id="submitlesson">
<input type="text" name="dname" id="dname" />
<input type="age" name="age" id="age" />
<input type="hidden" name="action" value="postlesson" />
<input type="submit" /> 
</form>
<div id="feedback">
</div>
<?php
}

The jQuery:

jQuery(document).ready(function($)
{
$('#postlesson').submit(ajaxSubmit);
function ajaxSubmit() {
var submitlesson = $(this).serialize();

$.ajax({
type: "POST",
url: MyAjax.ajaxurl,
data: submitlesson,
success: function(data) {
$("#feedback").html(data);
}
});
}

return false;
});

The php:

public function postlesson(){
global $wpdb;
$name = $_POST['dname'];
$age = $_POST['age'];

if($wpdb->insert('wp_demo',array(
'dname'=>$name,
'age'=>$age
))===FALSE) {
echo "error";
}
else {
echo "success";
}
die();
}

}
share|improve this question
    
MyAjax.ajaxurl shouldn't be quoted in your jQuery ajax arguments. –  TheDeadMedic May 24 at 15:16
    
Thanks. I changed that, but it didn't have any effect. –  user1497158 May 24 at 15:19
    
Use a HTTP inspector like HttpFox to check the data is correctly sending to the correct URL and see what the server is responding with. –  TheDeadMedic May 24 at 15:21
    
I don't really know how to make sense of some of the debugger tools, but from what I can tell, when I click submit, it does run the demo.js from the correct path, but I get "none" for POST data and 304 not modified for the status line of the script under response header. I don't see admin-ajax.php though under scripts responding and I'm wondering if I should. Thanks for the help with this. –  user1497158 May 24 at 15:37
    
Yes, you should. Check that MyAjax.ajaxurl is the correct URL - use a JavaScript alert or a browser console. Next make sure that your demo.js isn't cached (usually F5 in a browser) –  TheDeadMedic May 24 at 18:59

1 Answer 1

I never did figure out how to do this with serialize or formData, but I figured out two other ways to do it. The easiest is to just skip this step altogether and in the action and js url list the url to a php file like you might do if you weren't in wordpress. I then added this line to the top of it and it worked. require_once( '../../../wp-load.php' ); This is unadvised because of server load and some other reasons I don't fully understand, but it works.

The second way, if you don't need to serialize or upload a file, is to do this:

jQuery(document).ready(function(){
jQuery("#submit").click(function(){
var name = jQuery("#dname").val();
var age = jQuery("#age").val();
var File = jQuery("#myfile").val();
jQuery.ajax({
type: 'POST',   // Adding Post method
url: MyAjax.ajaxurl, // Including ajax file
data: {"action": "postlesson", "dname":name, "age":age, "myfile":File}, // Sending data dname to post_word_count function.
success: function(response){ // Show returned data using the function.
jQuery("#feedback").html(response);
}
});
jQuery('[name="age"]').val('');  // sets the field back to empty
jQuery('[name="dname"]').val('');
jQuery('[name="myfile"]').val(''); 
});
});

I'm just posting this in case someone as clueless as me comes looking. This all meant changing the form too. I don't have that code ready, but essentially, I just got rid of the hidden submit field.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.