下拉列表谁加载产品woocommerce

我建立我的自定义WordPress模板页面，我想做一个下拉列表（或其他人）与选定的产品，谁选择，出现在页面的底部！下拉列表谁加载产品woocommerce

目前，我我发现最好的方法是：

<form action="" method="get"><select name="type"> 
<option selected >product</option> 
</form>

，并在页面中一个div底部：

<?php 

if(isset($_GET['type'])) 

    echo do_shortcode('[product_page id="'.$_GET['type'].'"]'); 

else 

?>

的代码做这项工作，但我不还满意！如果插件已经存在短代码，我也会接受！

编辑：我想加载没有重新加载页面的产品！

在此先感谢！

来源

2017-04-11 Efbi

Ajax是做到这一点的方式。它也有助于了解一些jQuery，所以当JavaScript获取数据时，它可以定位一个元素并将其显示在那里。你可以在页面模板，脚本标签内放入类似的东西，并在下拉改变时调用它。

jQuery.ajax({ 
    url:"/wp-admin/admin-ajax.php", 
    type:'POST', 
    data:{ 
     action : 'display_product', 
     prod_id : jQuery(this).val() 
    }, 
    success:function(results) { 
     jQuery("#product_display").html(results); 
    } 
});

然后将PHP函数添加到functions.php中，例如，

add_action('wp_ajax_nopriv_display_product', 'display_product'); 
add_action('wp_ajax_display_product', 'display_product'); 

function display_product() { 
    if(isset($_POST['prod_id'])) { 
     echo do_shortcode('[product_page id="'.$_POST['prod_id'].'"]'); 
    } 
    die(); 
}

来源

2017-04-11 21:06:17 Lemonaise

嗨，如果你这样做，产品ID将不会传递给getProduct函数。尝试使用jQuery来定位下拉列表，而不是使用onchange。 jQuery（this）.val（）'然后应该有选定的值 – Lemonaise

你好，谢谢，我已经有了jQuery（'form select'）。改变一些东西，但它的作品..但出现了很多问题，所以我认为我会暂时保持正常！ – Efbi

没问题。无论如何，很高兴它有帮助。 – Lemonaise

所有你需要添加到代码，是每个下拉选项关闭</select>，一个onchange JavaScript函数和value=""。

<form action="" method="get"> 
    <select name="type" onchange="this.form.submit()"> 
     <option selected value="123" >product 1</option> 
     <option selected value="456" >product 2</option> 
    </select> 
</form>

来源

2017-04-11 15:19:06 Lemonaise

您好，感谢您的回答 1）我改变我的问题 2）平变化功能提交不起作用（（指数）：1049遗漏的类型错误：this.form.submit不是一个函数在HTMLSelectElement.onchange（（index）：1049）） – Efbi

嗨，没问题。使用'name =“submit”'检查表单中没有元素。另外，确保在'this.form.submit（）' – Lemonaise

末尾有两个括号'（）'，谢谢！你知道一种提交方式，无需重新加载页面吗？我尝试ajax，但我不是很强大它 – Efbi

下拉列表谁加载产品woocommerce

回答

相关问题