jQuery and AJAX, 'post' data to .PHP - php

I can't seem to get the 123.php return information to use in the html document where I use jQuery-AJAX-thing (to change the content of div named div1).
Im pretty new to JavaScript, PHP and html; but tried some tutorials now and can't seem to make em fit my needs so would really appriciate some help.
Here is my 123.html that should use AJAX-jQuery thing to call my 123.php
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$.ajax({
type: "POST",
url: "/123.php",
data:{id:"3", name:"John Doe"},
success:function(response){
alert('ok-'+data+'-'+respText+'-'+xhr);
$("#div1").html(respText);
},
error: function (request, status, error) {
alert(request.responseText);
}
});
});
</script>
</head>
<body>
along with the 123.php
<?php
$my_id = trim($_REQUEST['id']);
$my_name = trim($_REQUEST['name']);
$file = '123.txt';
// Open the file to get existing content
$current = file_get_contents($file);
// Append to the file
$current .= 'time:' . time() . ',id:' . $my_id . ',name:' . $my_name . "\n";
// Write the contents back to the file
file_put_contents($file, $current);
echo 'received following: id: ' . $my_id . ' and name: ' . $my_name;
?>
The 123.txt was just to see if the php file responded, and it does, but only when I pass
/123.php?id=7&name=Jane%20Doe
Elsewhere using the 'post' method, no response (gets errors from the JavaScript)
So I guess it's the structure of AJAX/jQuery;
for the attempt listed above, I get the error in JavaScript-console "Uncaught error: reference not defined"
and when I use the following 123.html instead (replacing the other 123.html)
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$("#div1").post("/123.php",{id:"3",name:"John Doe"},function(data,status){alert("Data: " + data + "\nStatus: " + status);});
});
});
</script>
</head>
<body>
<div id="div1">Text that should be changed</div>
<button>Press me, I'm a button</button>
</body>
</html>
I get "Uncaught TypeError: Undefined is not a function", I tried to look it up and some people wrote that it could be solved inserting
(function ($) {
$(document);
}(jQuery));
However it did not (inserted it in the very top, just below the script-start-tag )
I can't seem to figure what I'm doing wrong, and I really appriciate any help and directions as for where to look.
Thanks in advance

Your php is not returning JSON or XML therefore you cannot get data. Replace this
success:function(response){
alert('ok-'+data+'-'+respText+'-'+xhr);
$("#div1").html(respText);
},
with this
success:function(response){
alert('ok-'+response);
$("#div1").html(response);
},

Related

jQuery Json response printing html tags

When I do:
<html>
<head>
</head>
<body>
<?php
$value = isset($_GET['send_request']) ? $_GET['send_request'] : false ;
if ($value) {
echo $value;
return;
}
?>
A
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script type="text/javascript">
function test() {
// data to send
var data = { send_request: 'Yes'}
request = $.ajax({
method: 'get',
data: data
});
request.done(function(response){
console.log(response);
});
}
</script>
</body>
</html>
In the console I am getting:
<html>
<head>
</head>
<body>
Yes
Why is this?
The error here is that your php code executes after you have already outputted this part:
<html>
<head>
</head>
<body>
Move the php code to the top of the page and it will fix this :)
Keep in mind that when you execute php script, php will not ommit html, but rather consider it output and just carry on :)
The best practice is to move your PHP codes to a separate PHP file and specify it's path in the url option of your ajax function. That new PHP file should of course not contain HTML before your PHP codes as already pointed out.

$.get() not working Jquery

I'm tryin to get a value in URL from php file via $.get(), here is the code:
PHP folder called 'jquery_con4.php':
echo (isset($_GET['req'])) ? 'found':'notfound';
JQuery called 'pass.js':
$.get('connection/jquery_con4.php', function(data){
alert(data);
});
the main folder called 'password_c.php' which include the javascript called 'pass.js' which has $.get but it shows me in note 'notfound', & if remove if echo, it shows be 'undefined index:req'
--- URL is: 'http://localhost/series/skyface/password_c.php?req=65yDq0zI39UcRSF'
Thanks!
http://localhost:8888/series/skyface/password_c.php?req=65yDq0zI39UcRSF
In order to pass the 'req' value from the URL querystring to the jquery_con4.php script, you need a JS function that will grab it for you and pass it into an ajax request.
Below is an example of how that might work.
/series/skyface/password_c.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="../../main.js"></script>
</body>
</html>
/main.js:
jQuery(document).ready(function($) {
function getParameterByName(name) {
name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]");
var regex = new RegExp("[\\?&]" + name + "=([^&#]*)"),
results = regex.exec(location.search);
return results === null ? "" : decodeURIComponent(results[1].replace(/\+/g, " "));
}
function success(data) {
console.log(data);
}
$.ajax({
url: '/connection/jquery_con4.php',
data: {req : getParameterByName('req')},
success: success
});
});
/connection/jquery_con4.php:
<?php echo(isset($_GET['req'])) ? 'found' : 'notfound'; ?>

Use jQuery in external php file

I have a php file that I load into another php file with jQuery. This works, but the moment I start using jQuery in the 'external file', I get ERROR 500.
The reason I used this approach is because this is handy to refresh the data after an AJAX function.
This I have:
test.php:
<script type="text/javascript" src="js/modernizr.custom.29473.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script>
$(function () {
$(document).tooltip({
items: ".plupic , .ingr",
content: function() {
var element = $( this );
if ( element.is( ".plupic " ) ) {
var src = element.attr('src');
return "<img src='" + src + "' style='max-height: 300px; max-width: 300px;'>";
}
if ( element.is( ".ingr" ) ) {
var txt = element.text();
return txt;
}
}
});
$('#kasticket').load('cart.php');
});
</script>
</head>
<body>
<div class="container">
<div id="kasticket"></div><!-- Load data with jQuery-->
cart.php:
I just do a select from the database and write some data to a table with echo();
This works perfectly, but the moment I want to use jQuery, I goes all wrong...(I know this for sure because the jQUery works in a local html file and putting this line in comment makes my php working again)
echo("
<script>
jQuery(document).ready(function() {
if($('#L$MyAant').width() < 70) {
$('.TR1$MyAant').show();
$('.TR2$MyAant').hide();
}else{
$('.TR2$MyAant').show();
$('.TR1$MyAant').hide();
}
});
</script>
");
I have no idea what I'm doing wrong.
If its any help: http://www.itreflex.be/TestAcc/test.php (with currently the jQuery line in comment).
And this is cart.php, exported to txt, it was to long to paste here.
hard to tell without the full source code but I have got a couple of ideas:
First Error 500 should be the HTTP code for internal server error, which basically means that the error lies on the server, then on the PHP side.
Could it be possible that you are mixing up PHP and jQuery on some of your other statements not posted here?
Second, you missed a single quote on your line
$('#kasticket').load(cart.php');
In your cart.php remove the brackets after echo ... For example
echo "<script>
jQuery(document).ready(function() {
if($('#L$MyAant').width() < 70) {
$('.TR1$MyAant').show();
$('.TR2$MyAant').hide();
}else{
$('.TR2$MyAant').show();
$('.TR1$MyAant').hide();
}
});
</script>";
Try this above line in your cart.php and see if that works.

Getting a json object in php

I'm doing GeoRef application. This is my index.php:
<!doctype html>
<html lang="es">
<head>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"> </script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.2.js"></script>
<script type="text/javascript" src="http://www.ign.gob.ar/argenmap/argenmap.jquery.min.js"></script>
<script>
$(document).ready(function () {
$.ajax({
url: 'getcoord.php',
dataType: 'json',
error: function(){
alert("ERROR");
},
success: function(res) {
var ico;
ico='Icon.png';
var marcador;
$('#mapa').argenmap();
$('#mapa').centro(-34.597907,-58.385557)
$('#mapa').zoom(4);
$('#mapa').capaBase('satellite');
for(var i=0;i<res.length;i++)
{
marcador=[{lat: res[i].latitud, lng:res[i].longitud,icono:ico}];
$('#mapa').argenmap().agregarMarcadores(marcador);
}
} });});
</script>
</head>
</html>
And this is my getcoord.php file:
<?php
include("config.php");
require("db.inc");
$sql = "SELECT * FROM datos_mapa";
$res = buscar($sql);
$arry=array();
foreach ($res as $r)
{
$arr = array('longitud' => $r['longitud'],'latitud' => $r['latitud']);
array_push($arry,$arr);
}
echo json_encode($arry);
?>
My problem is that, when I run getcoord.php using json_encode($arry), I see the information I want but, it doesn´t return to index.php. I´ve tried:
Using json in dataType. Gives me a Json Object but with Object in each field instead of latitude and longitude.
Using jsonp in dataType. Results an error.
Using text in dataType. I get the information I want, but as a string not as an Object.
Replacing echo json_encode($arry) with:
a) json_encode($arry);
b) print_r(json_encode($arry));
c) echo $_GET['receive'].'('.json_encode($arry).');';
But getting the same error.
Why I´m not getting the information in the format I want?
I was trying this code at work where apache is configured and didn´t work (keeps getting error when using dataType: 'json'). In my personal computer, using xampp, it works. So I think the code is right. Is there anything else I should configure?

error missing ; before statement in jquery when sending serialized xml through jquery

I am getting this error on var data =<?php echo serialize($msg);?>; line of the code below. console also raises data not defined error. I f put quotes around data, then this error goes but 1st error stays.
EDITED
//Raw xml
$result = curl_exec($ch);
curl_close($ch);
$xml = simplexml_load_string($result);
return $xml;
}
?>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js">
</script>
</head>
<body>
<script type="text/javascript"> <?php $msg = searchResults('windows');?>;
var data ="<?php echo serialize($msg);?>";
</script>
<script type="text/javascript">
$(document).ready(function()
{
$.ajax({
url: "script.php",
type: "POST",
data: data,
success: function(){
alert("success");
}
});
return false;
});
</script>
</body>
</html>
I tried to see but couldn't figure out any problem
this is script.php
<?php
var_dump($_POST);
?>
this is xml from twitter
var data =O:16:"SimpleXMLElement":5:{s:2:"id";s:43:"tag:search.twitter.com,2005:search/#DIYSe_D";s:4:"link";a:4:{i:0;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:9:"text/html";s:4:"href";s:45:"http://search.twitter.com/search?q=%23DIYSe_D";s:3:"rel";s:9:"alternate";}}i:1;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:20:"application/atom+xml";s:4:"href";s:58:"http://search.twitter.com/search.atom?q=%23DIYSe_D&rpp=100";s:3:"rel";s:4:"self";}}i:2;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:37:"application/opensearchdescription+xml";s:4:"href";s:40:"http://search.twitter.com/opensearch.xml";s:3:"rel";s:6:"search";}}i:3;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:20:"application/atom+xml";s:4:"href";s:84:"http://search.twitter.com/search.atom?q=%23DIYSe_D&rpp=100&since_id=7856019371724800";s:3:"rel";s:7:"refresh";}}}s:5:"title";s:25:"#DIYSe_D - Twitter Search";s:7:"updated";s:20:"2010-11-24T21:53:28Z";s:5:"entry";a:3:{i:0;O:16:"SimpleXMLElement":7:{s:2:"id";s:44:"tag:search.twitter.com,2005:7552404006371328";s:9:"published";s:20:"2010-11-24T21:53:28Z";s:4:"link";a:2:{i:0;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:9:"text/html";s:4:"href";s:50:"http://twitter.com/_smir/statuses/7552404006371328";s:3:"rel";s:9:"alternate";}}i:1;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:9:"image/png";s:4:"href";s:67:"http://s.twimg.com/a/1289849896/images/default_profile_5_normal.png";s:3:"rel";s:5:"image";}}}s:5:"title";s:59:"#DIYse_D DELIVERAB: twitter messages 2_inc 1, 19th OCT 2010";s:7:"content";s:248:"<a href="http://search.twitter.com/search?q=%23DIYse_D"
onclick="pageTracker._setCustomVar(2, 'result_type', 'recent', 3);pageTracker._trackPageview('/intra/hashtag/#DIYse_D');"><b>#DIYse_D</b></a> DELIVERAB: twitter messages 2_inc 1, 19th OCT 2010";s:7:"updated";s:20:"2010-11-24T21:53:28Z";s:6:"author";O:16:"SimpleXMLElement":2:{s:4:"name";s:13:"_smir (Smeer)";s:3:"uri";s:24:"http://twitter.com/_smir";}}i:1;O:16:"SimpleXMLElement":7:{s:2:"id";s:44:"tag:search.twitter.com,2005:7551711354822656";s:9:"published";s:20:"2010-11-24T21:50:42Z";s:4:"link";a:2:{i:0;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:9:"text/html";s:4:"href";s:58:"http://twitter.com/Babar_Shahzad/statuses/7551711354822656";s:3:"rel";s:9:"alternate";}}i:1;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:9:"image/png";s:4:"href";s:103:"http://a1.twimg.com/profile_images/1090185625/29465_391454998679_533808679_3864564_6071800_n_normal.jpg";s:3:"rel";s:5:"image";}}}s:5:"title";s:58:"#DIYse_D DELIVERAB: twitter messages 2_inc2, 24th OCT 2010";s:7:"content";s:247:"<b>#DIYse_D</b> DELIVERAB: twitter messages 2_inc2, 24th OCT
2010";s:7:"updated";s:20:"2010-11-24T21:50:42Z";s:6:"author";O:16:"SimpleXMLElement":2:{s:4:"name";s:32:"Babar_Shahzad (Babar Shahzad Ch)";s:3:"uri";s:32:"http://twitter.com/Babar_Shahzad";}}i:2;O:16:"SimpleXMLElement":7:{s:2:"id";s:44:"tag:search.twitter.com,2005:7550668919283712";s:9:"published";s:20:"2010-11-24T21:46:34Z";s:4:"link";a:2:{i:0;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:9:"text/html";s:4:"href";s:58:"http://twitter.com/Babar_Shahzad/statuses/7550668919283712";s:3:"rel";s:9:"alternate";}}i:1;O:16:"SimpleXMLElement":1:{s:11:"#attributes";a:3:{s:4:"type";s:9:"image/png";s:4:"href";s:103:"http://a1.twimg.com/profile_images/1090185625/29465_391454998679_533808679_3864564_6071800_n_normal.jpg";s:3:"rel";s:5:"image";}}}s:5:"title";s:53:"#DIYse_D DELIVERAB: twitter messages 1, 9th OCT 2010";s:7:"content";s:242:"<b>#DIYse_D</b> DELIVERAB: twitter messages 1, 9th OCT 2010";s:7:"updated";s:20:"2010-11-24T21:46:34Z";s:6:"author";O:16:"SimpleXMLElement":2:{s:4:"name";s:32:"Babar_Shahzad (Babar Shahzad Ch)";s:3:"uri";s:32:"http://twitter.com/Babar_Shahzad";}}}};
This is my json equivalent code for same but its not working. I put it here because many if not all people are referring me add json to this code i.e OP, actually what I was wanting here but OP to send xml to php as json did not work for me earlier'
*This code raises no console errors, but failure alert is ouput * curl is sending results, I have tested that in a test php block just before ajax in HTML.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<?php
function searchResults($q) {
$host = "http://search.twitter.com/search.atom?q=" . urlencode( $q ) . "&rpp=100";
$ch = curl_init();
curl_setopt($ch, CURLOPT_URL, $host);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, TRUE);
//Raw xml
$result = curl_exec($ch);
curl_close($ch);
$xml = simplexml_load_string($result);
return json_encode($xml);
}
?>
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js">
</script>
</head>
<body>
<script type="text/javascript"> var msg_top = <?php echo searchResults('windows');?>;
</script>
<script type="text/javascript">
$(document).ready(function()
{
$.ajax({
url: "script.php",
type: "POST",
dataType: "json",
data: msg_top,
success: function(msg){
alert("success");
}
});
alert("failure");
});
</script>
</body>
</html>
Try
var data="<?php echo json_encode(serialize($msg));?>";
EDIT: I'm sorry, the json_encode() function automatically adds the quotes to strings, so the code should look like:
var data=<?php echo json_encode(serialize($msg));?>;
And there's some redundant semicolon (;) after the first ?>, you should remove it.
serialize does not output JavaScript.
Try json_encode instead.
You're emitting Javascript code that contains the raw return value of PHP's serialize method.
This return value is not valid Javascript syntax, so you're getting a syntax error.
You need to wrap it in a string, and hope and pray that it never includes quotes or newlines.
Also, you probably want to pass the data variable to $.ajax, not the literal string "data".
<?php $msg = searchResults('windows');?>; Why is ; here? (the last one)
Edit:
Is something that i dont understand here
<script type="text/javascript"> <?php $msg = searchResults('windows');?>;
var data =<?php echo serialize($msg);?>;
</script>
Why do you call <?php $msg = searchResults('windows');?>; inside <script>...</script> and why is there a ; after

Categories