can not send data to php by ajax - php

Hi all I am new in ajax and I am trying to get data from php code this is my ajax code:
function blodvotingview(contentid)
{
var xmlhttp;
xmlhttp=GetXmlHttpObject();
if (xmlhttp==null)
{
alert ("Your browser does not support XMLHTTP!");
return;
}
var url="index.php";
url=url+"?hp=1";
url=url+"&m=blogenvoting";
url=url+"&contentid="+contentid;
xmlhttp.onreadystatechange=stateChanged;
xmlhttp.open("GET",url,true);
xmlhttp.send(null);
}
function stateChanged()
{
if (xmlhttp.readyState==4)
{
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
function GetXmlHttpObject()
{
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
return new XMLHttpRequest();
}
if (window.ActiveXObject)
{
// code for IE6, IE5
return new ActiveXObject("Microsoft.XMLHTTP");
}
return null;
}
And this is my html code {entry_id} is numeric parameter:
view
<p>Suggestions: <span id="txtHint"></span></p>
And this is php code I want to echo:
<?php
showcomment()
function showcomment()
{
echo "yes";
}
?>
But it doesn't work, please help me.

If you consider use jQuery and jquery.serialize plugin you can easy do this by this example:
$.post('URL', $('#form_id').serialize(), function(r) {
console.log(r);
});
or
$.post('URL', $('#form_id').serialize(), function(r) {
console.log(r);
},'json'); // to parse response as JSON
or
$.get('URL', function(r) {
console.log(r);
},'json'); // to parse response as JSON

Try this
function blodvotingview(contentid)
{
var xmlhttp;
if (str==""){
document.getElementById("txtHint").innerHTML="";
return;
}
if (window.XMLHttpRequest){// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}else{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","index.php?hp=1q="+str,true);
xmlhttp.send();
}
Should work fine,
Wezy

Related

AJAX Nearly identitcal xmlhttp, one works the other does not?

I'm having a weird problem...
I inserted an alert here:
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
alert('fine');
}else {
alert('fail');
}
Both functions that call the xmlhttp alert "fail" but one works while the other does not.
I checked that the serialize was working, and it is, I get the written value in the form.
The php script doesn't show an error... any idea what could be going on? The calls are separate, not called simultaneously, I pretty much replicated the working one for the other call.
This is the full xmlhttp function of the working one
function insertEntry()
{
var data = $("#entry").serialize();
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
alert('fine');
}else {
alert('fail');
}
}
xmlhttp.open("POST","write-script.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send(data);
clearup();
showSuccess();
}
Not working, the alerts go all the way through
function insertNote()
{
alert('clicked');
var note = $("#note").serialize();
alert(note);
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
// document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
alert('fine');
}else {
alert('fail');
}
}
xmlhttp.open("POST","write-new-note.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send(note);
alert('done');
}

how to work with multiple ajax?

i am using ajax to get data in Date Label, bt it is not working. Details() function is working , but showDate() is stucked. How i get the data in dt id??
<label><b>From</b></label>
<select id="f" onchange="Details();"><?php echo $coptions; ?></select>
<label><b>Destination</b></label>
<select id="d" onchange="Details();"><?php echo $coptions; ?></select>
<label><b>Flight Name</b></label>
<select id="list" onchange="showDate();" ></select>
<label><b>Date</b></label>
<select id="dt" ></select>
<button >Go</button>
here is my ajax functions:
function Details()
{
var xmlhttp;
var fname = document.getElementById("f").value;
var dname = document.getElementById("d").value;
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4)
{
document.getElementById("list").innerHTML=xmlhttp.responseText;
showDate();
}
}
xmlhttp.open("GET","route.php?q="+fname+"&w="+dname,true);
xmlhttp.send();
//loadDetails();
}
function showDate()
{
var xmlhttp;
var ex=document.getElementById("list");
var id=ex[ex.selectedIndex].id;
if (window.XMLHttpRequest)
{
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("dt").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","schdl2.php?f="+id,true);
xmlhttp.send();
//loadDetails();
}
my schdl2.php page is like this:
<?php
session_start();
require_once("dbconnect.php");
$fl=$_REQUEST['f'];
$sql= "SELECT date FROM schedule where flight='$f1'";
$rslt = mysql_query($sql);
$foptions="";
while ($row=mysql_fetch_array($rslt))
{
$rd=$row["date"];
$foptions.="<option>$rd<option>";
}
echo $foptions;
?>
is there is any efficient way??
I made some tests, and your id var is always empty; so i change your code like this:
This:
var id=ex[ex.selectedIndex].id;
By this on the showDate function:
var id = document.getElementById("list").value;
Jsfiddle here: http://jsfiddle.net/x97jn/
You can work with JQuery ajax.
$( document ).ready(function() {
$.ajax({
url: "ajax-1.php",
context: document.body
}).done(function(data) {
$('#result-1').html(data);
});
$.ajax({
url: "ajax-2.php",
context: document.body
}).done(function(data) {
$('#result-2').html(data);
})
});

Insert data from API to mysql

Here I have a code that show restaurants beetween two cities, but there is a problem how to loop objects to insert in database...
http://jsbin.com/AlEVaCa/5
How here I can add my function loadXMLdoc();
function findPlaces(boxes,searchIndex) {
var request = {
bounds: boxes[searchIndex],
types: ["restaurant"]
};
// alert(request.bounds);
service.radarSearch(request, function (results, status) {
if (status != google.maps.places.PlacesServiceStatus.OK) {
alert("Request["+searchIndex+"] failed: "+status);
return;
}
// alert(results.length);
document.getElementById('side_bar').innerHTML += "bounds["+searchIndex+"] returns "+results.length+" results<br>"
for (var i = 0, result; result = results[i]; i++) {
var marker = createMarker(result);
}
searchIndex++;
if (searchIndex < boxes.length)
findPlaces(boxes,searchIndex);
});
}
LoadXMLdoc() :
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest){
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else{
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
}
data = "name="+place.name+"&place="+place.website;
xmlhttp.open("POST","file_to_store.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send(data);
}
});
so How to integrate my function loadXMLdoc for script to insert data to database?

JS events. Only one of the event handler function is being called?

Hi everybody!
I have a problem and I have no idea how to fix it!
I have a simple HTML page with a button:
<input type = "submit" value = "ok" onclick="f1()"/>
I also have a script on this page:
<script>
function f2()
{
var firstBtn = document.createElement("button");
firstBtn.appendChild(document.createTextNode("firstBtn"));
document.body.appendChild(firstBtn);
var xmlhttp = CreateRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
var response = xmlhttp.responseText;
document.body.innerHTML += response;
}
}
firstBtn.onclick = function()
{
alert("inside f2 onclick");
xmlhttp.open("GET","test.php",true);
xmlhttp.send();
}
}
function f3()
{
var secondBtn = document.createElement("button");
secondBtn.appendChild(document.createTextNode("secondBtn"));
document.body.appendChild(secondBtn);
var xmlhttp = CreateRequest();
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
var response = xmlhttp.responseText;
document.body.innerHTML += response;
}
}
secondBtn.onclick = function()
{
alert("inside f3 onclick");
xmlhttp.open("GET","test.php",true);
xmlhttp.send();
}
}
function f1()
{
f2();
f3();
}
function CreateRequest()
{
var xmlhttp;
if (window.XMLHttpRequest)
xmlhttp=new XMLHttpRequest();// code for IE7+, Firefox, Chrome, Opera, Safari
else
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");// code for IE6, IE5
return xmlhttp;
}
</script>
So now, when I click one of the buttons (firstBtn or secondBtn), another one is not responding to the click event! Does anybody know why?
As #vishwanath said (see comments to this question), when I doing
document.body.innerHTML += response;
I'm destroying and recreating all the content of my page therefore I'm losing my events.

XMLHttpRequest to PHP script - what's missing here?

This is my first time using AJAX, and I'm trying to send JS variables to a PHP script. I've got an XMLHttpRequest but it doesn't seem complete - what am I missing?
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(successFunction, errorFunction);
}
else {
document.write("Geolocation is required for this page.");
}
function successFunction(position) {
var lat = position.coords.latitude;
var lng = position.coords.longitude;
// document.write("<a href='http://api.geonames.org/findNearbyPlaceNameJSON?lat="+lat+"&lng="+lng+"&username=sebastiano'>my town</a>");
var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else {
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","location.php?lat=position.coords.latitude",true);
xmlhttp.send();
// SOMETHING MISSING HERE?
}
function errorFunction(position) {
document.write("Error");
}
It appears that you're not passing the contents of your variable to the open command.
xmlhttp.open("GET","location.php?lat=position.coords.latitude",true);
in this example your lat will contain a string with contents "position.coords.latitude"
instead try
xmlhttp.open("GET","location.php?lat="+position.coords.latitude,true);
Or better yet, use the variables you created at the top of the function and pass both long and lat in.
xmlhttp.open("GET","location.php?lat=" + lat + "&long=" + lng,true);
you are sending it with "position.coords.latitude" as value...
try xmlhttp.open("GET","location.php?lat=" + position.coords.latitude,true);
Also, take a look at jQuery
Try this:
var xmlhttp;
if (window.XMLHttpRequest) {
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else {
// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
console.log(xmlhttp.responseText);
}
}
xmlhttp.open("GET","location.php?lat=" + position.coords.latitude,true);
xmlhttp.send();

Categories