doujing5435
doujing5435
2018-03-26 05:38

单选按钮检查并取消选中onclick并发送数据

I'm trying to send data onclick via ajax with a radio button. If the radio button is clicked and checked, value of 1 is set in the database. If the radio button is already checked, but clicked to uncheck it, the value of 0 is sent to the database. The code I'm using sends the value onclick and checks the radio button but does not uncheck and hence does not send the value to the database. Please help.

<input type="radio" name="home['. $row["id"].']" id="'. $row["id"].'">

<script>
$(document).ready(function(){
    $('input[type="radio"]').click(function(){

        var checked = $(this).prop('checked');

        if (checked != 'checked') {
            $(this).prop('checked', true);
            var id = $(this).attr('id');
            $.ajax({
                 url:"updateaddress.php",
                 method:"POST",
                 data:{home:"1",id:id,},
            });
        } else if (checked == 'checked') {
            $(this).prop('checked', false);
            var id = $(this).attr('id');
            $.ajax({
                 url:"updateaddress.php",
                 method:"POST",
                 data:{home:"0",id:id,},
        });

        }
    });                           
});
</script>
  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

3条回答

  • dsgfdgh14569 dsgfdgh14569 3年前

    A checkbox and

    $('input[type="checkbox"]').on("click", function(){ 
      $.post("updateaddress.php",{home:this.checked,id:this.id});
    }); 
    

    is all you need

    If you MUST use a radio, have a look at this

    How to Check/Uncheck single radio button

    $('input[type="radio"]').on("click", function(){ 
      $.post("updateaddress.php",{home:this.checked,id:this.id});
      this.checked=!this.checked;
    }); 
    
    点赞 评论 复制链接分享
  • dongren4147 dongren4147 3年前
    <input type="radio" name="home['. $row["id"].']" id="'. $row["id"].'">
    
    <script>
    $(document).ready(function(){
        $('input[type="radio"]').click(function(){
            var data = {home:"0",id:$(this).attr("id")};
            if ($(this).is(":checked")) {
                data = {home:"1",id:$(this).attr("id")};
            }
             $.ajax({
                     url:"updateaddress.php",
                     method:"POST",
                     data:data,
             });
    
        });                           
    });
    </script>
    

    You can use this script.Just check if radio button is checked or not and send your values accordingly.

    点赞 评论 复制链接分享
  • dtfo55908 dtfo55908 3年前

    Radio buttons are used when there is multiple options and user should check only one option.so,user can't uncheck a radio button when already checked.you explicitly make a onclick listener and change the radio button status.but it's not advisable.you can use checkbox for this purpose with onchange event.

    $(checkEle).on("change",function(){
      var status = $(this).prop("checked");
      sendStatus(status);
    }
    
    点赞 评论 复制链接分享