I am trying to echo the contents of an input field on enter. I have a text input field that I create here:
我试图在输入上回显输入字段的内容。我有一个我在这里创建的文本输入字段:
echo '<form id="changePassForm" action="" method="post" enctype="multipart/form-data">
<div class="changePass">
<div class="changePassBtn">Change Password</div>
<input class = "passwordText" type="password" placeholder="Password" name="passwordText">
</div>';
The field calls this javascript function correctly:
该字段正确调用此javascript函数:
$(".passwordText").keydown(function(event){
if(event.keyCode == 13){
$.ajax({
url: "../php/passwordchange.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: new FormData(this), // Data sent to server, a set of key/value pairs (i.e. form fields and values)
datatype: 'text',
contentType: false, // The content type used when sending data to the server.
cache: false, // To unable request pages to be cached
processData:false, // To send DOMDocument or non processed data file it is set to false
success: function(data) // A function to be called if request succeeds
{
console.log(data);
}});
console.log("WORKS!!");
}
});
Which references password change.php here:
这里引用密码change.php:
<?php
session_start();
echo "Hello world";
$pass=$_POST['passwordText']; //name of input
echo $pass;
/*$dbh = new PDO("mysql:host=localhost;dbname=sqlserver", 'username', 'password');
$dbh->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$checkforpass = "SELECT password FROM sqlserver.accounts WHERE username='".$username."'";*/
?>
I'm not versed in PHP but Hello world is output to console. How can I output/store value of text field in $pass?
我不熟悉PHP,但Hello world输出到控制台。如何在$ pass中输出/存储文本字段的值?
3 个解决方案
#1
0
Untested, off the cuff:
未经测试,脱下袖口:
$(".passwordText").keydown(function(event){
if(event.keyCode == 13){
var pass = $('#changePassForm input').val();
$.ajax({
url: "../php/passwordchange.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: 'passwordText=' + pass, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
success: function(data) // A function to be called if request succeeds
{
console.log(data);
}});
console.log("WORKS!!");
}
});
Note also that it is dataType:
not datatype:
, and that dataType only affects returning data not data being sent to PHP
另请注意,它是dataType:not datatype:,并且该dataType仅影响返回数据而不影响发送给PHP的数据
So, get it working simply first (as above), then get fancy with $('#changePassForm').serialize()
etc.
因此,首先让它工作(如上所述),然后使用$('#changePassForm')。serialize()等。
#2
0
Try as follows
尝试如下
$(".passwordText").keydown(function(event){
if(event.keyCode == 13){
var postData = $('#changePassForm').serializeArray();
$.ajax({
url: "../php/passwordchange.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: postData, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
datatype: 'text',
contentType: false, // The content type used when sending data to the server.
cache: false, // To unable request pages to be cached
processData:false, // To send DOMDocument or non processed data file it is set to false
success: function(data) // A function to be called if request succeeds
{
console.log(data);
}});
console.log("WORKS!!");
}
});
#3
0
If you want to use FormData
, you can see from the manual that the FormData
object constructor takes an optional <form>
element and you're using this
, which refers to $(".passwordText")
, which is a jQuery object. You can pass a form element by doing:
如果你想使用FormData,你可以从手册中看到FormData对象构造函数采用一个可选的
var form = document.getElementById("changePassForm");
var fd = new FormData(form);
Putting this all together we would then have:
把这一切放在一起我们就会:
$(document).ready(function() {
$(".passwordText").keydown(function(event){
if(event.keyCode == 13){
event.preventDefault();
var form = document.getElementById("changePassForm");
var fd = new FormData(form);
$.ajax({
url: "../php/passwordchange.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: fd, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
dataType: 'text',
cache: false, // To unable request pages to be cached
processData:false, // To send DOMDocument or non processed data file it is set to false
success: function(data) // A function to be called if request succeeds
{
console.log(data);
}});
console.log("WORKS!!");
}
});
});
As an alternative you can manually append any values you want to have sent in the ajax request like this:
作为替代方案,您可以手动附加要在ajax请求中发送的任何值,如下所示:
var fd = new FormData();
fd.append($(this).attr("name"), $(this).attr("value"));
Disclaimer:
With that said, the FormData interface is only available in IE >= 10, so if you are worried about cross browser compatibility you may want to consider simply using jQuery's serialize() method to send the data
. As an added bonus, it's only 1 line of code.:
话虽如此,FormData接口仅在IE> = 10时可用,因此如果您担心跨浏览器兼容性,您可能需要考虑使用jQuery的serialize()方法来发送数据。作为额外的奖励,它只有一行代码:
data: $("#changePassForm").serialize()
#1
0
Untested, off the cuff:
未经测试,脱下袖口:
$(".passwordText").keydown(function(event){
if(event.keyCode == 13){
var pass = $('#changePassForm input').val();
$.ajax({
url: "../php/passwordchange.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: 'passwordText=' + pass, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
success: function(data) // A function to be called if request succeeds
{
console.log(data);
}});
console.log("WORKS!!");
}
});
Note also that it is dataType:
not datatype:
, and that dataType only affects returning data not data being sent to PHP
另请注意,它是dataType:not datatype:,并且该dataType仅影响返回数据而不影响发送给PHP的数据
So, get it working simply first (as above), then get fancy with $('#changePassForm').serialize()
etc.
因此,首先让它工作(如上所述),然后使用$('#changePassForm')。serialize()等。
#2
0
Try as follows
尝试如下
$(".passwordText").keydown(function(event){
if(event.keyCode == 13){
var postData = $('#changePassForm').serializeArray();
$.ajax({
url: "../php/passwordchange.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: postData, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
datatype: 'text',
contentType: false, // The content type used when sending data to the server.
cache: false, // To unable request pages to be cached
processData:false, // To send DOMDocument or non processed data file it is set to false
success: function(data) // A function to be called if request succeeds
{
console.log(data);
}});
console.log("WORKS!!");
}
});
#3
0
If you want to use FormData
, you can see from the manual that the FormData
object constructor takes an optional <form>
element and you're using this
, which refers to $(".passwordText")
, which is a jQuery object. You can pass a form element by doing:
如果你想使用FormData,你可以从手册中看到FormData对象构造函数采用一个可选的
var form = document.getElementById("changePassForm");
var fd = new FormData(form);
Putting this all together we would then have:
把这一切放在一起我们就会:
$(document).ready(function() {
$(".passwordText").keydown(function(event){
if(event.keyCode == 13){
event.preventDefault();
var form = document.getElementById("changePassForm");
var fd = new FormData(form);
$.ajax({
url: "../php/passwordchange.php", // Url to which the request is send
type: "POST", // Type of request to be send, called as method
data: fd, // Data sent to server, a set of key/value pairs (i.e. form fields and values)
dataType: 'text',
cache: false, // To unable request pages to be cached
processData:false, // To send DOMDocument or non processed data file it is set to false
success: function(data) // A function to be called if request succeeds
{
console.log(data);
}});
console.log("WORKS!!");
}
});
});
As an alternative you can manually append any values you want to have sent in the ajax request like this:
作为替代方案,您可以手动附加要在ajax请求中发送的任何值,如下所示:
var fd = new FormData();
fd.append($(this).attr("name"), $(this).attr("value"));
Disclaimer:
With that said, the FormData interface is only available in IE >= 10, so if you are worried about cross browser compatibility you may want to consider simply using jQuery's serialize() method to send the data
. As an added bonus, it's only 1 line of code.:
话虽如此,FormData接口仅在IE> = 10时可用,因此如果您担心跨浏览器兼容性,您可能需要考虑使用jQuery的serialize()方法来发送数据。作为额外的奖励,它只有一行代码:
data: $("#changePassForm").serialize()