0

可能重复:
如何在第一个下拉列表更改后从数据库加载第二个下拉列表

嘿,我有一个表格,里面有两个选择下拉菜单。

第一个选择填充了用户的投资组合,第二个选择需要填充投资组合组。我得到登录用户的所有投资组合并用这些投资组合填充第一个选择现在我想在第一个选择的基础上用组填充第二个选择,例如,如果用户选择投资组合_1,投资组合_1 中的所有组应该在第二个选择框中加载。

投资组合的第一个选择是:

<select id="portfolios" name="portfolio" style="width: 200px; height:25px;">
    <option selected="selected" value="default">Select Portfolio</option>
    {% for portfolio in portfolios %}
        <option value={{ portfolio.id }}>{{ portfolio.portfolioName }}</option>
    {% endfor %}
</select> 

我的理解是我需要在该 ajax 中调用第一个选择的 ajax 函数 onchange 我需要发送选定的投资组合 id 并找到具有该 id 的所有组,然后返回所有这些组并只更新第二个选择框团体,

我不知道如何用我将得到的组填充第二个选择

有任何想法吗?

谢谢

4

2 回答 2

0
<select id="portfolios" name="portfolio" style="width: 200px; height:25px;" onchange="getgropus(this.value)">
<option selected="selected" value="default">Select Portfolio</option>
{% for portfolio in portfolios %}
    <option value={{ portfolio.id }}>{{ portfolio.portfolioName }}</option>
{% endfor %}
</select>
<select id="secondselectBox" name="secondselectBox"  ></select>

call the ajax function on the onchange event of your 1st selectbox
// here is JS code

<script type="text/javascript">
function getgropus(id){
        $.ajax({
            type: 'post',
            url: "your php file path to get groups ",
            data: "&id="+id,
            complete: function(data) {
                $('#secondselectBox').html(data.responseText)
            }
        });
}

</script>

on your php file make options for selectbox of group portfolio and adjust according to your requirnments

<option value="default">Portfolio groups</option>
 .......
于 2012-08-21T12:40:48.397 回答
0

好吧,我只会以 JSON 格式返回它们,然后将它们注入 DOM:

$('#portfolios').on('change', function(){
   $.getJSON('url/for/groups', function(pgroups) {
       var html = '';

       $.each(pgroups, function(value, name) {
           html += '<option value="'+value+'">'+name+'</option>';
       });

       $('#portfolio-groups').html(html);
   });
});
于 2012-08-21T12:40:52.907 回答