Error to getting response while sending ajax request - javascript

I'm new to Ajax. I'm writing two function in one file called home.php and make an Ajax call to members.php.
My problem is when I send an data with ajax call I fail to get response.
home.php
<script language="javascript" type="text/javascript">
var httpObject=false;
var httpObject1=false;
if(window.XMLHttpRequest){
httpObject = new XMLHttpRequest();
httpObject1 = new XMLHttpRequest();
}else if(window.ActiveXObject){
httpObject = new ActiveXObject("Microsoft.XMLHttp");
httpObject1 = new ActiveXObject("Microsoft.XMLHttp");
}
function logout(){
if(httpObject.readyState == 4 && httpObject.status == 200){
var response = httpObject.responseText;
if(response == "logout"){
window.location.href="index.php";
}
else{
error.innerHTML = "Sorry, Invalid Login.";
}
}
}
function get_Request_Member_List(type){
var member_Type = type;
var queryString = "?data1=" + member_Type ;
if(httpObject1.readyState == 4 && httpObject1.status == 200){
var response = httpObject1.responseText;
document.getElementById(type).innerHTML = response;
}
}
httpObject.open("GET", "logout.php" ,true);
httpObject.send(null);
httpObject1.open("GET", "members.php"+queryString ,true);
httpObject1.send(null);
</script>
members.php
<?php
echo "hello";
?>

Don't forget to add an onreadystatechange event handler to your XMLHTTPRequest, e.g.:
httpObject.onreadystatechange = logout;

Related

Why is this Ajax not working with my php and not making an alert happen?

I am very new in programming websites I created a website already but am now attempting to add in a database. I have that all set up but ajax isnt working and I'm not sure what I'm doing wrong.
Here is my javascript code :
<script>
var ajax = new XMLHttpRequest();
var method = "Get";
var url = "data.php";
var asynch = true;
ajax.open(method, url, asynch);
ajax.send();
//recive ajax
ajax.onreadystatechange = function()
{
if(this.readyState == 4 && this.status == 200)
{
alert(this.responseText);
}
}
/*
function chbg(color, name) {
document.getElementById(name).style.backgroundColor = color;
document.getElementById(name + 'Chore').style.backgroundColor = color;
document.getElementById(name+ 'Bathroom').style.backgroundColor = color;
}
function openForm() {
document.getElementById("myForm").style.display = "block";
}
function closeForm() {
document.getElementById("myForm").style.display = "none";
}
*/
</script>
Here's the php all I'm trying to do right now is get the 2 to connect.
<?php
echo "Hello World";
?>
I didn't understand what you're exactly trying to do but your php file just echo something and he does not return something so your responseText property is empty.

how to send very long data in ajax url?

i am using php and ajax together to access data from user and insert into database.problem is that it works fine with small string but when i try to send data on 10000 characters browser prompts an error saying url to long.. i can make change in php but i want it to be dynamic so i have to it using this way only.. help me plz.
function submitQuestion(){
var x=document.forms['Ask']['title'].value;
var y=document.forms['Ask']['description'].value;
if(x.length == 0 || y.length == 0){
alert('Insufficient Data');
}else{
startLoading();
console.log(y);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function(){
if(this.readyState == 4 && this.status==200){
console.log(this.responseText);
if(this.responseText == "All Done"){
clearInterval(startLoadingClearInt);
alert("data Inserted");
// window.location.replace('../profile/userprofile.php');
}
}
};
//here x is very inn some cases and produces an error
xhttp.open("POST","./submitQuestion.php?title="+x+"&description="+y, true);
xhttp.send();
}
}
You cannot transfer large data via url (as messerbill said). You have to send them in the Body:
function submitQuestion(){
var x=document.forms['Ask']['title'].value;
var y=document.forms['Ask']['description'].value;
if(x.length == 0 || y.length == 0){
alert('Insufficient Data');
}else{
startLoading();
console.log(y);
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function(){
if(this.readyState == 4 && this.status==200){
console.log(this.responseText);
if(this.responseText == "All Done"){
clearInterval(startLoadingClearInt);
alert("data Inserted");
// window.location.replace('../profile/userprofile.php');
}
}
};
//here x is very inn some cases and produces an error
xhttp.open("POST","./submitQuestion.php", true);
xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
xhttp.send("title="+x+"&description="+y");
}
}
inside the PHP-Script you get the data via the $_POST Array, not via the $_GET Array!

AJAX xmlhttp.open sumit data using POST method

I am trying to send a form data using POST method and xmlhttp.open
Please help find the error in my code
function submitChat() {
if (form1.msg.value == '' ) {
alert ('ALL FIELDS ARE MANDATORY');
return;
}
var xmlhttp = new XMLHttpRequest();
var msg = form1.msg.value;
var params = 'msg=helloooooooo';
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById('chatlogs').innerHTML = xmlhttp.responseText;
}
}
xmlhttp.open('POST', 'rtest.php?rid=14', true);
xmlhttp.send(params);
}
Everything is fine and it is working with GET method. but POST method is not working. Please help.

XMLHttpRequest no answer from server

I have tried to get i connection to an php file but i don't recive any reponse from server is anything wrong?,
function request(){
// Create our XMLHttpRequest object
var hr = new XMLHttpRequest();
// Create some variables we need to send to our PHP file
var url = "http://people.dsv.su.se/~pierre/courses/05_ass/ip3/3/3.7.1/example.php";
var number1 = document.getElementById("number1").value;
var number2 = document.getElementById("number2").value;
var vars = "?number1="+number1+"&number2="+number2
hr.open("POST", url, true);
// Set content type header information for sending url encoded variables in the request
hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("result").innerHTML = return_data;
}
}
// Send the data to PHP now... and wait for response to update the status div
hr.send(vars); // Actually execute the request
document.getElementById("result").innerHTML = "processing...";
}
I don't get any answer from the server were have i done wrong?
I have now tried to write it in jquery insteed but still no response from server
$(document).ready(function() {
// Skicka nummrerna vid klick på #calculate
$('#calculate').click(function() {
var url = "http://people.dsv.su.se/~pierre/courses/05_ass/ip3/3/3.7.1/example.php?";
var number1 = document.getElementById("number1").value;
var number2 = document.getElementById("number2").value;
var numbers = url + number1 + "&" + number2
if (window.XMLHttpRequest)
{// Kod för nya webbläsare
xmlhttp=new XMLHttpRequest();
}
else {//om det inte är en nyare webbläsare
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function() {
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
// Skriv ut svaret från servern i result
document.getElementById("result").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET",numbers,true);
xmlhttp.send();
alert(numbers);
});
});
You're formatting your variables as if you're using them in a GET request, but then setting your request up for a POST.
[edit: to demonstrate comments]
Try changing these two lines.
hr.open("GET", url + vars, true);
hr.send();
[edit] Full original code with the changes
function request(){
// Create our XMLHttpRequest object
var hr = new XMLHttpRequest();
// Create some variables we need to send to our PHP file
var url = "http://people.dsv.su.se/~pierre/courses/05_ass/ip3/3/3.7.1/example.php";
var number1 =22;// document.getElementById("number1").value;
var number2 =22;// document.getElementById("number2").value;
var vars = "?number1="+number1+"&number2="+number2
hr.open("GET", url + vars, true);
// Set content type header information for sending url encoded variables in the request
//hr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
// Access the onreadystatechange event for the XMLHttpRequest object
hr.onreadystatechange = function() {
if(hr.readyState == 4 && hr.status == 200) {
var return_data = hr.responseText;
document.getElementById("result").innerHTML = return_data;
}
}
// Send the data to PHP now... and wait for response to update the status div
hr.send(); // Actually execute the request
document.getElementById("result").innerHTML = "processing...";
}
You need to send() your request with the data as the param. Something like:
params = "number1="+number1+"&number2="+number2;
hr.send(params);
Here is the complete code in jQuery format:
$(document).ready(function () {
$('#calculate').click(function () {
var url = "http://people.dsv.su.se/~pierre/courses/05_ass/ip3/3/3.7.1/example.php?number1=" + $("#number1").val() + "&number2=" + $("#number2").val();
$.ajax(url, {
complete: function (data, textStatus, jqXHR) {
//Put the code that handle the response here
$("#result").html(data.responseText);
}
});
});
});

Using XMLHttpRequest for Mozilla Extension development

I have some problems of calling a php file using Ajax in my
Mozilla Extension.
The javascript (Ajax) and php are both located at directory /myextension/content, I am call the php using
function ajaxFunction(){
var req = new XMLHttpRequest();
req.open('GET', 'myphp.php', true);
req.onreadystatechange = function (aEvt) {
if (req.readyState == 4) {
if(req.status == 200)
alert(req.responseText);
else
alert("Error\n");
}
};
req.send(null);
}
, and my php looks like
<? php
echo "Server Received with thanks!";
?>
I keep geting "alert("Error\n");".
Did i do anything wrong?
Well formatted Ajax code for Firefox:
var URL="http://yourdomain.com/Work.php?val=Test";
var objXmlHttp = null;
try
{
objXmlHttp = new XMLHttpRequest();
}
catch(e)
{return;}
objXmlHttp.onreadystatechange=function()
{
if ((objXmlHttp.readyState == 4 || objXmlHttp.readyState == "complete") && objXmlHttp.status == 200)
{
//Write code for success
}
else if (objXmlHttp.status == 404)
{
//OnError
}
else
{
//OnWait
}
}
objXmlHttp.open("GET", URL, true);
objXmlHttp.send(null);

Categories

Resources