带有复选框的AJAX


                    

我是AJAX和JavaScript的新手,但决定解决使用Ajax将基于HTML“”标签的值发送到Python处理程序的问题。 下面是从此站点模拟的代码 。 我遇到的问题是了解在输入标签中“未选中”时,“选中”与“未选中”时,如何传递值? 我没有连接,因为我想确保无论用户单击什么,都将通过AJAX传递给我的Python处理程序。</ p>

</ p>



  send_data = function(status){

         $ .ajax({
       url:“ / subscription”,
             dataType:“ json”,
             数据:{'status':状态},
             输入:“ POST”,
             快取:false

     })。done(函数(数据(状态,xml){

          var obj = jQuery.parseJSON(data);
          alert(obj.success);

         })。fail(函数(jqXHR,textStatus,errorThrown){

         })。always(function(){

         });

}

$(document).ready(function(){

     $(“#subscription”)。submit(function(){

         var cb = $(“ input#switch-1”);

         如果(cb.is(“ checked”)){
             send_data(cb.val());
         }其他{
             send_data(cb.val());
         }
         返回false;
     });

}); </ code> </ pre>

  
    
    
     已订阅USEREMAIL </ span>

</ form> </ code> </ pre>
</ div>
</ div>

     </ div>

展开原文

原文

I'm new to AJAX and JavaScript, but decided to tackle sending a value based on an HTML "" tag using Ajax to a Python handler. Below is my code, simulated from this site. The problem I'm having is understanding when a box is "checked" vs "unchecked", how does the value get passed, when I have "unchecked" in the input tag? I'm not getting the connection as I want to make sure that whatever the user clicks gets passed through AJAX to my Python Handler.

send_data = function(status) {

        $.ajax({
      url: "/subscription",
            dataType: "json",
            data: {'status' : status},
            type: "POST",
            cache: false

    }).done(function(data, status, xml) {

         var obj = jQuery.parseJSON(data);
         alert(obj.success);

        }).fail(function(jqXHR, textStatus, errorThrown) {


        }).always(function() {


        });

}


$(document).ready(function() {

    $("#subscription").submit(function() {

        var cb = $("input#switch-1");

        if (cb.is("checked")) {
            send_data(cb.val());
        } else {
            send_data(cb.val());
        }
        return false; 
    });

});
<form id="subscription" action="">
    <label  class="mdl-switch mdl-js-switch mdl-js-ripple-effect" for="switch-1">
    <input type="checkbox" id="switch-1" name="status" class="mdl-switch__input" id="status" unchecked />
    <span class="mdl-switch__label">USEREMAIL Subscribed</span>
<input type="submit" value="Submit" />

</form>

</div>

2个回答


您的当前代码可以像这样简化,在两种情况下您发送相同的内容都是徒劳的……</ p>

  $(“#subscription”)。submit(function(){
     var cb = $(“ input#switch-1”);
     send_data(cb.val()); //您的当前代码可以像这样减少
     返回false;
});
</ code> </ pre>

如果要查看传递的内容,只需使用python打印通过复选框名称收到的内容... </ p>
     </ div>

展开原文

原文

Your current code can be reduced like this, you are doing the verification in vain, in both cases you are sending the same thing...

$("#subscription").submit(function() {
    var cb = $("input#switch-1");
    send_data(cb.val()); //your current code can be reduced like this
    return false; 
});

If you want to see what is passed, just print with python what you receive via the checkbox name...


首先,正确的选择器是:checked

此外,仅当选中复选框时,才应将其复选框值传递给send_data()函数,否则您的条件就无关紧要-您对选中和未选中的输入都执行相同的操作。</ p>

因此,您的代码应如下所示:</ p>

  if(cb.is(“:checked”)){
     send_data(cb.val());
}其他{
     send_data(null);
}
</ code> </ pre>

但是,如果您需要的只是将表单值传递给服务器,则无需手动处理复选框,只需执行以下操作即可:</ p>

  var send_data = function(data){
     $ .ajax({
         url:“ / subscription”,
         dataType:“ json”,
         数据:数据,
         输入:“ POST”,
         快取:false
     })。done(函数(数据(状态,xml){
         var obj = jQuery.parseJSON(data);
         alert(obj.success);
     })。fail(函数(jqXHR,textStatus,errorThrown){

     })。always(function(){

     });
}

$(“#subscription”)。submit(function(){
     send_data($(this).serialize());
});
</ code> </ pre>

请注意,如果未选中checbox,则不会将其值发送到服务器(这是默认的浏览器行为)。 因此,您只需在后端脚本中检查状态字段的状态即可。</ p>
     </ div>

展开原文

原文

First of all, the correct selector is :checked.
Аnd you should pass checkbox value to send_data() function only when it's checked, otherwise your condition is irrelevant - you are doing the same thing for checked and not checked inputs.

So, your code should be something like this:

if (cb.is(":checked")) {
    send_data(cb.val());
} else {
    send_data(null);
}

But if all you need is pass form values to server, you don't need to handle checkbox manually, you can just do this:

var send_data = function(data) {
    $.ajax({
        url: "/subscription",
        dataType: "json",
        data: data,
        type: "POST",
        cache: false
    }).done(function(data, status, xml) {
        var obj = jQuery.parseJSON(data);
        alert(obj.success);
    }).fail(function(jqXHR, textStatus, errorThrown) {

    }).always(function() {

    });
}

$("#subscription").submit(function() {
    send_data($(this).serialize());
});

Note, that if checbox is not checked, it's value won't be sent to server (it's a default browser behaviour). So you can just check presense of status field in your backend script.

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
立即提问
相关内容推荐