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
instead of this:
Try this way, it should work for you.
first do
console.log(data2)
try it, should print entire form ‘s data in console.