I found a script for real chat using $.ajax jQuery, but it refereshes only my massages. For example:
I write to You: Hello, this message refresh for me.
You write to me: Hey, to see your message I must refresh a site by clicking F5, but You do not have to click F5. Something wrong!
My $.ajax code:
$(document).ready(function() {
$("#lupnijto").click(function (e) {
$("#lupnijto").hide();
$("#LoadingImage").show();
var zeszyt_value = 'zeszyt='+ $("#contentText").val(); //build a post data structure
jQuery.ajax ({
type: "POST",
url: "response.php",
dataType: "text",
data: zeszyt_value,
cache: false,
success: function(response) {
$("#responds").prepend(response);
$("#contentText").val('');
$('#contentText').focus();
$("#lupnijto").show();
$("#LoadingImage").hide();
},
error:function (xhr, ajaxOptions, thrownError) {
$("#lupnijto").show();
$("#LoadingImage").hide();
alert(thrownError);
}
});
});
});
What am I doing wrong? Why data only refreshes for me? How the chat works? Am I doing it correct? I accept answers. Thanks.
For such real time applications, you need to use WebSockets: On MDN
,you can also check on some WebSockets API Socketio for Node.js
I do advice those, but also you can use AJAX (not recommended).
You can use Socket.IO. For non-WebSockets browsers you can use Engine.IO.
Related
good day, im trying to consume a web service in react, but im having problems with the ajax function, i'm not sure if is working my code is this:
prox= {"email":email, "password": password};
//tag comment
$.ajax({
type: 'POST',
url: (web service url),
data: JSON.stringify(prox),
contentType: "application/json; charset=utf-8",
crossDomain: true,
dataType: 'json',
success: function(data) {
this.setState({success: true, result: data});
alert("success");
this.setState({prueba: 'success'});
}.bind(this),
error: function() {
this.setState({failure: true});
alert("failure");
this.setState({prueba: 'failure'});
}.bind(this)
});
but i dont have any alert, when i click the button only re-render the form, the function handdle submit works, i try it putting a confirm() in the space where the //tag comment is and the confirm pop up, but the alerts dont, i think that i have an error in the function or something, thank's for the help.
I didn't run the script but just looking at it I imagine the problem could be your bind(this)
this.setState to me should be an error “is not a function” as this is not the react object. To get an alert try placing the alert as the first state.
To be sure just look at your browser console.
It looks like its working for the most part. I threw it into a JSBin and nothing seems to be out of the ordinary.
http://jsbin.com/rulaguxote/1/edit?html,js,output
I kept your JSX mostly the same, and added a few things in the component to help you visualize its state. Click the button to send a fake ajax request. Depending on the state, it will either send back an HTTP status of 200 or 400 (success or failure). This way, you can see how the success() and error() functions behave.
Another thing to note: If you are concerned that your .bind(this) is the reason your code is not working, you can specify the context like this:
$.ajax({
type : 'POST',
url : '/test',
data : JSON.stringify(prox),
contentType : "application/json; charset=utf-8",
context : this, //use this instead of .bind
success : function (data) {
this.setState({success : true, failure : false});
alert("success");
},
error : function () {
this.setState({failure : true, success : false});
alert("failure");
}
});
Let me know if you have any questions.
Doing some extensive research i see that my real problem whas the same origin policy, now im working fine in the localhost version of the project, thank you.
I have to update a large collection so I am calling in a loop an web api. I use jQuery.ajax()
Something like this:
$.ajax({
type: 'GET',
url: 'http://www.somesite.com/API/API.php',
jsonpCallback: 'API_SC4',
contentType: "application/json",
dataType: 'jsonp',
data:'action=update&page='+collection[currentIndex].name+'&callback=API_SC4',
async:false,
success: function(data) {
//use data for update of collection[currentIndex]
UpdateNext(currentIndex+1);
},
error: function(e) {
//interpret error
UpdateNext(currentIndex+1);
}
});
The problem is the collection is quite large and sometimes I get a 502 Bad Gateway error and the ajax error handler is not called.
I even tried $( document ).ajaxError() but i'm doing a cross-domain jsonp call , and it seems .ajaxError() does not get called in that situation.
Is there any way to handle that error? Something at window level?
I can see the error in the Chrome development console , and I was thinking there might be a way.
Thanks
Yes, there is: statusCode. See the jQuery documentation on AJAX for details.
Simple example:
$.ajax({
statusCode: {
502: function () {
alert('Fail!');
}
}
});
I ame using html with some jQuery to try out some JSON requests. I did a bit of research and tried making something small just to test it out. but when i run the script in my browser(Google Chrome) i dont get anything besides my html/css stuff. here is the code:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
console.log("Test");
console.log($.get("https://prod.api.pvp.net/api/lol/euw/v1.1/summoner/by-name/kerrie?api_key=[key]"));
</script>
*[key] is my key from the api owners(not to be shared on the internet).
when i check the network tab it says "304, not modified" i dont if this has anything to do wit it.
I'm just starting with websites and JavaScript/jQuery any help would be helpfull.
For better understanding you can call ajax method as below
$.ajax({
url: 'https://prod.api.pvp.net/api/lol/euw/v1.1/summoner/by-name/kerrie?api_key=[key]',
type: 'GET',
dataType: 'JSON',
async: false,
error: function(){},
success: function(resp){
// resp variable will be your JSON responce
}
}
});
I have an eye tracker (mirametrix) running as a server in localhost. In order to capture data from this I should send a xml request as given below;
SEND:<GET ID="TIME_TICK_FREQUENCY" />
I have a web-app running as the client and I need to make a request to this server through that. I wrote the following code but it doesn't seem to send the request properly to the server.
var request = $.ajax({
url: "http://127.0.0.1:4242",
type: "GET",
dataType: "xml",
data: {
data:'<GET ID="TIME_TICK_FREQUENCY" />'
},
});
Can someone please help me with this ?
Thanks in advance
$.ajax({
url: ajaxurl,
data: "<root><blah><blah></root>",
type: 'POST',
contentType: "text/xml",
dataType: "text",
success : parse,
error : function (xhr, ajaxOptions, thrownError){
console.log(xhr.status);
console.log(thrownError);
}
});
I think you need to post it.
this is not plain javascript.. looks more like jquery.. also what do you mean with 'properly'. It's kind sending it, but not really? Aside from that, I see the following problems
The url is wrong, and although your browser may handle it, your url should end with a slash.
Your xml is invalid. Needs to start with <?xml version="1.0"?>.
If you accessed this script through a different host than 127.0.0.1., or if the script is running on a different port than 4242, this will not work without CORS headers on the server.
I trying to make the AJAX request time-out if the web server goes down. Does anyone have a good way of doing this?
jQuery offers a beautiful solution
$.ajax({
type: "GET",
timeout: 5000,
url: "myurl.com",
success: function(data) {
alert('Data load: '+ data);
},
error: function(){
alert('Error loading data');
}
});
Depends on what framework are you using. For example jQuery.ajax support a timeout option that does this. You can also set it globally using jQuery.ajaxSetup.