如何以PHP形式添加onkeypress保存

时间:2017-06-20 04:31:40

标签: javascript php ajax

**这是我的php index.php文件。我想键入名字和姓氏类型,自动它必须保存数据库。我用ajax编写了代码。但是,这不能正常工作。请任何人帮助我。 **

的index.php

<?php
$connection = mysql_connect("localhost", "root", ""); 
$db = mysql_select_db("type", $connection); 
if(isset($_POST['submit'])){
$firstName = $_POST['firstName'];
$lastName = $_POST['lastName'];

if($firstName !=''||$lastName !=''){
//Insert Query of SQL
$query = mysql_query("insert into users(firstName, lastName) values ('$firstName', '$lastName')");
echo "<br/><br/><span>Data Inserted successfully...!!</span>";
}
else{
echo "<p>Insertion Failed <br/> Some Fields are Blank....!!</p>";
}
}
mysql_close($connection);
?>

<html>
<head>
<meta><title>Home Page</title>
<script type="text/javascript">
$(document).on('keyup','firstName','lastName',function(){
        var rel = $(this).attr('rel');
        var flatvalue = $(this).val();
        $("#firstName"+rel).val(flatvalue);
    });
    </script>
</head>
<body>
    <form action="" method="post"> 
            <label for="firstName">First Name</label>
            <input type="text" name="firstName" ><br><br>
            <label for="lastName">Last Name</label>
            <input type="text" name="lastName" ><br><br>
            <input type="submit" id="submit" name="submit" value="submit"/>
        </form>
</body>
</html>

4 个答案:

答案 0 :(得分:0)

<?php
$connection = mysql_connect("localhost", "root", ""); 
$db = mysql_select_db("type", $connection); 
if(isset($_REQUEST['firstName'])){
$firstName = $_REQUEST['firstName'];
$lastName = $_REQUEST['lastName'];

 if($firstName !=''||$lastName !=''){
//Insert Query of SQL
$query = mysql_query("insert into users(firstName, lastName) values ('$firstName', '$lastName')");
echo "<br/><br/><span>Data Inserted successfully...!!</span>"; 
die();
}
else{
echo "<p>Insertion Failed <br/> Some Fields are Blank....!!</p>";
die();

}
}
//mysql_close($connection);
?>

<html>
<head>
<meta><title>Home Page</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () { 
$('#submit').click(function(){ alert('d');
        var firstname = $('#firstName').val();
        var lastname = $('#lastName').val();
       $.ajax({
           url:'',
           data:{'firstname':firstname,'lastname':lastname, },
           type: 'POST',
           success: function(data){
              alert("Data Save: " + data);
         }
          });
    });
    });
    </script>
</head>
<body>
            <label for="firstName">First Name</label>
            <input type="text" name="firstName" id="firstName"><br><br>
            <label for="lastName">Last Name</label>
            <input type="text" name="lastName" id="lastName"><br><br>
            <input type="submit" id="submit" name="submit" value="submit"/>

</body>
</html>

答案 1 :(得分:0)

你试试这样做吗

$('body').delegate('input[type="text"]', 'keypress keydown keyup change propertychange paste', function(event) {
    event.stopImmediatePropagation();

    if (event.type === 'keydown' || event.type === 'keypress') {
        return;
    }
    //insert what you want to do here
    //perform some ajax
    /*
    $.ajax({
        url: 'index.php',
        method: 'POST',
        data: {
            'firstName' : $('input[name=firstName]).val(),
            'lastName' : $('input[name=lastName]).val()
        },
        success: function(mResponse) {
            alert(mResponse);
        }
    });
    */
});

答案 2 :(得分:0)

可能这可以帮到你, 如果你想通过表单提交来做,那么只需要在表单的action方法中给出控制器函数的url

<form action="" method="post"> 
        <label for="firstName">First Name</label>
        <input type="text" name="firstName" ><br><br>
        <label for="lastName">Last Name</label>
        <input type="text" name="lastName" ><br><br>
        <input type="submit" id="submit" name="submit" value="submit"/>
    </form>

如果你想通过ajax这样做,那么你可以为first_name和last_name输入添加id属性,并且可以按照以下方式进行,

$('#submit').on('click', function(){
var first_name = $("#first_name").val();
var last_name = $("#last_name").val();
$.ajax({
        url: url of your controler, //url of your controller function
        type: "POST",
        data: {'first_name' : first_name,'last_name':last_name},
                    success: function (data) {

                        //whatever you want to do on success

                        } else {
                            //in case of no data 
                        }
                    }

                });    

});

以同样的方式将class属性赋予输入框,keyup event可以通过类保存数据

答案 3 :(得分:0)

onKeyPress事件不正确,因为它按用户命中多次调用。

使用onBlur事件而不是onKeyPress提交表单并将其保存到MySql用户表。

尝试以下示例,

PHP

<?php
$connection = mysql_connect("localhost", "jaydeep_mor", "jaydeep_mor"); 
$db = mysql_select_db("jaydeep_mor", $connection);
if(isset($_POST['firstName']) && isset($_POST['lastName'])){
    $firstName = $_POST['firstName'];
    $lastName = $_POST['lastName'];

    if($firstName != '' || $lastName != ''){
        //Insert Query of SQL
        $query = mysql_query("insert into users(firstName, lastName) values ('$firstName', '$lastName')");
        header("Location: test.php?msg=Data Inserted successfully...!!");
    }
    else{
        echo "<p>Insertion Failed <br/> Some Fields are Blank....!!</p>";
    }
}
mysql_close($connection);
?>

HTML / JAVASCRIPT

<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<meta><title>Home Page</title>
<script type="text/javascript">
    function saveData(){
        document.forms["userDataForm"].submit();
    }
</script>
</head>
<body>
    <?php if(isset($_GET['msg']) && trim($_GET['msg'])!=""){ ?>
        <br /><div><?php echo $_GET['msg']; ?></div><br />
    <?php } ?>
    <form action="test.php" method="post" name="userDataForm"> 
        <label for="firstName">First Name</label>
        <input type="text" name="firstName" value="<?php echo isset($_POST['firstName'])?$_POST['firstName']:''; ?>" ><br><br>
        <label for="lastName">Last Name</label>
        <input type="text" name="lastName" value="<?php echo isset($_POST['lastName'])?$_POST['lastName']:''; ?>" onblur="return saveData();" ><br><br>
        <!--input type="submit" id="Submit" name="Submit" value="submit"/-->
    </form>
</body>
</html>