带有 jQuery 的 AJAX 单选按钮答案

【问题标题】：AJAX Radio Buttons with jQuery带有 jQuery 的 AJAX 单选按钮
【发布时间】：2011-04-15 11:24:53
【问题描述】：

我需要帮助才能提交带有如下单选按钮的 RSVP：

Attending: <input type="radio" />
Maybe Attending: <input type="radio" />
Not Attending: <input type="radio" />

Whenever someone RSVP the event, it should ratio the input to the selected (so just one radio button can only be selected), so when one option is selected, it should do an AJAX request with the $.ajax function.

我这样做了：

Attending: <input type="radio" onclick="rsvpEvent(3, 1);" />
Maybe Attending: <input type="radio" onclick="rsvpEvent(2, 1);" />
Not Attending: <input type="radio" onclick="rsvpEvent(1, 1);" />

使用 jQuery：

function rsvpEvent(rsvp, id)
{   
    $.ajax({
       type: "GET",
       url: "http://localhost:8888/update/test.php",
       data: "rsvp=" + rsvp + "id=" + id,
       success: function()
       {
         alert('rsvp: ' + rsvp + ' id: ' + id);
       },
       error: function()
       {
         alert('rsvp: ' + rsvp + ' id: ' + id);
       }
     });
}

这根本行不通……有什么问题？

【问题讨论】：

标签： jquery ajax radio-button

【解决方案1】：

首先，我认为它应该是一个发布事件而不是一个获取，并且当方法背后的代码需要两个参数时，您发送的数据是一个字符串。

       function GetDate() {
            $.ajax({
                type: "POST",
                url: "default.aspx/GetDate",
                data: "{myParam:'" + document.getElementById("txtParam").value + "'}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(msg) {
                    $.each(msg, function(i, item) {
                        $("#dialog").fadeOut("fast", function() {
                            $("#dialog").html(item);
                            $("#dialog").fadeIn(300);
                        });

                    });
                }
            });
        }

【讨论】：

我知道我的示例适用于 .Net，但其余的都是相关的

【解决方案2】：

我要改变几件事

我会把它做成一个实际的表单，而不仅仅是单选按钮，这样即使没有启用 Javascript 的人也可以参加您的精彩派对。
使单选按钮都具有相同的name='whatever'，这样您一次只能选择一个
如果您使用表单，则可以使用 jQuery 中的 serialize() 来修复数据错误（目前您将发送 rsvp=3id=1，我怀疑您的函数是否期望）。

【讨论】：

so that someone without Javascript enabled can still attend your wonderful parties. - 有史以来最好的报价 ;)

【解决方案3】：

你的具体问题是URL的值，应该只有：

url: "update/test.php",

由于安全限制，通常无法向第三方网站发出 Ajax 请求，因此您不能在 url 值上使用 http://。

在数据中不要忘记&在id之前

+ “&id=” + id

【讨论】：