通过Ajax向PHP发送单选按钮数据(值)

Send radio button data (value) to PHP via Ajax

本文关键字:数据 单选按钮 Ajax PHP 通过      更新时间:2023-09-26

在下面的JavaScript中,我无法将单选按钮数据发送到PHP。示例:如果选中了单选按钮"Mother",则"Mother"的选中值应该通过ajax发送。但我的问题是,我无法从ajax发送所选的单选按钮值。我谷歌了一下,但我解不出来。你能分享一下解决这个问题的代码吗?

这是JavaScript代码:

<script language="JavaScript">
    var HttPRequest = false;
    function doCallAjax() {
        var test = $("#txtUsername").val();
        var test2 = $("#txtPassword").val();
        if(test=='')
        {
            alert("Please Enter Register Number");
        }
        else if(test2=='')
        {
            alert("Please Enter Date Of Birth");
        }
        else
        {
            HttPRequest = false;
            if (window.XMLHttpRequest) { // Mozilla, Safari,...
                HttPRequest = new XMLHttpRequest();
                if (HttPRequest.overrideMimeType) {
                    HttPRequest.overrideMimeType('text/html');
                }
            } else if (window.ActiveXObject) { // IE
                try {
                    HttPRequest = new ActiveXObject("Msxml2.XMLHTTP");
                } catch (e) {
                    try {
                        HttPRequest = new ActiveXObject("Microsoft.XMLHTTP");
                    } catch (e) {}
                }
            } 
            if (!HttPRequest) {
                alert('Cannot create XMLHTTP instance');
                return false;
            }
            **// iam using this For Validation to send data to different urls based on selection**
            var game1 = $('input[type="radio"]:checked').val();
            if (game1 === "Mother") {
                var url = 'http://localhost:9999/check.php';
            }
            else if (game1 === "Father") {
                alert('Father');
            }
            else {
                HttPRequest = false;
                alert('select 1');
            }
            **this is Where ima stucked**
            var pmeters = "tUsername=" + encodeURI( document.getElementById("txtUsername").value) +
                "&tPassword=" + encodeURI( document.getElementById("txtPassword").value );
                "&game=" + $('input[type="radio"]:checked').val();
            HttPRequest.open('POST',url,true);
            HttPRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
            HttPRequest.setRequestHeader("Content-length", pmeters.length);
            HttPRequest.setRequestHeader("Connection", "close");
            HttPRequest.send(pmeters);
            HttPRequest.onreadystatechange = function()
            {
                if(HttPRequest.readyState == 3)  // Loading Request
                {
                    document.getElementById("mySpan").innerHTML = "Now is Loading...";
                }
                if(HttPRequest.readyState == 4) // Return Request
                {
                    if(HttPRequest.responseText == 'Y')
                    {
                        window.location = 'success.html';
                    }
                    else if (HttPRequest.responseText == 'z')
                    {
                        document.getElementById("mySpan").innerHTML = "";
                        window.alert("bad registernumber or dob");
                    }
                    else if (HttPRequest.responseText == 'b')
                    {
                        document.getElementById("mySpan").innerHTML = "";
                        window.alert("userexist");
                    }
                }
            }
        }
    }
</script>

这是html代码

<br/>
<input type="radio" name="game" value="Mother">Mother
<br />
<input type="radio" name="game" value="Father">Father
<br />
<input type="radio" name="game" value="Self">Self
<br />
<input type="radio" name="game" value="Other">Other
<br />
</table>
<br>
<input name="btnLogin" type="button" id="btnLogin" OnClick="JavaScript:doCallAjax();" value="Login">

首先我建议你使用jQuery,因为它真的更简单更好。

然后您可以使用以下代码来发布复选框/单选值:

$("#game").val()

在这里你可以找到真正简单的Ajax语法与jQuery。

请删除$('input[type="radio"]:checked').val()并替换为var game。在此之前,请使用下面的代码来获取var game中选中的单选按钮的值。

var elements = document.getElementsByName("game");
var game;
for(var i = 0; i < elements.length; i++ ){
 if(elements[i].checked){
   game = elements[i].value;
  }
}

现在你的代码看起来像

var pmeters = "tUsername=" + encodeURI( document.getElementById("txtUsername").value) +
                        "&tPassword=" + encodeURI( document.getElementById("txtPassword").value );
                            "&game=" + game;