java - 下拉更改时基于 Jquery Ajax 调用服务器端方法启用/禁用复选框

Question

寻找一种在下拉选择更改时调用服务器端方法(Java)的方法，并根据服务器输出(真或假)，启用或禁用几个复选框。如果有人可以提供相同的建议，我将不胜感激。

Answer 1

我编写了一个快速示例来向您展示如何完成此操作。首先，您需要设置 Java 应用程序以允许 ajax 调用。 java 应用程序需要接受单个 post 变量名称 selected 作为输入，它是下拉菜单中所选选项的值。然后，java 应用程序也需要返回格式类似的 json 字符串:

{
    "disabled":[
        "1",
        "3",
        "5"
    ]
}

1、3 和 5 代表您想要禁用的复选框的 ID。这些可以是任何复选框的任何 ID。如果它不在该数组中，则它将默认设置为启用。

HTML:

<select id="choiceSelector">
    <option value="1">Something 1</option>
    <option value="2">Something 2</option>
</select>

<br/><br/>
<div id="changingCheckboxes">
    <input type="checkbox" name="" id="1"><br/>
    <input type="checkbox" name="" id="2"><br/>
    <input type="checkbox" name="" id="3"><br/>
    <input type="checkbox" name="" id="4"><br/>
    <input type="checkbox" name="" id="5"><br/>
    <input type="checkbox" name="" id="6">
</div>​

Javascript/jquery

function UpdateCheckBoxStatus ()
{
    var CurrentChoice = $('#choiceSelector').val();

    $.ajax({
        url: "####YOUR JAVA APP URL####",
        data: { "selected": CurrentChoice },
        type: "post",
        dataType: "json",

        success: function (data)
        {
            SetCheckbox($('#changingCheckboxes').children("input:[type='checkbox']"), true);
            $.each(data.disabled, function ()
            {
               SetCheckbox($('#changingCheckboxes #' + this), false);
            });
        }
    });

}

/// Sets the checkbox to enabled or disabled
/// @param th Jquery reference of one or more checkboxes
/// @param usable True/False if the checkbox is enabled/disabled
function SetCheckbox (th, usable)
{
    if (usable)
        th.removeAttr("disabled");
    else if (!usable)
        th.attr("disabled", true);
}


$(function ()
{
    $('#choiceSelector').change(UpdateCheckBoxStatus);
    UpdateCheckBoxStatus(); //run for page load
});

另外，这是它的jsfiddle:http://jsfiddle.net/bpstw/1/

希望有帮助。