2

I seem to be having a strange issue with jQuery and a newly-created AJAX form/function. I'm pretty new to AJAX so please bear with me. Here's the jQuery:

jQuery('#wpuf_new_post_form').submit(function(e) {

    e.preventDefault();

    var data2 = jQuery('#wpuf_new_post_form').serialize();

    var ajaxurl = '<?php echo admin_url('admin-ajax.php'); ?>';

    jQuery.ajax({
        type: 'POST',
        url: ajaxurl,
        data: data2 + '&action=savedata',
        success: function(resp) {
            if(!resp){ alert ('Failed!')}else{ alert(data2) }
        }
    });

});

The above code takes the submission of my #wpuf_new_post_form form, serializes the data, then passes it through to my PHP function:

add_action('wp_ajax_nopriv_savedata', 'my_ajax_save_form');
add_action('wp_ajax_savedata', 'my_ajax_save_form');

function my_ajax_save_form(){

    $my_post = array(
        'post_title'    => $_POST['wpuf_post_title'],
        'post_content'  => $_POST['wpuf_post_content'],
        'post_type'     => $_POST['wpuf_post_type'],
        'post_status'   => 'publish',
    );

    wp_insert_post($my_post);

    $this_post_ID = wp_insert_post($my_post);

    add_post_meta($this_post_ID, 'cf_user-timestamp',  $_POST['cf_user-timestamp']);
    add_post_meta($this_post_ID, 'cf_project-id',  $_POST['cf_project-id']);
    add_post_meta($this_post_ID, 'cf_bin-id',  $_POST['cf_bin-id']);
    add_post_meta($this_post_ID, 'cf_status',  $_POST['cf_status']);
    add_post_meta($this_post_ID, 'cf_schedule-date',  $_POST['cf_schedule-date']);
    add_post_meta($this_post_ID, 'cf_reply-url',  $_POST['cf_reply-url']);
    add_post_meta($this_post_ID, 'cf_from-user',  $_POST['cf_from-user']);

}

Creating the post and post meta as shown above, via the AJAX submission, works just fine. The only three fields which refuse to work happen to be select form elements.

They are:

  • cf_project-id
  • cf_bin-id
  • cf_status

Again, all the other post meta submissions as depicted above, hit the database just fine. It's only the select form element values that do not.

Is there possibly a better way to handle the serialized value of select form elements?

PS: If it's of any value, here's an example of the serialized string that's being passed through as the jQuery variable data2. As you can see, the format doesn't differ from any of the other submitted form elements:

_wpnonce=537e4539cc&_wp_http_referer=%2Fajax%2F&wpuf_post_title=1395254005136&wpuf_post_content=Testing&cf_user-timestamp=March+19th+2014%2C+11%3A33%3A25+am&cf_project-id=3797&cf_bin-id=3325&cf_status=-status-today&cf_schedule-date=03%2F21%2F2014&cf_reply-url=&cf_from-user=&wpuf_post_type=post&wpuf_post_new_submit=yes

  • Have you examined $_POST content to see if there's something unexpected about it? I usually just send stuff to the server error log to have a look in this sort of context. For example: error_log(var_export($_POST, true)); – KenB Mar 20 '14 at 23:24
  • Can you also post your html form, especially the select elements? – sri Mar 21 '14 at 9:41
0

instead of this:

jQuery('#wpuf_new_post_form').submit(function(e) {

Try this way, it should work for you.

jQuery(document).on("submit", "#wpuf_new_post_form" , (function(e)) {

    var data2 = jQuery('#wpuf_new_post_form').serialize();

first do console.log(data2)

try it, should print entire form 's data in console.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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