这是我从数据库中获得的下拉选择。
<div class="col-sm-12">
<div class="form-group">
<div class="col-sm-12">
<label class="control-label col-sm-5">Project Choice
<span>*</span>
</label>
<div class="col-md-7">
<select class="form-control" id="category" name="project_choice" required>
<?php
$the_query = array(
\'orderby\' => \'name\',
\'order\' => \'ASC\',
\'parent\' => 0
);
$categories = get_categories($the_query);
foreach ($categories as $category) {
?>
<option value="<?php echo $category->term_id; ?>"><?php echo $category->name; ?></option>
<?php
}
?>
</select>
</div>
</div>
</div>
</div>
这是我的结果部分,它与上面的类别部分相关联。
<div class="col-sm-12">
<div class="form-group">
<div class="col-sm-12">
<label class="control-label col-sm-5">Program
<span>*</span>
</label>
<div class="col-md-7" id="results">
</div>
</div>
</div>
</div>
这是我为预期用户编写的排队脚本。
function my_enqueue() {
wp_enqueue_script(\'ajax-script\', get_template_directory_uri() . \'/js/main.js\', array(\'jquery\'), \'\', true);
wp_localize_script(\'ajax-script\', \'main\', array(\'ajax_url\' => admin_url(\'admin-ajax.php\')));
}
这是我的主要任务。js文件脚本
$(document).ready(function () {
$(\'#category\').change(function () {
$.ajax({
url: ajax_object.ajaxurl,
type: \'POST\',
dataType: "html",
data: {
\'action\': \'get_program_by_category\', // this is name of your function that gets trigger
\'datas\': category // valuse you want to pass
},
success: function (data) {
debug(data); // result that return from function
console.log(data);
},
});
});
});
最合适的回答,由SO网友:cowgill 整理而成
我看到的第一个问题是ajax url不正确。你的wp_localize_script()
句柄名称为“main”,而不是“ajax\\u object”。
url: main.ajaxurl
另外,处理
get_program_by_category
ajax操作?你错过了两个动作。
add_action( \'wp_ajax_my_action\', \'my_action_callback\' );
add_action( \'wp_ajax_nopriv_my_action\', \'my_action_callback\' );
请参阅WordPress Codex以了解有关使用
AJAX API.
Update #1
尝试使用此进行调试。您应该会得到一个弹出窗口,告诉您“成功”或“失败”。此外,数据将记录到浏览器控制台。
$.ajax( {
url: main.ajaxurl,
type: \'POST\',
dataType: "html",
data: {
\'action\': \'get_program_by_category\',
\'datas\': category
}
} ).done( function (r) {
console.log(r);
if ( r.success ) {
alert( \'Success!\' );
} else {
alert( \'Failed!\' );
}
} );