如何使用ajax将值传递给php脚本


How to pass the values to php script using ajax?

我已经编写了一段代码,使用ajax将输入字段的值传递给php脚本,但它不起作用。有人能建议如何纠正这个代码吗?我想在php文件中显示通过ajax传递的值。

例如php

<?php
$temp = $_POST['start_date'];
$name = $_POST['end_date'];
echo $temp.$name;
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript">

$(document).ready(function(){

$("input").change(function(){
  var fname = $("#fname").val();
   var lname = $("#lname").val();
   $.ajax({
   method: "POST",
   url: "ex.php", // path to php file
    data: { start_date: fname, end_date: lname } // send required data here
  })
  .done(function( msg ) {
  }); 

  });
  });
 </script>
 </head>
 <body>
 <form action="#" method="post" name="form1">
 <input type="text" name="fname" id="fname"/>
 <input type="text" name="lname" id="lname"/>
 </form>
 </body>
 </html>
try using below code :
<?php
$temp = $_POST['start_date'];
$name = $_POST['end_date'];
echo $temp.$name;
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript">

$(document).ready(function(){

$("input").change(function(){

  var fname = $("#fname").val();
   var lname = $("#lname").val();
var post = "&start_date=" + fname + "&end_date=" + lname;
   $.ajax({
                        'url': ex.php,
                        'data': post,
                        'type': 'POST',
                        'success': function (data)
                        {
                        }
                    });
  });
  });
 </script>
 </head>
 <body>
 <form action="" method="post" name="form1">
 <input type="text" name="fname" id="fname"/>
 <input type="text" name="lname" id="lname"/>
 </form>
 </body>
 </html>

在化妆中添加元素

<span id="idOfSomeElementYouWantToUse"></span>

在你的回调集中,它是文本。

.done(function( msg ) {
    $("#idOfSomeElementYouWantToUse").text(msg);
});

在页面中添加一个div,并使用html()附加来自ajax请求的数据

 <body>
 <form action="#" method="post" name="form1">
 <input type="text" name="fname" id="fname"/>
 <input type="text" name="lname" id="lname"/>
 </form>
 <div class="ajax-result"></div>
 </body>

js:

$("input").change(function(){
  var fname = $("#fname").val();
   var lname = $("#lname").val();
   $.ajax({
    method: "POST",
    url: "other_file.php", // path to php file
    data: { start_date: fname, end_date: lname }, // send required data here
    success:function(data){
     $(',ajax-result').htm(data);
     }
  });

注意:根据我可以告诉你的内容,我强烈建议你创建一个新的php文件(other_file.php),其中包含你的逻辑

根据我从您上面的评论中可以理解的,您希望将textbox值插入数据库,为此,您不希望在textChange事件上调用ajax,因为那时不会出现所有值,我建议在表单中添加submit按钮,并在表单提交时调用ajax。

这是主文件:

ajax_ex.php(您应该根据自己的要求命名)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <title>Untitled Document</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body>
  <form id="frmInsert" method="post" name="form1">
    <input type="text" name="fname" id="fname"/>
    <input type="text" name="lname" id="lname"/>
    <input type="submit" value="Insert" />
  </form>
  <div id="msg">
  </div>
</body>
<!-- You should put javascript at bottom -->
<script   src="jQuery-2.1.4.min.js"></script>
<script type="text/javascript">
  $("#frmInsert").submit(function(e){
    var fname = $("#fname").val();
    var lname = $("#lname").val();
    $.ajax({
    method: "POST",
    url: "insert.php", // path to php file
      data: { start_date: fname, end_date: lname } // send required data here
    })
    .done(function( msg ) {
      msg = $.trim(msg);
      if (msg == 'true') {
        $('#msg').html("Data is inserted successfully");
      }else {
        $('#msg').html("Data insertion failed");
      }
    });
    e.preventDefault(); 
  });

您不应该在ajax中调用同一个文件,我建议您创建将在ajax中被调用的单个文件,该文件将处理所有后端处理。

insert.php

<?php
//Check if post data is available (You should also check for particular attribute if it is available)
if (!empty($_POST)) {
  $temp = $_POST['start_date'];
  $name = $_POST['end_date'];
  //Insert Data into database
  // Your code
  $result = 'true'; //check for operation if it is success and store it in result
  //Echo result so you can check if insert is success of not in your ajax callback.
  echo $result;
}

?>