0

I am trying to insert a new post with a simple ajax form in a wordpress plugin. Visitors will use this form to create posts from frontend.

My form is like this:

<script>
jQuery( document ).ready(function() {
    jQuery('input[type=submit]').on('click', function() {
        var ajaxurl = 'https://example.com/wp-admin/admin-ajax.php';
        jQuery.ajax({
            type: "POST",
            data: jQuery('.event-form').serialize(),
            url: ajaxurl,
            success: function(result) {
                console.log('data sent!');
                console.log('sent to: ' + templateDir + loadUrl );
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.log(jqXHR + " :: " + textStatus + " :: " + errorThrown);
            }
        });
    });
});
</script>

<form id="msform" name="review_form" class="form-horizontal event-form" action="/create-event" method="POST" enctype="multipart/form-data">
        <input type="text" name="title" placeholder="title">
        <textarea rows="4" name="desc" placeholder="Description"></textarea>
        <select name="category">
          <option value="volvo">Volvo</option>
          <option value="saab">Saab</option>
          <option value="opel">Opel</option>
          <option value="audi">Audi</option>
        </select>
        <input type="hidden" name="userID" id="userID" value="<?php get_current_user_id(); ?>">
        <input type="submit" name="submit" class="submit action-button" value="Submit"/>
</form>

This is the php ajax function

function save_post () {
    ini_set('display_errors', 1); 
    error_reporting('E_ALL');

    $new_post = array(
                'post_title'    => $_POST['title'],
                'post_author'   => $_POST['userID'],
                'post_content'  => $_POST['desc'],
                'post_category' => array($_POST['category']),
                'post_status'   => 'publish',           
                'post_type' => 'post'  
        );

    $post_id = wp_insert_post($new_post);
}
add_action('wp_ajax_nopriv_save_post','save_post');
add_action('wp_ajax_save_post','save_post');

I am getting the following error message in the console when I click the submit button:

[object Object] :: error :: Bad Request

What am I doing wrong?

0

Finally found the problem. The action: save_post was missing from data in ajax call. This code works:

  <script>
    jQuery( document ).ready(function() {
        jQuery('input[type=button]').on('click', function() {
            var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
            jQuery.ajax({
                type: "POST",
                data: {
                    data:jQuery('.event-form').serialize(),
                    action: 'save_post'
                },
                url: ajaxurl,
                success: function(result) {
                    console.log('data sent!');
                    console.log('sent to: ' + templateDir + loadUrl );
                },
                error: function(jqXHR, textStatus, errorThrown) {
                    console.log(jqXHR + " :: " + textStatus + " :: " + errorThrown);
                }
            });
        });
    });
   </script>
-1

Your form calls action 'create-event', your ajax function is 'save_post'. Tell your ajax script which action (method/function) to use. I think it never reaches 'save_post'.

  • So I don't know who voted my answer down and why. – moped Feb 12 at 6:58

Your Answer

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

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