尝试从 AJAX 中的文本框获取价值并将其发送到新页面

Posted 2023-05-09

【中文标题】尝试从 AJAX 中的文本框获取价值并将其发送到新页面

【英文标题】：Trying to get value from textbox in AJAX and sending it to the new page

【发布时间】：2019-04-10 05:00:58

【问题描述】：

在使用 ajax 提取文本框中的值并将它们发布到另一个 .php 文件时遇到问题。我以前用复选框做过一次，但无法复制我的结果。这是问题中文本框的代码。

<div align = "right">
    <div class = ='text'>
    <span style="float:right;"><strong> Status Report Date</strong> 


    <label for="from">From</label>
    <input type="text" id="from" name="from">
    <label for="to">to</label>
    <input type="text" id="to" name="to">
    <div id="dates"></div>

这些是我的日期选择器框，因为我将日期选择器脚本附加到它们，但认为它们充当普通文本框。

这是从文本框中获取值的脚本

 $(document).ready(function()  
    $('input[type="text"]').click(function()  
       var from = $(this).val();  
       $.ajax(  
            url:"sortByDates.php",  
            method:"POST",  
            data:text:text,  
            success:function(data)  
                 $('#dates').html(data);  
              
       );  
      );  
 );   
 </script>

这是我试图将值发送到的 .php 文件。

   <?php
    if (isset($_GET['pageSubmit'])) 
   $firstDate= $_POST['from'];
$lastDate= $_POST['to'];

   echo $firstDate;
   echo $lastDate;

  

【参考方案1】：

我认为您失去了注意力...检查此代码

<div alight = "right">
<div class='text'>
<span ><strong> Status Report Date</strong> 
<label for="from">From</label>
<input type="text" id="from" name="from">
<label for="to">to</label>
<input type="text" id="to" name="to">
<div id="dates"></div>
<button id="submit">click</button>

jQuery

<script>
 $(document).ready(function()  
    $('#submit').click(function()  
        var from = $('#from').val();  
        var to = $('#to').val(); 
         ps = "submit";




     $.ajax(  
            url:"sortByDates.php",  
            method:"POST",  
            data:pageSubmit: ps,from:from, to: to,  
            success:function(data)  
                 $('#dates').html(data);  
              
       );  
      );  
 );   

php 脚本

<?php
   if (isset($_POST['pageSubmit'])) 
        $firstDate= $_POST['from'];
        $lastDate= $_POST['to'];
        echo $firstDate;
        echo $lastDate;

  
?>

【讨论】：

这几乎成功了！第一个日期正确传递，但第二个值丢失并且没有赋值

无法将两个文本框都传递给 php 文件。只有当我单击第一个文本框时，我才能发送该值。第二个文本框不发送值

你可以像你想要的那样发送第一个文本框值..但它会抛出一个错误..因为 post action php 文件需要两个数据字段但你发送它一个字段是“来自“...但是您可以根据需要发送第一个值...通过更改此 $('#from').on(function() 或 $('#from').change(function()

很抱歉，您能否更清晰地格式化您的文本。我不是很熟悉 ajax

检查 w3schools.com .. 他们只是初学者级别的教程中最好的.. 在 ajax "data:pageSubmit: ps,from:from, to: to 中，" 这行表示数据您发送到页面...这里 pageSubmit, from, to 是变量名（之前 : ）和冒号（:) 之后是每个变量的值...

【参考方案2】：

首先在输入中添加 value=""

然后在您的 js 代码中，您发送的是未定义的“文本”变量，因为您的变量是“来自”。

所以尝试添加：data:text:from

【讨论】：

当我尝试回显时，没有任何值传递给任一变量 \

您是否检查过 $_POST 变量中是否有任何内容？如果不是，则意味着没有发布数据。然后检查 js 代码，如果你在那里得到值。然后尝试添加一个按钮元素，点击它，数据应该被发布

参考标记的答案和它下面的评论。这就是我现在面临的问题

你得到js代码中“to”的值了吗？同样首先 console.log 在 ajax 中的成功函数中的“数据”变量，你是否得到那里的值（在成功函数中）？

当我点击第一个文本框两次时，“to”的值被传递：/

【参考方案3】：

您尚未在 ajax 中传递 from、to 和 pagesubmit 的值。试试这段代码，希望对您有所帮助 在ajax中

$(document).ready(function()  
        $('input[type="text"]').click(function()  
           var from = $("#from").val(); 
           var to = $("#to").val();  
           $.ajax(  
                url:"sortByDates.php",  
                method:"POST",  
                data:from:from,to:to,pageSubmit:1,  
                success:function(data)  
                     $('#dates').html(data);  
                  
           );  
          );  
     );   

在 PHP 中

<?php
    if (isset($_GET['pageSubmit'])) 
        $firstDate= $_POST['from'];
        $lastDate= $_POST['to'];
        echo $firstDate;
        echo $lastDate;

  
?>

【讨论】：

不幸的是对我不起作用：/我现在将 PHP 中的日期变量传递给我的数据库，并且两个值都为 0。仍然无法打印

【参考方案4】：

您在该部分中使用的变量“文本” 文本：文本 未定义。因此，不会发送任何数据。

除此之外还有其他问题，您希望发送两个值吗？您的代码看起来不支持它。您确定要在用户单击文本框时发生这种情况吗？。

【讨论】：

基本上当用户单击该文本框上的日期选择器对象时