Question

我正在使用 Flask（Python）创建一个潜在客户表单，用户可以在其中注册潜在客户。我有两个字段都来自数据库，第一个是类别（父级），第二个是产品（子级）。

产品领域应该依赖于类别。

模板中的

代码：

<label>Product Category</label>
<select class="form-control" name="product_category">            
    <option value=""></option>{% for r in catagory_name %}
    <option value="{{ r.catagory_name }}">{{ r.catagory_name }}</option>{% endfor %}
</select>


<label>Product</label>
<select class="form-control" name="product">            
    <option value=""></option>{% for r in product_name %}
    <option value="{{ r.product_name }}">{{ r.product_name }}</option>{% endfor %}
</select>

现在，当用户点击“类别”时，我想要的是，只显示所选类别的产品，并且应该隐藏休息而不刷新页面。

感谢。

Answer 1

首先获取父数据的id。然后查询子数据。你可以使用ajax get请求。然后迭代下拉列表中的每个项目。

以下是一个例子

JQUERY:

$(#PARENT).on('click', function(){
	var parent= $('#PARENT').find('option:selected').text();

	$.getJSON({ type: "GET",   
	    url: "<?php echo base_url('url to query the product of category')?>",   
	    async: false,
	    data: { name:parent },
	    dataType: 'json',
	    success : function(data)
	    {   
	        var child = $('#CHILD')
	        parent_child = jQuery.parseJSON(data);
	        child.html('');
	        $.each(parent_child, function(key,value) {
	            if(value.isActive == 1){
	                var child_option = $('<li><a class="gear-category" data-key="'+value.gearID+'" href="javascript:void(0)">'+value.gearName+'</a></li><li class="divider"></li>');
	                child_option.data('index', key);
	                child.append(child_option);

	            }
	        });
	    },
	    error: function(e)
	    {
	    console.log(e);
	    }

	});	
});

HTML :


    <label>Product Category</label>
<select ID="PARENT" class="form-control" name="product_category">            
    <option value=""></option>{% for r in catagory_name %}
    <option value="{{ r.catagory_name }}">{{ r.catagory_name }}</option>{% endfor %}
</select>


<label>Product</label>
<select ID="CHILD" class="form-control" name="product">            
    <option value=""></option>{% for r in product_name %}
    <option value="{{ r.product_name }}">{{ r.product_name }}</option>{% endfor %}
</select>

PS：抱歉，如果答案不清楚的话。我是stackoverflow的新手

如何根据Flask（Python）中的另一个选择选项显示select选项？

1 个答案: