0

从标题可以理解，这个有点复杂，但其实不应该。我确信这是一个简单的解决方法，我只是无法绕过它。

我有选择的框A，填充了Select Box B的组合标准填充列表A和列表B。当Select Box A更改时，适当的信息加载到Select Box B中，列表也应填充。目前，列表仅在选择框 B更改时才会填充。

它设置为在页面加载时加载第一个框 A/B 组合的列表。我需要对其进行设置，以便当框 A 更改（并且框 B 自动更改）时，会为框 A/B 标准加载列表。

我认为正在发生的是，当我尝试将任何类型的处理程序附加到框 B（或真正的框 A）时，它会查看框 B 中先前加载的信息，而不是框 A 更改时新加载的信息。我需要它来查看新的 A/B 组合。

我尝试了各种处理程序，javascript、jQuery：.onChange、.load、.live、.focus，但我认为除非它在框 B 中获取新值而不是旧值，否则任何事情都不会起作用。我在 javascript 和 .jsp 中的文档就绪函数中尝试了所有这些：

<span class="caption">Business Unit</span>
<select style="margin-bottom: 20px" onchange="loadRatingPlans()"
    name="cde_bus_unit" id="cde_bus_unit">
<c:forEach items="${divisions}" var="division">
    <option value="${division.cdeBusUnit}">${division.nmeBusUnit}
</option>
</c:forEach>
</select>

<span class="caption">Rating Plan</span>
<select style="margin-bottom: 20px" onchange="loadAvailableLimitInfo(); 
    loadBURPLimitInfo()" 
    name="cde_rating_plan" id="cde_rating_plan">
<c:forEach items="${ratingPlans}" var="ratingPlan">
    <option value="${ratingPlan.cdeRatingPlan}">${ratingPlan.nmeRatingPlan}
    </option>
</c:forEach>
</select>

当物理选择框 B 时，这会成功更改 LimitInfo（列表 A 和 B）。当仅列出 A 更改时，如何使其执行相同的操作？有什么问题可以问我！！谢谢！

这是javascript的代码：

//populate the Rating Plans box based on the Business Unit
function loadRatingPlans() {
var busUnit = $('select[name="cde_bus_unit"]').val();

$.ajax({
    type : 'GET',
    url : 'loadRatingPlans.do',
    dataType : 'json',
    data : {
        busUnit : busUnit
    },
    success : function(data) {
        console.log(data);
        //get rid of old rating plans
        $('[name=cde_rating_plan]').empty();
        //load new rating plans
        if (data != null) {
            data.forEach(function(rp) {
                $('<option>').text(rp.nmeRatingPlan).val(rp.cdeRatingPlan)
                        .appendTo('[name=cde_rating_plan]');
            }); // end forEach
        }// end if

    } // end success
});// end ajax

}// end uploadRatingPlans

//load the available limits based on which are already assigned
function loadAvailableLimitInfo() {
var cdeBusUnit = $('#cde_bus_unit').val();
var cdeRatingPlan = $('#cde_rating_plan').val();

$.ajax({
    type : 'GET',
    url : 'loadAvailableLimitInfo.do',
    dataType : 'json',
    data : {
        cdeBusUnit : cdeBusUnit,
        cdeRatingPlan : cdeRatingPlan
    },

    success : function(data) {
        console.log(data);

        $('#limAvailable').empty();

        var i;
        for (i = 0; i < data.length; i++){
            $('#limAvailable').append('<li class="limit-list" id="' 
                    + data[i].cdeLimit + '">' + data[i].nmeLimit + '</li>');
            $('#limAvailable').append('\n');
        }

    } // end success
});// end ajax

}// end loadDivisionInfo

//load the assigned limits
function loadBURPLimitInfo() {
var cdeBusUnit = $('#cde_bus_unit').val();
var cdeRatingPlan = $('#cde_rating_plan').val();

$.ajax({
    type : 'GET',
    url : 'loadBURPLimitInfo.do',
    dataType : 'json',
    data : {
        cdeBusUnit : cdeBusUnit,
        cdeRatingPlan : cdeRatingPlan
    },

    success : function(data) {
        console.log(data);

        $('#limAssigned').empty();

        var i;
        for (i = 0; i < data.length; i++){
            if(data[i].indDefault = -1){
            $('#limAssigned').append('<li class="limit-list, 
                    assigned-li-default" id="' 
                    + data[i].cdeLimit + '">' + data[i].nmeLimit + '</li>');
            $('#limAssigned').append('\n');
            }
            else{
            $('#limAssigned').append('<li class="limit-list" id="' 
                    + data[i].cdeLimit + '">' + data[i].nmeLimit + '</li>');
            $('#limAssigned').append('\n'); 
            }
        }

    } // end success
});// end ajax
4

1 回答 1

0

我解决了。答案是创建一个仅基于第一个框的值返回列表的方法。我去数据库并获取第二个框的列表值，然后根据第二个列表中的第一个值返回列表。我已经设置了一种方法来执行此操作，用于根据页面加载时第一个和第二个框中的第一组值加载列表。

于 2013-05-26T01:15:53.620 回答