javascript(jquery ajax) in php file - javascript

I have a php file in which I have written javscript code.
Here is the code
<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.cycle.all.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert("Start");
$.ajax({
type:...
url:...
success:function(data, textStatus ){
alert("Success");
Jquery Cycle plugin
}
error:function(xhr, textStatus, errorThrown){
alert("Failure");
}
});
});
I have a javascript code in php file with extension .php.When I run the above code,php gets executed perfectly.But javascript code is not executing.This I am saying because even the alert() in the first line of script is not getting executed.I am not getting any ajax error or success function printed which is defined in ajax call.

You have missed commas (,) in the ajax function.
It’s working at my end with the following changes:
<html>
<head>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="jquery.cycle.all.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert("Start");
$.ajax({
type:'GET',
url:'somepage.php',
success:function(data, textStatus ){
alert("Success");
},
error:function(xhr, textStatus, errorThrown){
alert("Failure");
}
});
});
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert("Start");
$.ajax({
type:'GET',
url:'somepage.php',
success:function(data, textStatus ){
alert("Success");
},
error:function(xhr, textStatus, errorThrown){
alert("Failure");
}
})
});
</script>
Also running on JS Fiddle.

Related

ajax in javascript not working. not reading the code

I'm calling a simple JS script to load ajax functions.... and it doesn't work... I debugged using document.write to see where the problem lied and I can see my TEST 1 but not my TEST 2...
MY HTML
<html>
<title>Ajax Infinite scroll using jQuery - InfoTuts</title>
<head>
<!--<script type="text/javascript" src="http://code.jquery.com/jquery-1.11.1.min.js"></script>-->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js" ></script>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<img id='loading' src='img/loading.gif'>
<div class="masonry" >
<div id="demoajax" cellspacing="0"></div>
</div>
</body>
<script type="text/javascript" src="script.js"></script>
</html>
MY JavaScript
var ajax_arry=[];
var ajax_index =0;
var sctp = 100;
$(function()
{
$('#loading').show();
/* document.write("TEST1"); */
$.ajax(
{
/* document.write("TEST2"); */
url:"scroll.php",
type:"POST",
data:"actionfunction=showData&page=1",
cache: false,
success: function(response)
{
$('#loading').hide();
$('#demoajax').html(response);
}
});
/* MORE CODE BELOW */
my document.write TEST 1 prints on screen, but my TEST 2 can't print..
It seems it's not going in the $ajax( section of the code
Do not use document.write to debug. Browsers have a console. Use console.log and you can set break points.
And you are creating an error putting document.write in the middle of an object!!! That is a syntax error.
If you are trying to figure out why the Ajax call is not loading, add an error handler and see if it is getting called.
$('#loading').show();
console.log("loading shown");
$.ajax({
url: "scroll.php",
type: "POST",
data: "actionfunction=showData&page=1",
cache: false,
success: function(response) {
console.log("success", response);
$('#loading').hide();
$('#demoajax').html(response);
},
error: function() {
console.log("error", arguments);
}
});
You have missed to close your function;
put this }); after your ajax call.
if you got "500 (Internal Server Error)", you may have to change the Permissions of that PHP file.
try by putting document.write("TEST2"); inside success function.
Put $.ajax on document.ready function
$(document).ready(function(){
$.ajax({
/* document.write("TEST2"); */
url:"scroll.php",
type:"POST",
data:"actionfunction=showData&page=1",
cache: false,
success: function(response){
$('#loading').hide();
$('#demoajax').html(response);
}
});
});

Jquery Ajax call not successful

I have the following code in Javascript and jquery
function abc() {
alert("called 1");
$.ajax({
url: "abc.htm",
context: document.body
}).done(function () {
alert("done");
});
}
and my html button code is as follow
<input type="button" value="click" onclick="return abc();" />
for some reason the ajax call is not successful. I have added the required jquery files to the page.
Please help thanks.
Modify it like this...
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
alert("called 1");
$.ajax({url:"abc.htm",success:function(result){
$("#div1").html(result);
}}).done(function(){alert("d")});
});
});
</script>
</head>
<body>
<div id="div1"></div>
<button>Get External Content</button>
You don't need to return anything to your html markup's onclick handler. Simply call abc() as in
<input type="button" value="click" onclick="abc();" />
Also, if you want more precise error handling then you can use the error and success ajax functions.
function abc() {alert("called 1");
$.ajax({
url: "abc.htm",
context: document.body,
success: function (data, status, xhr ) {
console.log(data.SomeValue);
},
error: function (xhr, status, error) {
console.log(error);
}
}).done(function () {
alert("done");
});
}

How to post zk url through javascript

I am using JavaScript with ZK framework. In some scenario, I want to post URL from JavaScript in ZK. How to call ZUL file from JavaScript?
Is there any way to post URL using JavaScript in ZK?
Assume you have a content.zul and you want to get it via ajax in javascript, this can be done by using zk built in jquery in zul page or using jquery in pure html.
zul sample:
<zk>
<script><![CDATA[
function loadContent () {
jq.ajax({
url: "content.zul",
type: "post",
// callback handler that will be called on success
success: function(response, textStatus, jqXHR){
jq('$content').html(response);
}
});
}
]]></script>
<div id="content"
onCreate='Clients.evalJavaScript("loadContent();");' />
</zk>
html sample:
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
window.onload = function () {
$.ajax({
url: "content.zul",
type: "post",
// callback handler that will be called on success
success: function(response, textStatus, jqXHR){
$('#content').html(response);
}
});
}
</script>
</head>
<body>
<div id="content"></div>
</body>
</html>

django-ajax json response

I have a django url : '127.0.0.1:8000/showsym' mapped to view returning json response
def get_symptoms(request):
bp=BodySubPart.objects.get(body_subpart="head")
data1=bp.symptoms.all()
data = serializers.serialize('json', data1)
return HttpResponse(data,mimetype='application/json')
now i am trying to parse this in ajx_form.html and code for that is :
<html>
<head>
<title>Hist</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<script type="text/javascript">
(function() {
$.get('127.0.0.1:8000/showsym/', function(data1) {
alert(data1);
});
});
</script>
</body>
</html>
but it is not giving me any output
the page is coming blank
please help me here somebody
It is because your code tries to get the url: /127.0.0.1:8000/showsym/
Change 127.0.0.1:8000/showsym/ to /showsym/.
I suggest you use $.getJSON and name urls, assuming the url name of /showsym is showsym:
$(document).ready(function() {
$.getJSON('{% url showsym %}', function(data, textStatus, jqXHR) {
alert(data);
})
})

Javascript code for parsing the xml document

I want a javascript code for calling web script (http://10.0.2.2:8080/alfresco/service/api/login?u=admin&pw=admin) of alfresco remotely in android app using Phonegap and prase the return result and append this return result to other call of webscript of alfresco(http://localhost:8080/alfresco/service/sample/folder/Company%20Home?format=atom)..
please help me on this.
I have this sample code, how can i change it to my need...I want to invoke http://10.0.2.2:8080/alfresco/service/api/login?u=admin&pw=admin parse the return value and append it to one more call of webscript http://localhost:8080/alfresco/service/sample/folder/Company%20Home?format=atom .
<html>
<head>
<script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"></script>
<script src="jquery-1.4.2.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery-1.4.2.min.js" type="text/javascript"></script>
<script>
function bodyload(){
alert("We are calling jquery's ajax function and on success callback xml parsing are done");
$.ajax({url:'http://www.edumobile.org/blog/uploads/XML-parsing-data/Data.xml',
url:'
dataType:'application/xml',
timeout:10000,
type:'POST',
success:function(data) {
console.log("Customers Tab",data);
$("#bookInFo").html("");
$("#bookInFo").append("<hr>");
$(data).find("Book").each(function () {
$("#bookInFo").append("<br> Name: " + $(this).find("name").text());
$("#bookInFo").append("<br> Address: " + $(this).find("address").text());
$("#bookInFo").append("<br> Country: " + $(this).find("country").text());
$("#bookInFo").append("<br><hr>");
});
},
error:function(XMLHttpRequest,textStatus, errorThrown) {
alert("Error status :"+textStatus);
alert("Error type :"+errorThrown);
alert("Error message :"+XMLHttpRequest.responseXML);
$( "#bookInFo" ).append( XMLHttpRequest.responseXML);
}
});
}
</script>
</head>
<body onload="bodyload()">
<button onclick="bodyload()">Get Ticket</button>
<p id="bookInFo"></p>
</body>
For xml like
<test>
<something>
<data>Data1</data>
<other>Other1</usage>
</something>
<something>
<data>Data1</data>
<other>Other1</usage>
</something>
</test>
Use like this to parse
$.ajax({
type : 'GET',
url : "http://some-url:8080/test.xml",
data : {
key : "value"
},
dataType : "xml",
success : function(xml) {
data1 = $(xml).find('data').eq(0).text();
data2 = $(xml).find('data').eq(1).text();
other1 = $(xml).find('other').eq(0).text();
other2 = $(xml).find('other').eq(1).text();
},
error : function(xhr) {
alert("Error while loading!!!");
}
});
Let me know if it helped you..

Categories

Resources