CODEWITHSUNDEEP
javascriptphpjqueryajax
Oliver
Oliver

Reputation: 831

sending php and js variables through ajax to php page and mysql table

I have been looking to some similar questions, but none seem to provide the specific answer I am looking for. I have a few js variables, which are being passed through ajax to a location.php, which will then put them in a mysql table. So far the ajax call looks like this:

function postLocation()
{
  //var teamName = $('.team_name').val(); //Neither of the two work
	var teamName = document.getElementById('team_name').value;
  navigator.geolocation.getCurrentPosition(function(position) 
  {
    pos = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
    $.ajax(
    {
      url:'location.php',
      type: 'POST',
      datatype: 'json',
      data: {
        'posx':position.coords.latitude, 
        'posy': position.coords.longitude, 
        'team_name':$team_name
      },   // post to location.php
      success: function(data) {
        alert(data);
      },

      error: function(data) {
        alert("There may an error on uploading. Try again later"); //This is what displays on the screen every time
      },
    });
  });    
}

You'll notice as well that I have 'team_name' = $team_name -> this is essentially what I want to do, but I cannot find the best way to do this using my existing ajax structure.

EDIT using var teamName = document.getElementById('team_name').value; to get the value from a hidden field just causes the alert to give the error message. In the browser debug it tells me it's a 500 internal server error.

EDIT 2 Here is my html code on the index.php page:

<div class="titleText"><h1><?php 
	echo $stagerow['stage'];
	echo $id;
	$team_name = $_SESSION['team_name']; 
	echo $team_name;
	?></h1>
	You can <a href="http://testphp-olivlaytchev.rhcloud.com/logout.php" style="color:white">logout here.</a> <br></div>
		<div id="map-canvas"></div>
  </head>

	 <input type ="hidden" id="team_name" name="team_name" value="<?php echo $team_name?>" >
  <!-- Script -->
    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
   <script>

And this is the error message I get from the browser POST http://testphp-olivlaytchev.rhcloud.com/location.php 500 (Internal Server Error)send @ jquery.js:9664m.extend.ajax @ jquery.js:9215(anonymous function) @ (index):259

line 259 is $.ajax(

Upvotes: 1

Views: 390

Answers (1)

mdamia
mdamia

Reputation: 4557

if $team_name is a php variable, you can echo it out into a hidden input and grab its val via js 

<input type ="hidden" class="team_name" name="team_name" value="<?php echo $team_name?>" >

You have an error at the section when you pass data in your ajax. 'team_name':$team_name should be team_name: teamName`.

The first arg is passed to HTTP_POST as key index, the second is the value and you don't need $ sign.

var teamName = $('.team_name').val();
data: {
    'posx':position.coords.latitude, 
    'posy': position.coords.longitude, 
     team_name: teamName 
  },   /

in your php you can access it like below.

echo $_POST['data'];

Upvotes: 3

Related Questions