仅当Ajax Call返回Success时才更改单选按钮

时间:2013-05-14 06:53:40

标签: javascript html ajax javascript-events radio-button

在HTML表单中,我有一组单选按钮。在onchange()事件中,它通过Ajax调用推送其值。

然后,Ajax调用将命中服务器,并根据调用发送的值进行处理。它返回字符串"success""failure"

如果返回字符串为"success",则单选按钮应保持不变。在"failure"的情况下,它应该恢复到它的最后位置。

我做了什么?好吧,我需要为复选框做类似的事情,如果复选框很简单,我只需取消选中特定的复选框。我不知道如何记录单选按钮的最后位置......

任何帮助?

4 个答案:

答案 0 :(得分:1)

尝试使用标志变量来保存上一个选定的单选按钮。

如果ajax返回失败,则尝试使用标志变量检查上一个单选按钮。

使用以下代码检查上一个单选按钮

$("input[name='radioButtonName'][value='valurFrom FlagVariable']").attr("checked", "checked");

答案 1 :(得分:1)

每当您的最后一个ajax请求在检查单选按钮后返回您的成功数据时,将已检查的无线电的值保存到变量中。

当您的下一个请求返回失败数据时,只需从变量中获取值并检查相应的单选按钮。

使用AJAX请求的更新代码

$(function(){

    var lastInput = 'r1';

    $('input').change(function(){

        var rdio = $(this);

        $.ajax({
          url: 'script.php',
          type: 'POST',
          dataType: 'json',
          'success' : function(response){
            if(response.status == 'success'){
                lastInput = rdio.val();
            }
            else{
                $('input[name="radio_group"][value="'+ lastInput +'"]').prop('checked', true);                
            }
          },
        });
    });
});

虚拟代码

$(function(){

    var lastInput = 'r1';

    $('input').change(function(){

        var rdio = $(this);

        switch(rdio.val()){
            case 'r1':
                lastInput = rdio.val();
                alert("Success");
                break;

            case 'r2':
                $('input[name="radio_group"][value="'+ lastInput +'"]').prop('checked', true);
                alert("Failure");
                break;

            case 'r3':
                lastInput = rdio.val();
                alert("Success");
                break;              
        }
    });
});

我没有用于测试目的的Ajax请求,并使用Switch / Case语句模拟它,其中第二个条件显示失败时的行为。

http://jsfiddle.net/rYxUs/

答案 2 :(得分:0)

您可以尝试这样的事情:

var radioValue = $("input[type='radio']").attr('checked');

然后成功:

$("input[type='radio']").attr('checked', 'checked');

失败:

$("input[type='radio']").removeAttr('checked');

答案 3 :(得分:0)

对我来说很好。

$("输入:无线​​电[名称='轮廓']&#34)点击(函数(){

警报($(本).VAL());

});