CODEWITHSUNDEEP
phphtmlmysqlsql
Johnson Main
Johnson Main

Reputation: 47

Trying to get value from textbox in AJAX and sending it to the new page

Having issues pulling the values put in a textbox with ajax and posting them to another .php file. Ive done this once before with a checkbox but wasn't able to duplicate my results. Here is the code for the text boxes in questions.

<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>

These are my date picker boxes since I attached a datepicker script to them but figured they act as normal text-boxes.

Here is the script for grabbing values from the textboxes

 $(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>

Here is the .php file I am trying to send the values to.

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

   echo $firstDate;
   echo $lastDate;

  }

Upvotes: 0

Views: 571

Answers (4)

user37309
user37309

Reputation: 634

The variable "text" you use in the section {text:text} is undefined. So therefore no data will be sent.

Other than that there are other problems here, do you want both values to be sent? Your code doesn't look like it supports that. Are you sure you want this to occur when the user clicks the textbox?.

Upvotes: 0

Md. Mohaiminul Hasan
Md. Mohaiminul Hasan

Reputation: 311

I think you lost your focus... Check this code out

<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 script

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

  }
?>

Upvotes: 1

Deepak A
Deepak A

Reputation: 1636

You have not passed the values from,to and pagesubmit in ajax.Try this code hope it helps In 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);  
                }  
           });  
          });  
     });

In PHP

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

  }
?>

Upvotes: 0

Jitendra Ahuja
Jitendra Ahuja

Reputation: 759

Firstly add value="" in the inputs

Then in your js code, you are sending "text" variable which is undefined as your variable is "from".

So try adding : data:{text:from}

Upvotes: 0

Related Questions