【问题标题】:Pass variable data from Javascript to PHP file将变量数据从 Javascript 传递到 PHP 文件
【发布时间】:2017-10-06 04:37:21
【问题描述】:

有没有办法让我将收集的数据提交给使用 javascript 传递给变量的 php 页面。 我有一个表单,其中包含发布到 php 文件的输入字段我正在使用 jquery 函数来序列化表单数据并在 php 中处理它。但是,除了来自输入字段的表单数据之外,我还想发送我收集并存储在 javascript 变量中的数据并将其提取到 php 变量中,以便我可以运行 for 循环。

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>New User Registration</title>
</head>

<body>
	<div id="newUserHld">
		<table id="newUserFrmTbl">
			<form id="newUserFrm">
				<tr>
					<td><label id="firstnameLbl">First Name</label></td>
					<td><input type="text" id="firstname" size="20" /></td>
				</tr>
				<tr>
					<td><label id="lastnameLbl">Last Name</label></td>
					<td><input type="text" id="lastname" size="20" /></td>
				</tr>
				<tr>
					<td><label id="dobLbl">Date of Birth</label></td>
					<td><input type="text" id="dob" size="8" /></td>
				</tr>
				<tr>
					<td><label id="positionLbl">Position</label></td>
					<td>
						<select size="1">
							<option>Select Option</option>
							<option> WFXM </option>
							<option>Operations Manager</option>
							<option>Assistant</option>
						
						</select>
					</td>
				</tr>
				<tr>
					<td><label id="usernameLbl">Username</label></td>
					<td><input type="text" id="username" size="20" /></td>
				</tr>
				<tr>
					<td><label id="passwordLbl">Password</label></td>
					<td><input type="password" id="password" size="20" /></td>
				</tr>
				<tr>
					<td><label id="payRateLbl">Pay Rate</label></td>
					<td><input type="text" id="payRate" size="20" /></td>
				</tr>
				<tr><td><input type="submit" id="createUsr"	name="createUsr" value="Create User" />	</td>	
			</form>
		</table>
	</div>
	<div id="success">
	</div>
	<button type="button" onclick="getFrmElm()">Try it</button>
</body>
	<script>
		function getFrmElm (){
			var x = document.getElementById("newUserFrm");
			var txt = "";
			var i;
			for (i = 0; i < x.length; i++) {
    		txt = txt + x.elements[i].id + "<br>";
}
		formSubmit();
		
		}
		
		
function formSubmit(){
			$.ajax({
				type:'POST',
				url:'userreg.php',
				data:$('#newUserFrm').serialize(),
				success:function(response){
					$('#success').html(response);
				}
				});
			
	
			 
			return false;
		}

	 
	</script>
</html>




PHP FROM userreg




<?php
include_once "iud.php";
$db = connectDatabase();
        $formfields = test_input($_POST['txt'];
		$firstname=test_input($_POST['firstname']);
		$lastname=test_input($_POST['lastname']);
		
		
		
		$sql="INSERT INTO contacts(firstname, lastname) ";
		$sql .= "values (";
		$sql .= "'".$firstname."', '".$lastname."'";
		$sql .= ")";
		if(mysqli_query($db, $sql)){
			echo "Record Inserted";
			}else{
			echo "Insert failed";	
			}

	mysqli_close($db);

	function test_input($data){
		
	$data=trim($data);
	$data=stripslashes($data);
	$data=htmlspecialchars($data);
	return $data;	
	}



?>

基本上我想从表单中发送数据,也想从 VAR txt 中发送数据。

【问题讨论】:

  • 编写一个ajax调用并发送数据到php
  • @DhavalChheda OP 正在使用AJAX....
  • 不确定这是否是复制/粘贴错误,但您似乎没有关闭函数调用 test_input($_POST['txt']; 它应该是 test_input($_POST['txt']); 并且您可能希望将函数放在之前(上图)你尝试调用它。
  • 你说得对,我错过了那个结束,但我只是把它放在我认为它应该在逻辑上做的事情,所以我还没有尝试过,我会这样做并检查。

标签: javascript php


【解决方案1】:

修改您的 ajax 以包含数据键。 目前那里没有钥匙。

$.ajax({
    type:'POST',
    url:'userreg.php',
    data: {
        firstName: $("#firstName").val(),
        lastName: $("#lastName").val(),
        // ... and so on until all the form element in here - then your PHP will work
    },
    success:function(response){
        $('#success').html(response);
    }
});

【讨论】:

  • 由于我使用的是表单序列化方法,它在不使用 key: value 方法的情况下发送数据,但理想情况下我想发送包含元素列表的 txt 变量。不是我使用序列化发送的实际值。
【解决方案2】:

您在输入字段中缺少名称属性,如果您的用户 ajax 需要在标题中链接 jquery 库文件。下面的代码有助于使用 ajax 发布表单数据。

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>New User Registration</title>
</head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<body>
    <div id="newUserHld">
        <table id="newUserFrmTbl">
            <form id="newUserFrm" method="POST" >
                <tr>
                    <td><label id="firstnameLbl">First Name</label></td>
                    <td><input type="text" id="firstname" size="20" name="firstname" /></td>
                </tr>
                <tr>
                    <td><label id="lastnameLbl">Last Name</label></td>
                    <td><input type="text" id="lastname" size="20" name="lastname" /></td>
                </tr>
                <tr>
                    <td><label id="dobLbl">Date of Birth</label></td>
                    <td><input type="text" id="dob" size="8" name="dob" /></td>
                </tr>
                <tr>
                    <td><label id="positionLbl">Position</label></td>
                    <td>
                        <select size="1" name="positionLbl">
                            <option>Select Option</option>
                            <option> WFXM </option>
                            <option>Operations Manager</option>
                            <option>Assistant</option>

                        </select>
                    </td>
                </tr>
                <tr>
                    <td><label id="usernameLbl">Username</label></td>
                    <td><input type="text" id="username" size="20" name="username" /></td>
                </tr>
                <tr>
                    <td><label id="passwordLbl">Password</label></td>
                    <td><input type="password" id="password" size="20"  name="password" /></td>
                </tr>
                <tr>
                    <td><label id="payRateLbl">Pay Rate</label></td>
                    <td><input type="text" id="payRate" size="20"  name="payRate" /></td>
                </tr>
                <tr><td><input type="submit" id="createUsr" name="createUsr" value="Create User"  onclick="formSubmit(); return false;" />  </td>   
            </form>
        </table>
    </div>
    <div id="success">
    </div>
</body>
    <script>

function formSubmit(){
    alert($('#newUserFrm').serialize());
            $.ajax({
                type:'POST',
                url:'userreg.php',
                data:$('#newUserFrm').serialize(),
                    success:function(response){
                        $('#success').html(response);
                    }
                });



            return false;
        }


    </script>
</html>

和 php 文件来检查响应。

<?php 
print_r($_POST);
exit;
?>

【讨论】:

  • 发送数据的函数位于链接的函数文件中,它可以序列化表单,但不能序列化从标签中收集的数据的新 bar txt。我想序列化该数据以及我放置字段数据的表单。
  • 也许我可以使用数组中序列化的键来完成任务。
猜你喜欢
  • 2016-10-14
  • 2012-10-07
  • 1970-01-01
  • 2020-04-06
相关资源
最近更新 更多