我在Wordpress前端页面上有一个表单:
<form name="declare_availability_form" id="declare_availability_form" action="#" method="post">
<?php wp_nonce_field( 'declare_availability' ); ?>
<input type="hidden" name="declare_availability_playerid" id="declare_availability_playerid" value="<?php echo $id ?>">
<input type="hidden" name="declare_availability_date" id="declare_availability_date" value="<?php echo $date ?>">
<input type="hidden" name="declare_availability_avail" id="declare_availability_avail" value="<?php echo $avail ?>">
<input type="hidden" name="action" value="declare_availability">
<textarea id="declare_availability_message" name="declare_availability_message"></textarea>
<input type="submit" name="declare_availability_sub">
</form>
<div id="declare_availability_feeback"></div>
这是我在functions.php
中注册脚本的方式:
<?php
wp_register_script('html5blankscripts', get_template_directory_uri() . '/js/scripts.js', array('jquery'), '1.0.0'); // Custom scripts
wp_localize_script( 'html5blankscripts', 'example_ajax_obj', array( 'ajax_url' => admin_url( 'admin-ajax.php' ) ) );
wp_enqueue_script( 'html5blankscripts' ); // Enqueue it!
这是我的javascript:
$('#declare_availability_form').submit(function(event) {
event.preventDefault();
$(" #declare_availability_feeback ").hide();
var ajax_form_data = $("#declare_availability_form").serialize();
$.ajax({
url: example_ajax_obj.ajaxurl,
type: 'post',
data: ajax_form_data
}).done( function( data ) {
$(" #add_fixture_feeback ").html( "<h2>Thank you - you have registered your availability</h2>");
$(" #add_fixture_feeback ").show('slow');
setTimeout(function() {
$(" #add_fixture_feeback ").hide('slow');
}, 5000);
}).fail( function() {
$(" #add_fixture_feeback ").html( "<h2>Something went wrong, please contact the DoR.</h2>" );
$(" #add_fixture_feeback ").show('slow');
}).always( function() {
event.target.reset();
});
});
...这是我的php函数,位于从functions.php链接到的文件中:
<?php
add_action( 'wp_ajax_declare_availability', 'declare_availability' );
add_action( 'wp_ajax_nopriv_declare_availability', 'declare_availability' );
function declare_availability () {
if( isset( $_POST['_wpnonce'] ) && wp_verify_nonce( $_POST['_wpnonce'], 'declare_availability') ) {
if ( isset( $_REQUEST ) ) {
$date = sanitize_text_field( $_REQUEST['declare_availability_date']);
$id = intval( sanitize_text_field( $_REQUEST['declare_availability_playerid']));
$avail = sanitize_text_field( $_REQUEST['declare_availability_avail']);
$message = sanitize_text_field( $_REQUEST['declare_availability_message']);
global $wpdb;
$wpdb->insert('tbl_selections', array(
'selections_player_id' => $id,
'selections_team' => '',
'selections_position' => '',
'selections_date' => $date,
'selections_confirmed' => $avail,
'selections_drop_goals' => 0,
'selections_penalties' => 0,
'selections_tries' => 0,
'selections_conversions' => 0,
'selections_comments' => $message,
'selections_rating' => '',
'selections_yellow_card' => '',
'selections_red_card' => ''
));
}
}
else {
wp_die( '<pre>Invalid nonce specified</pre>' );
}
die();
}
我在javascript的表单提交操作上设置了一个断点,并在event.preventDefault()上设置了第二个断点;线。当我单击提交按钮提交表单时,它在第一个断点处停止。当我再次按播放时,它不会到达第二个断点。我已进行了尽可能多的搜索以尝试找到解决方案,但没有运气。谁能发现我的错误? 预先感谢。
答案 0 :(得分:0)
尝试此代码。
您的Ajax脚本错误。
我只是替换这段代码。
$.ajax({
type : "POST",
url : example_ajax_obj.ajaxurl,
data : {"action": "declare_availability","formData":formData},
success: function(response) {
alert("Your vote could not be added");
alert(response);
}
})
更新代码
$('#declare_availability_form').submit(function(event) {
event.preventDefault();
$(" #declare_availability_feeback ").hide();
var ajax_form_data = $("#declare_availability_form").serialize();
$.ajax({
type : "POST",
url : example_ajax_obj.ajaxurl,
data : {"action": "declare_availability","formData":formData},
success: function(response) {
alert("Your vote could not be added");
alert(response);
}
})
.done( function( data ) { // response from the PHP action
$(" #add_fixture_feeback ").html( "<h2>Thank you - you have registered your availability</h2>");
$(" #add_fixture_feeback ").show('slow');
setTimeout(function() {
$(" #add_fixture_feeback ").hide('slow');
}, 5000);
})
.fail( function() {
$(" #add_fixture_feeback ").html( "<h2>Something went wrong, please contact the DoR.</h2>" );
$(" #add_fixture_feeback ").show('slow');
})
.always( function() {
event.target.reset();
});
});