我正在创建一个使用AJAX提交的表单,然后使用$ _POST来获取表单的值并将其输入数据库。但是我不明白为什么我必须在表单的输入中定义动作,通常我只是在js中定义它。但是,如果这样做,我将无法访问$ _POST数据。有人可以解释为什么会发生这种情况。
这是我的代码;
js
jQuery(document).ready(function($){
jQuery('#add_event_form').on('submit', function(e){
e.preventDefault();
var form = $(this);
var form_data = form.serializeArray();
$.ajax({
url: ajax_url,
type: 'post',
data: form_data,
error : function(response){
console.log(response);
},
success : function(response){
}
});
});
});
php
<?php
add_action('wp_ajax_nopriv_add_event', 'add_event');
add_action('wp_ajax_add_event', 'add_event');
function add_event(){
global $current_user;
global $wpdb;
$user_id = $current_user->ID;
$event_name = sanitize_text_field($_POST['event_name']);
$wpdb->insert('wp_events', array(
'user_id' => $user_id,
'event_name' => $event_name,
) );
die();
}
?>
html
<form action="" method="POST" id="add_event_form">
<h3>ADD EVENT</h3>
<div class="form_row">
<label>Event Name
<input type="text" name="event_name" class="event_name required">
</label>
</div>
<input type="hidden" name="action" value="add_event">
</form>
下面是我通常如何定义我的动作的信息,为什么这不起作用?
jQuery(document).ready(function($){
jQuery('#add_event_form').on('submit', function(e){
e.preventDefault();
var form = $(this);
var form_data = form.serializeArray();
$.ajax({
url: ajax_url,
type: 'post',
// data: form_data,
data: {
action: 'add_event',
data: form_data,
},
dataType: 'json',
error : function(response){
console.log(response);
},
success : function(response){
}
});
});
});
这还没有完成,所以请原谅任何安全问题等。
答案 0 :(得分:1)
在JavaScript中,您拥有data: form_data
,这是一个包含{name: "event_name", value: "test"}
这样的对象的数组。这将导致以下结果:
$.ajax({
url: ajax_url,
type: 'post',
data: {
action: 'add_event',
data: [{name: "event_name", value: "test"}]
}
});
这行不通。
jQuery的ajax的data
属性应包含键值对,如下所示:
$.ajax({
url: ajax_url,
type: 'post',
data: {
action: 'add_event',
event_name: 'test'
}
});
编辑:如果您不想更改JavaScript代码,也可以使用以下方法在PHP中获取数据:
$data = $_POST['data']; // the 'data' array from jQuery's ajax call
$event_name = $data['event_name'];
但是,我不建议这样做。