我试图在WordPress中使用ajax。我在单个会议中有两个组合框。php第二个组合框值基于第一个组合框中的选择
这是我的single-meetings.php
<form action="#" name="form" id="form" method="post">
<div id="check-in-date-wrap">
<select name="search_category" id="check-in-date">
<option value="03/10/2015">"03/10/2015"</option>
<option value="03/11/2015">"03/11/2015"</option>
<option value="03/12/2015">"03/12/2015"</option>
<option value="03/13/2015">"03/13/2015"</option>
</select>
<div id="check-out-date-wrap">
// a combobox should be created here
</div>
<img src="loader.gif" style="margin-top:8px; float:left" id="loader" alt="" />
<input type="submit" name="" value="GO" />
</form>
我还有另外两个文件,php和js
这是我的php代码combo_check-out.php
<?php
function iRange($first, $last, $format = \'m/d/Y\' ) {
$dates = array();
$current = strtotime($first);
$i=1;
while( $i <= $last ) {
$dates[] = date($format, $current);
$current = strtotime(\'+1 day\', $current);
$i++;
}
$time = date("m/d/Y",$current);
return $time;
}
if($_REQUEST)
{
$id = $_REQUEST[\'parent_id\'];
?>
<select name="check-out" id="check-out-date">
<option value="<?php echo iRange($id, 1, $format = \'m/d/Y\' ) ?>">"1 Day (Same Day)"</option>
<option value="<?php echo iRange($id, 2, $format = \'m/d/Y\' ) ?>">"2 Days"</option>
<option value="<?php echo iRange($id, 3, $format = \'m/d/Y\' ) ?>">"3 Days"</option>
<option value="<?php echo iRange($id, 4, $format = \'m/d/Y\' ) ?>">"4 Days"</option>
</select>
<?php}?>
这是我的js代码
combo_checkout_iRange.js
$(document).ready(function() {
$(\'#loader\').hide();
$(\'#check-in-date\').change(function(){
$(\'#check-out-date-wrap\').fadeOut();
$(\'#loader\').show();
$.post("combo_check-out.php", {
parent_id: $(\'#check-in-date\').val(),
}, function(response){
setTimeout("finishAjax(\'check-out-date-wrap\', \'"+escape(response)+"\')", 400);
});
return false;
});
});
//JQuery to hide Loader and return restults
function finishAjax(id, response){
$(\'#loader\').hide();
$(\'#\'+id).html(unescape(response));
$(\'#\'+id).fadeIn();
}
function alert_id()
{
if($(\'#check-out-date\').val() == \'\')
alert(\'Please select a sub category.\');
else
alert($("#check-out-date").val());
return false;
}
他们在wordpress之外工作得很好
如何将它们整合到wordpress主题中
Note: 这应该适用于称为“会议”的帖子类型,所以这是我写的function.php
add_action("wp_enqueue_scripts", function() {
if (is_single()) {
if (get_post_type() == \'meetings\')
{
wp_enqueue_script(\'combo_checkout_iRange\', get_template_directory_uri() . \'/js/combo_checkout_iRange.js\', array( \'jquery\' ), \'1.0\' ,true);
}
}
});
SO网友:Stas Arshanski
首先,当我想编写AJAX代码时,我通过添加一个可从js访问的AJAX url来启动AJAX注册。
wp_localize_script( "combo_checkout_iRange", "server_obj", array(
"ajax_url"=>admin_url("admin-ajax.php")
) );
从javascript文件中,我可以这样调用ajax服务器:
jQuery.post(server_obj.ajax_url, {\'action\':\'The_ajax_action_name\'},function(return) {})
要在PHP中创建一个函数来处理请求并将数据返回给客户端,请在函数中添加以下行。php文件:
add_action(\'wp_ajax_The_ajax_action_name\', \'The_ajax_action_name_ajax\'); // for logged in user
add_action(\'wp_ajax_nopriv_The_ajax_action_name\', \'The_ajax_action_name_ajax\'); // if user not logged in
function The_ajax_action_name_ajax() {}
因此,“The\\u ajax\\u action\\u name”是ajax操作参数名称,是wp action hook的后缀,名为wp\\u ajax\\u0{name\\u goes\\u here}