How to pass form value to PHP variable with AJAX call?

Question

Having issues anyone has any ideas? I have only posted was is necessary for the code. I basically have an HTML form I want to pull the value from a field on a form before it's submitted run an ajax call and populate another field. I think if I could get that Txt that is entered in the form over to a PHP variable on the modcreate.php it will work. because if I manually enter the details without the variable it works.

mainpage.php

Relevant parts from form

  <tr>
    <th>Service Tag:</th>
    <th><input type="text" id="inputTag" name="inputTag" value="" onblur="this.value=this.value.toUpperCase()"></td>
  </tr>

and

  <tr>
    <th>Model:</th>
    <th>
       <input type="text" id="inputModel" name="inputModel" value=""> 
       <a href="#" id="updateBtn">Populate</a>
       <div id="spinner">
          <img src="\images\ajax-load.gif" alt="Loading..."/>
       </div>
    </th>
  </tr>


 <script type="text/javascript" src="\js\jquery-latest.js"></script>
 <script type="text/javascript"> 
 $('#updateBtn').click( function(e) {
    //to disable the click from going to next page
    e.preventDefault();
    $.ajax({
       url: "modcreate.php",
       data: { 'txt1': $('#inputTag').val() },
       success: function(data) {
       }
    });
 });
 </script>

modcreate.php

<?php 

$field1value = $_GET['txt1'];
    $file_string = file_get_contents('blahblah.com/'.$field1value);
    preg_match("/<title>Product Support for (.+)\| Dell/i", $file_string, $matches);
    $print = "$matches[1]";
    echo $print;
?>

******Solution****** my ajax call was missing the part where it sent the data back to the form field

here is what the working ajax looks like now thanks guys for all the pointers

 <script type="text/javascript" src="\js\jquery-latest.js"></script>
 <script type="text/javascript"> 
 $('#updateBtn').click(function(e){
     //to disable the click from going to next page
     e.preventDefault();
     $.ajax({
         url: "modcreate.php",
         data: { 'txt1': $('#inputTag').val() },
         success: function(data) {
            $('#inputModel').val(data); //this was the missing part
         }
     });
 });
</script>

Is modcreate.php giving you any results if you go to it directly? (ex: navigate to modcreate.php?txt1=somethinghere — Joao
– Joao, Commented Oct 14, 2013 at 20:57
You have to define Your AJAX method type:"POST" or type:"GET" — Adam Azad
– Adam Azad, Commented Oct 14, 2013 at 20:58
@AdamZapp - jQuery defaults to GET - it's not necessary to set it. — user1864610
– user1864610, Commented Oct 14, 2013 at 21:00
What specific problem are you having? One thing I see missing is the form submit, which you would presumably want to call from within your ajax success function. — mayabelle
– mayabelle, Commented Oct 14, 2013 at 21:02

dr.dimitru · Accepted Answer · 2015-04-10 16:42:26Z

1

<script type="text/javascript"> 
 $('#updateBtn').click(function(e){
    //to disable the click from going to next page
    e.preventDefault();
    $.ajax({
            url: "modcreate.php",
            data: 'data="{ "txt1": '+$('#inputTag').val()+' }"',
            success: function(data){


          }
     }
);
});
</script>

On server side:

$income_data = json_decode($_GET['data'], true);
$field1value = $income_data['txt1'];

edited Apr 10, 2015 at 16:42

answered Oct 15, 2013 at 1:15

dr.dimitru

2,7321 gold badge29 silver badges36 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

user1548769 Over a year ago

thank you however I just got it working before seeing this by adding $('#inputModel').val(data); after my ajax success. Im not sure if it would work with the code you supplied but I will keep it incase I run into issues with the code I got working. Unless the method you posted has advantages over my working code?

Alex McLean Over a year ago

Note missing semicolon on the end of $field1value = $income_data['txt1']' to be put in place of last '

Marco Over a year ago

Data can be a hash, it's much more easy to write. E.g.: data: { 'txt1': value, 'var2': value }

Collectives™ on Stack Overflow

How to pass form value to PHP variable with AJAX call?

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related