通過Ajax將單選按鈕數據（值）發送到PHP

Question

在下面的JavaScript中，我無法將單選按鈕數據發送到PHP。 示例：如果選擇了單選按鈕“母親”，則應通過ajax發送選定的“母親”值。 但是我的問題是我無法從ajax發送選定的單選按鈕值。 我用了Google，但無法解決。 您能否共享解決此問題的代碼。

這是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">

Answer 1

首先，我建議您使用jQuery ，因為它確實更簡單，更好。

然后，您可以使用以下代碼發布復選框/無線電值：

$("#game").val()

在這里，您可以找到使用jQuery的Ajax真正簡單的語法。

Answer 2

請刪除$（'input [type =“ radio”]：checked'）。val（）並替換為var游戲。 在此之前，請使用以下代碼獲取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;