I seem to be having a problem with long polling and IE. This is my first foray into long polling, so I set up a simple test to see if I could make it work. It seems to behave just fine with FF and Chrome, but I'm getting different results with IE.
First, here's some code:
HTML/Javascript:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="js/jquery-ui-1.9.2.min.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function()
{
(function poll()
{
$.ajax({
url: 'events/alert-data.php',
success: function (e)
{
$('#results').append($('<div>Success: ' + e.text + '</div>').fadeIn(1000));
},
error: function (e)
{
console.log(e);
},
dataType: 'json',
complete: poll,
timeout: 10000
});
})();
});
//]]>
</script>
</head>
<body>
<div id="results">hello</div>
</body>
</html>
PHP:
<?php
$time = time();
while (time() - $time < 5) { }
echo json_encode(array('text' => time()));
?>
In FF/Chrome, I'm seeing expected data:
hello
Success: 1356104196
Success: 1356104201
Success: 1356104217
Success: 1356104222
Success: 1356104227
But in IE it repeats the first Success line infinitely. At least I presume it's infinite as it locks up the browser and won't allow me to scroll.
I'm not sure what I'm doing wrong. Any help would be much appreciated.
Thanks in advance.
The problem with IE would appear to be the consequence of caching, probably by IE itself. This could potentially happen in any browser.
Try adding :
cache: false
to the ajax options.
Related
I am running a very simple Jquery.Ajax call as a test. The code should work as it is an example from a programming class. However, on my Windows XAMPP, all I get back in the alert is the ajax.php code in html format... I do get a success 200 code though from the Ajax query. I'm at a loss for what is wrong. Does anyone have any suggestions?
Ajax.html
<!DOCTYPE html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {
// Handler for .ready() called.
useJQuery();
});
function useJQuery() {
$.ajax({
type: 'POST',
url: "ajax.php",
data: { i_want_text:'yes' },
success: function (response) { alert(response); },
});
}
</script>
</head>
<body>
</body>
</html>
Ajax.php
<?
if ($_POST["i_want_text"]) {
print "text received with value of " . $_POST["i_want_text"];
}
?>
from php documentation http://php.net/manual/en/language.basic-syntax.phptags.php
PHP allows for short open tag <? (which is discouraged since it is only available if enabled using the short_open_tag php.ini configuration file directive, or if PHP was configured with the --enable-short-tags option).`
so In ajax.php change <? to <?php
I have small project on PHP and I want to debug it with PHP Tools for Visual Studio. It works fine, debugger works great. But I have part of my project that works as a service, it listen AJAX requests from html pages and send responses in JSON format. In this situation debugger doesn't work at all. I set breakpoints in my php service file and it never fires, but I get correct response in client-side. So, my question is how to debug AJAX requests with PHP Tools?
I make an example of my client and server code to illustrate my problem.
server.php
<?php
if(isset($_REQUEST['response'])) {
echo json_encode('ok');
}
else {
echo json_encode('cancel');
}
?>
client.html
<!DOCTYPE HTML>
<html>
<head>
<title>AJAX test</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script type="text/javascript">
$( document ).ready(function() {
$( "#request" ).bind( "click", function() {
var data = { response: "response" };
$.ajax({
url: "server.php",
type: "POST",
async: false,
timeout: 5000,
dataType: "json",
data: data,
success: function(result) {
$("#response").text(result);
},
error: function(error) {
$("#response").html(error.responseText);
}
});
});
});
</script>
</head>
<body>
<p>
<b>Request: </b> <span id="request">Send request</span>
</p>
<p>
<b>Response: </b> <span id="response">Here will be your response...</span>
</p>
</body>
</html>
So when I set the breakpoint in the server.php on the line with if-statement it doesn't fire, but client side successfully receive server response.
I've found the solution on the DEVSENSE forum
In this case xdebug just doesn't know when it should start debugging. Easist way is to add to php.ini next line:
xdebug.remote_autostart = on
And all works!
I am trying to use jQuery's ajax to call a php script onload. This script will return xml from a url web service, parse through it, and then display bits and pieces of it into a div tag when the page loads (onload). I'm okay with php when it comes to using forms, but getting php scripts to run onload is not working for me. Could someone please look through my code and give me your advice? Thanks in advance.
HTML:
<!doctype html>
<html>
<head>
<title>Word of the Day</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="code.js"></script>
</head>
<body>
<h3>Word of the Day: </h3>
<div id="word_day"></div>
</body>
</html>
JavaScript:
$(document).ready(function() {
$(window).load(function() {
$.ajax({
post: "GET",
url: "word_day.php"
}).done(function() {
alert(this.responseText);
}).fail(function() {
alert(this.responseText);
});
});
});
I did not add my PHP code since I was pretty sure that it wasn't the cause of my frustration.
You don't need those two handlers, just one:
$(document).ready(function()
{
$.ajax(
{
post: "GET",
url: "word_day.php"
}).done(function()
{
alert(this.responseText);
}).fail(function()
{
alert(this.responseText);
});
});
As you had it you were trying to create one handler when the handler fired which was never going to work.
Edit:
Your done/fail part should look like:
}).done(function(data)
{
alert(data);
}).fail(function(jqXHR, textStatus, errorThrown)
{
alert(textStatus);
});
i want to pass a variable from jquery to php but my code doesnt work .I tried very hard but no luck . When i click the button nothing happens.plz help thank you
one more thing i tried this without passing variable and i use only echo command then it works but when i pass variable nothing happens
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("button").click(function(){
var var_data = 5;
$.ajax({
url: "myscript.php",
data: { var_php_data: var_data },
success: function(data) {
// do something;
alert(data);
}
});
});
</script>
</head>
<body>
<button>Change Content</button>
</body>
</html>
myscript.php contains the following code
<?php
echo $_GET['var_php_data'];
?>
Try wrapping your script in a document ready handler. Also you have a trailing comma (,) after the success callback that you should remove. Also you should use a , instead of ; after the data parameter. Specifying the HTTP verb for your AJAX request might also be useful:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('button').click(function() {
var var_data = 5;
$.ajax({
url: 'myscript.php',
type: 'GET',
data: { var_PHP_data: var_data },
success: function(data) {
// do something;
alert(data);
}
});
});
});
</script>
</head>
<body>
<button>Change Content</button>
</body>
</html>
The reason you need to wrap your click registration in a document ready handler is because you put your script inside the <head> section of your markup and the button hasn't yet been loaded by the browser when you attempt to subscribe to its click handler.
You can install Firebug (Firexox plugin), or user something similar for your browser to see real HTTP request and response. If you will post them here it will be more simple to find the problem.
Track request in FireBug. You can find by FB did request success (200) as well as date send by request.
Also, try http://{your_host}>/myscript.php?var_PHP_data=echoText
Addition:
Darin Dimitrov described the problem right way
I'd like to track when people click the Facebook "Like" button on my website.
I have a small script set-up, but it doesn't seem to work and I'm out of ideas of what it could be. Any suggestions? The AppID is correct and this script is just for testing so don't mind the lack of validation:
index.html
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<title>FB Like Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
<div id="fb-root"></div>
<script type="text/javascript">
$(document).ready(function() {
window.fbAsyncInit = function() {
FB.init({appId: 'x', status: true, cookie: true, xfbml: true});
FB.Event.subscribe('edge.create', function(href, widget) {
$.ajax({
type: 'POST',
url: 'like-sql.php',
data: ({liked : 1})
});
});
FB.Event.subscribe('edge.remove', function(response) {
$.ajax({
type: 'POST',
url: 'like-sql.php',
data: ({liked : 0})
});
});
};
(function() {
var e = document.createElement('script');
e.type = 'text/javascript';
e.src = 'http://connect.facebook.net/nl_NL/all.js#appId=x&xfbml=1';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
});
</script>
<fb:like href="http://x.x.x" layout="button_count" show_faces="true" width="500"></fb:like>
</body>
</html>
like-sql.php
<?php
$status = $_POST['liked'];
mysql_query("UPDATE `fb_like` SET umk_like = $status WHERE user_id = '3432'");
?>
I'm new to this whole jQuery ajax thingy, so I don't really know how I should debug this. Any suggestions are welcome :)
EDIT: Nevermind guys I got it.
I'm testing this in an external file, where I don't have jQuery included by default ;) I can't believe it took me this long to figure it out, lol. Thanks anyway for all the help!
Try to alert() something in the event listener itself, to see if it is subscribed correctly
FB.Event.subscribe('edge.create', function(href, widget) {
alert('Like caught !');
$.ajax({
type: 'POST',
url: 'like-sql.php',
data: ({liked : 1})
});
});
and add notify=true to fb:like
<fb:like notify="true" href="http://x.x.x" layout="button_count" show_faces="true" width="500"></fb:like>
I had the same problem with "comment.create", and I solved it by notify="true", and subscribing to "comments.add" ! but I still can't subscribe to "comment.remove"!
Nevermind guys I got it.
I'm testing this in an external file, where I don't have jQuery included by default ;) I can't believe it took me this long to figure it out, lol. Thanks for all the help though!