在Wordpress中如何使用多種形式選擇添加和顯示數據？

Question

我正在使用選擇菜單來選擇“國家”->“州”->“區域”以顯示地圖。

如果選擇“國家/地區”>“要更改動態和其他區域的州”。

如何在WordPress中添加數據。 示例我需要添加一個國家/地區和區域並將其鏈接在一起。

例如：

國家：印度，新加坡。

州：印度>泰米爾納德邦

城市：印度>塔米爾杜>欽奈。

如何在WordPress中添加這個以及如何設置父？

Answer 1

為此，您有2個選項。

僅使用前端。 使用數據庫。

要僅使用前端，您可以執行以下操作

<select name="select1" id="select1">
    <option value="1">Fruit</option>
    <option value="2">Animal</option>
    <option value="3">Bird</option>
    <option value="4">Car</option>
</select>


<select name="select2" id="select2">
    <option value="1">Banana</option>
    <option value="1">Apple</option>
    <option value="1">Orange</option>
    <option value="2">Wolf</option>
    <option value="2">Fox</option>
    <option value="2">Bear</option>
    <option value="3">Eagle</option>
    <option value="3">Hawk</option>
    <option value="4">BWM<option>
 </select>

<input id="show-map" value="show-map" />

在你的javascript部分

$("#select1").change(function() { 
if($(this).data('options') == undefined){
    /*Taking an array of all options-2 and kind of embedding it on the select1*/
    $(this).data('options',$('#select2 option').clone());
    } 
var id = $(this).val();
var options = $(this).data('options').filter('[value=' + id + ']');
$('#select2').html(options);
});

$("#show-map").click(function(){
    //here you capture the input values and do what you need to do
});

因此，另一種選擇是使用DB，這比較復雜，但是基本上您需要這樣做，但是要用ajax獲取選擇值。

在wordpress中制作ajax非常簡單，只需在此處閱讀

https://premium.wpmudev.org/blog/using-ajax-with-wordpress/

它將允許您調用將在.change函數內部設置的ajax函數，如下所示

 $("#select1").change(function() { 
   //here you might want to get the value of this select to later associate it with your database, so do something like $(this).val();
$.ajax({url: "/your-url", success: function(result){
        $("#states").html(result);
    }});  
//you might get the select as a result of your ajax.. it should be easy to be done
 }