I want to send and receive data from php files. What is the best possible way to do this?
What is the best replacement for GDownloadUrl in Google Map V3?
Here is my existing function to check if I inserted successfully:
function checkSaveGeoFenceData(data,code)
{
//var geoFenceDataJson = eval('(' + json + ')');
if(code===200)
{
//alert("JSON VALUE : "+data+"test");
if(data=="SMGFE\n")
{
alert("Geo Fence " +
document.getElementById("geoFenceName").value +
" Already Exist");
}
else {
alert("Successfully Inserted");
window.opener.location.reload();
window.close();
}
}
else
{
alert("Fail to insert");
}
}
Existing function to grab data from php:
function processtViewData(json)
{
dataJson = eval('(' + json + ')');
var totalData = dataJson.data1.length;
}
There is no equivalent to GDownloadUrl in the API V3. Loading data via AJAX is a general javascrip task that is not specific to the API or to Google Maps.
Here's a function that will do the same:
function ajaxLoad(url,callback,postData,plain) {
var http_request = false;
if (window.XMLHttpRequest) { // Mozilla, Safari, ...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType && plain) {
http_request.overrideMimeType('text/plain');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) {
alert('Giving up :( Cannot create an XMLHTTP instance');
return false;
}
http_request.onreadystatechange = function() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
eval(callback(http_request));
}
else {
alert('Request Failed: ' + http_request.status);
}
}
};
if (postData) { // POST
http_request.open('POST', url, true);
http_request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
http_request.setRequestHeader("Content-length", postData.length);
http_request.send(postData);
}
else {
http_request.open('GET', url, true);
http_request.send(null);
}
}
Make sure your server responds with a content-type:text/plain header
Call it with postdsata:
var postdata = 'a=1&b=2';
ajaxLoad(serverUrl,myCallback,postdata);
function myCallback(req){
var txt = req.responseText;
// optional, if needed to evaluate JSON
eval(txt);
}
Related
I am trying to go to another page after login so How can I pass to another page after successfully login using Ajax and php ? when ajax send a request to php and then get the response like (if the response is ('true') or ('false') this responses depends on checking the username and password) so i do not know how to deal with this response in ajax to use it as a condition to pass to the next page. please help.
function doCallAjax(Mode) {
HttPRequest = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
HttPRequest = new XMLHttpRequest();
if (HttPRequest.overrideMimeType) {
HttPRequest.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
HttPRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
HttPRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!HttPRequest) {
alert('Cannot create XMLHTTP instance');
return false;
}
var url = 'PHP_Login.php';
var pmeters = "tEmail=" + encodeURI( document.getElementById("Email").value) +
"&tpassword=" + encodeURI( document.getElementById("password").value ) +
"&tMode=" + Mode;
HttPRequest.open('POST',url,true);
HttPRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
HttPRequest.setRequestHeader("Content-length", pmeters.length);
HttPRequest.setRequestHeader("Connection", "close");
HttPRequest.send(pmeters);
HttPRequest.onreadystatechange = function()
{
if(HttPRequest.readyState == 3) // Loading Request
{
document.getElementById("mySpan").innerHTML = "Now is Loading...";
}
if(HttPRequest.readyState == 4) // Return Request
{
document.getElementById("mySpan").innerHTML = HttPRequest.responseText;
document.getElementById("Email").value = '';
document.getElementById("password").value = '';
}
}
}
The way this system usually works is upon authentication in the backend, the php usually creates a session variable whether logged in or not and then sends back a response. Once the response is got, all you have to do is redirect in javascript using window.location() or window.href functions of javascript.
I am trying to go to another page after login so How can I pass to another page after successfully login using Ajax and php ? when ajax send a request to php and then get the response like (if the response is ('true') or ('false') this responses depends on checking the username and password) so i do not know how to deal with this response in ajax to use it as a condition to pass to the next page. please help.
var HttPRequest = false;
function doCallAjax(Mode) {
HttPRequest = false;
if (window.XMLHttpRequest) { // Mozilla, Safari,...
HttPRequest = new XMLHttpRequest();
if (HttPRequest.overrideMimeType) {
HttPRequest.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
HttPRequest = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
HttPRequest = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!HttPRequest) {
alert('Cannot create XMLHTTP instance');
return false;
}
var url = 'PHP_Login.php';
var pmeters = "tEmail=" + encodeURI( document.getElementById("Email").value) +
"&tpassword=" + encodeURI( document.getElementById("password").value ) +
"&tMode=" + Mode;
HttPRequest.open('POST',url,true);
HttPRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
HttPRequest.setRequestHeader("Content-length", pmeters.length);
HttPRequest.setRequestHeader("Connection", "close");
HttPRequest.send(pmeters);
HttPRequest.onreadystatechange = function()
{
if(HttPRequest.readyState == 3) // Loading Request
{
document.getElementById("mySpan").innerHTML = "Now is Loading...";
}
if(HttPRequest.readyState == 4) // Return Request
{
document.getElementById("mySpan").innerHTML = HttPRequest.responseText;
document.getElementById("Email").value = '';
document.getElementById("password").value = '';
}
}
}
To redirect to a different page in PHP use
header("Location: http://example.com/success.html");
Quick notes. I am not using jQuery so don't suggest it.
When pressing the button which has the onclick="ajaxfunction();" i get an alert saying "Error during AJAX call. Please try again " and then I get the alert saying success, twice :S ... Why is this happening?
I don't understand why this is happening, as it calls the error, and then goes to the other part of the if statement...
Thanks in advance!
<script>
function getXMLObject() //XML OBJECT
{
var xmlHttp = false;
try {
xmlHttp = new ActiveXObject("Msxml2.XMLHTTP") // For Old Microsoft Browsers
}
catch (e) {
try {
xmlHttp = new ActiveXObject("Microsoft.XMLHTTP") // For Microsoft IE 6.0+
}
catch (e2) {
xmlHttp = false // No Browser accepts the XMLHTTP Object then false
}
}
if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
xmlHttp = new XMLHttpRequest(); //For Mozilla, Opera Browsers
}
return xmlHttp; // Mandatory Statement returning the ajax object created
}
var xmlhttp = new getXMLObject(); //xmlhttp holds the ajax object
var url="insertProduct.php";
function ajaxFunction() {
var getdate = new Date(); //Used to prevent caching during ajax call
if(xmlhttp) {
var name = document.getElementById("name");
var code = document.getElementById("code");
xmlhttp.open("POST",url,true); //calling insertProduct.php using POST method
xmlhttp.onreadystatechange = handleServerResponse;
xmlhttp.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xmlhttp.send("name=" + encodeURIComponent(name.value) + "&code=" + encodeURIComponent(code.value)); //Posting to PHP File
}
}
function handleServerResponse() {
if (xmlhttp.readyState == 4 || xmlhttp.readyState=="complete") {
alert("Success");
document.getElementById("message").innerHTML=xmlhttp.responseText; //Update the HTML Form element
}
else {
alert("Error during AJAX call. Please try again " + xmlhttp.status);
}
}
</script>
After finishing the task you can call return;
Likes below.
function handleServerResponse() {
if (xmlhttp.readyState == 4 || xmlhttp.readyState=="complete") {
alert("Success");
document.getElementById("message").innerHTML=xmlhttp.responseText;
return;
}
else {
alert("Error during AJAX call. Please try again " + xmlhttp.status);
return;
}
}
I hope this will help to you.
I'd like to pull pictures and / or videos from another website onto my page, and i'd like to edit the looks with css. The website ofc. has rss, but i don't have an idea of how to do this. Someone told be before that i could ping the website and if there is new content, it automatically displays it on my site. How can this be done?
Thanks!
I am not quite sure if this is directly possible as it could theoretically cause a lot of traffic for the third-party website. Maybe you can read the content in your RSS-Reader and use this to update your site indirectly.
After all, aren't we talking about stealing content?
As the Rss feed is XML, the best way to do this is with Ajax, here is a sample
window.onload = initAll;
var xhr = false;
var dataArray = new Array();
var url = "otherSites.xml";
function initAll() {
if (window.XMLHttpRequest) {
xhr = new XMLHttpRequest();
}
else {
if (window.ActiveXObject) {
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e) { }
}
}
if (xhr) {
xhr.onreadystatechange = setDataArray;
xhr.open("GET", url, true);
xhr.send(null);
}
else {
alert("couldn't create XMLHttpRequest");
}
}
function setDataArray() {
var tag1 = "subject1";
var tag2 = "subject2";
if (xhr.readyState == 4) {
if (xhr.status == 200) {
if (xhr.responseXML) {
var allData = xhr.responseXML.getElementsByTagName(tag1);
for (var i=0; i<allData.length; i++) {
dataArray[i] = allData[i].getElementsByTagName(tag2)[0].firstChild.nodeValue;
}
}
}
else {
alert("the request failed" + xhr.status);
}
}
}
So I've got an AJAX project which uses the XmlHttpRequest object to dynamically retrieve data from the server-side (in my case, I use JSON with PHP/MySQL in case that's relevant). Pretty much all my HTML elements are created dynamically via the javascript DOM, so it's the .js files doing the work.
Here's a typical .js file I use to get server-side info from PHP and then build the html:
var xmlHttp = createXmlHttpRequestObject();
function createXmlHttpRequestObject() {
var xmlHttp;
try {
xmlHttp = new XMLHttpRequest();
} catch(e) {
var XmlHttpVersions = new Array("MSXML2.XMLHTTP.6.0",
"MSXML2.XMLHTTP.5.0",
"MSXML2.XMLHTTP.4.0",
"MSXML2.XMLHTTP.3.0",
"MSXML2.XMLHTTP",
"Microsoft.XMLHTTP");
for(var i = 0; i < XmlHttpVersions.length && !xmlHttp; i++) {
try {
xmlHttp = new ActiveXObject(XmlHttpVersions[i]);
} catch(e) {}
}
}
if (!xmlHttp) alert("Error creating XmlHttpRequest object.");
else { return xmlHttp; }
}
function initialize_main() {
if (xmlHttp) {
try {
xmlHttp.open("GET", "main_php.php", true);
xmlHttp.onreadystatechange = handleMainStateChange; //call a function when the state changes
xmlHttp.send(null);
} catch(e) {
alert("Can't connect to server: " + e.toString());
}
}
}
function handleMainStateChange() {
if (xmlHttp.readyState==4) {
if (xmlHttp.status==200) {
try {
init_main();
} catch(e) {
alert("Error reading the response: " + e.toString());
}
} else {
alert("There was a problem retrieving data: " + xmlHttp.statusText);
}
}
}
function init_main() {
var data = JSON.parse(xmlHttp.responseText);
//now do stuff with the DOM or w/e
}
So as I said everything is cool in firefox and chrome. But internet explorer tells me: "Error reading the response: TypeError: Object doesn't support this property or method". I'm a bit new to AJAX as you might guess, so thanks for any help!
I would highly recommend that you use JQuery so that you can write Javascript that doesn't care about the type of browser (JQuery does this for you): http://jquery.com/
Try using this function, for me it works for all browser
function getXMLHTTP()
{
var xmlhttp = false;
try
{
xmlhttp = new XMLHttpRequest();
}
catch(e)
{
try
{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e)
{
try
{
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e1)
{
xmlhttp = false;
}
}
}
return xmlhttp;
}