下拉列表誰加載產品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

回答

相關問題