JSFIDDLE for testing http://jsfiddle.net/8dw09y59/
Hey guys, I've tried everything.. Could someone please explain why i continue to get the "uncaught referenceerror: summonerLookUp is undefined"
I've tried switching the function to windows.summonerLookUp = function() { , but thats hasn't changed anything either. I've tried loading them within , within I've tried loading it at the end of the document, but i get the error "In XHTML 1.0 Transitional the tag cannot contain a tag ." is anyone able to explain whats going on here?
This is my index.js
function SummonerLookUp() {
var SumName
SumName = $("#SumInput").val();
if(SumName !== "") {
$.ajax({
url: 'https://na.api.pvp.net/api/lol/na/v1.4/summoner/by-name/' + SumName + '?api_key=',
type: 'GET',
dataType: 'json',
data: {
},
success: function (json) {
var SUMMONER_NAME_NOSPACES = SumName.replace(" ", "");
SUMMONER_NAME_NOSPACES = SUMMONER_NAME_NOSPACES.toLowerCase().trim();
summonerLevel = json[SUMMONER_NAME_NOSPACES].summonerLevel;
summonerID = json[SUMMONER_NAME_NOSPACES].id;
document.getElementById("sLevel").innerHTML = summonerLevel;
document.getElementById("sID").innerHTML = summonerID;
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert("error getting Summoner data!");
}
});
} else {}
}
and my index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>LoLStats.GG</title>
<script language="javascript" type="text/javascript" src="../Javascript/index.js"></script>
</head>
<body>
Summoner Name
<br />
<input id="SumInput" />
<button onclick="summonerLookUp()">Click me</button>
<br />
<br />Summoner Level: <span id="sLevel"></span>
<br />Summoner ID: <span id="sID"></span>
</body>
</html>
The function SummonerLookUp is being called as summonerLookUp, javascript is case sensitive
Change
function SummonerLookUp() {
To
function summonerLookUp() {
JavaScript is case-sensitive. You named the function SummonerLookUp, but then you're trying to call summonerLookUp. Make them match.
Related
ajaxcheck.js
var val = "hai";
$.ajax(
{
type: 'POST',
url: 'ajaxphp.php',
data: { "abc" : val },
success :function(data)
{
alert('success');
}
}
)
.done(function(data) {
alert("success :"+data.slice(0, 100));
}
)
.fail(function() {
alert("error");
}
);
ajax.html
<!DOCTYPE html >
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script type="text/javascript" src="ajaxcheck.js"></script>
<title>ajax request testing</title>
</head>
<body>
</body>
</html>
ajaxphp.php
<?php
$v_var = $_POST["abc"];
print_r($_POST);
if(isset($_POST["abc"]))
{
echo $v_var;
}
else
{
echo "Data not received";
}
?>
When I run the ajax.html file ,I get success alert. But when I run ajaxphp.php file it shows notice like:
undefined index abc
Why is that the data is not received in $v_var ? where i am mistaking ?please help.
Actually the ajaxphp.php file is used to receive the data from the
post method and i will give response .
In First case by using ajax post method it will call to ajaxphp.php file.
In Second case your using direct file call without any post data(that's way it shows error)
Try this
var val = "hai"
$.post( "ajaxphp.php", {'abc':val}function( data ) {
alert( "Data Loaded: " + data );
});
jQuery expects an object as data, remove the double-quotes:
data: { abc : val }
it's days that i'm trying to figure out how charset works.
I'm sending via form using ajax a string like: §test the output cannot recognize the "§" case.
This is my code:
var messaggio = $("input[name='messaggio']").val();
$.ajax({
url:"js/php/sendchat.php",
data:"messaggio="+messaggio,
type:"post",
contentType:"application/x-www-form-urlencoded; charset=ISO-8859-1",
beforeSend: function(jqXHR) {
jqXHR.overrideMimeType('application/x-www-form-urlencoded; charset=ISO-8859-1');
},
success:function(data){
$("input[name='messaggio']").val("");
$("body").html(data);
}
});
This on: sendchat.php
header("Content-Type: text/html; charset=ISO-8859-1");
And this on index where's my application:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1"/>
<script type="text/javascript" src="js/chat.js" charset="ISO-8859-1"></script>
What am i doing wrong?
Thank you in advance.
try this
beforeSend: function(jqXHR) {
jqXHR.overrideMimeType("text/html;charset=iso-8859-1");
}
I am having problems trying to activate a jQuery function from a PHP.
The following is my own test version.
index.php file
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Welcome to temp index</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="scripts/jquery-1.8.3.min[2].js"></script>
<script type="text/javascript">
$(document).ready(function() {
//posts info into the userinfo.php file
$.post('userinfo.php', { activate:"colourchange"}, function(data){
$('report').html(data);
});
//the function which is meant to be activated from the php file
function colourchange(){
document.body.style.backgroundColor = 'green';
};
});
</script>
</head>
<body>
<h1>hello</h1>
<div id="report">
</div>
</body>
</html>
PHP file I am attempting to call my jQuery function from
<?php
if( $_REQUEST["activate"])
{
$activate = $_REQUEST['activate'];
};
if($activate == 'colourchange')
{
// This is the code that I believe not to be working as this isn't
// activating the jQuery function to work. (The page background isn't changing colour)
echo "<script>colourchange(); </script>";
};
?>
Thank you to anyone who has an idea of what to do it is much appreciated.
I have now tried ...
<?php
require 'userinfo.php';
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Welcome to temp index</title>
<link rel="stylesheet" href="style.css" type="text/css" />
<script type="text/javascript" src="scripts/jquery-1.8.3.min[2].js"></script>
<script type="text/javascript">
function colourchange(){
document.body.style.backgroundColor = 'green';
};
$(document).ready(function() {
$.post('userinfo.php', { activate:"colourchange"}, function(data){
$('report').html(data);
});
});
</script>
</head>
<body>
<h1>hello</h1>
<div id="report">
</div>
</body>
</html>
and the PHP index file is ...
<?php
if( $_REQUEST["activate"])
{
$activate = $_REQUEST['activate'];
};
if($activate=='colourchange')
{
echo "colourchange();";
};
?>
I don't exactly understand why you are using PHP to execute a jQuery function at all - perhaps this is just an oversimplified example. Assuming your primary goal is to have the PHP response trigger a specific Javascript function (and perhaps allow for the PHP response to trigger several different responses) you'd do something like this:
First change the callback from
function(data){
$('report').html(data);
}
to something like:
function(data) {
if (data.indexOf("colourchange") >= 0) { // php page returned "colorchange" or a string containing "colourchange"
colourchange();
} else if (data.indexOf("moodchange") >= 0) {
moodchange(); /// etc... you can add more trigger functions here
}
}
And second... just have your PHP page return "colourchange" instead of an HTML snippet:
if($activate == 'colourchange')
{
echo "colourchange";
};
Does that help?
you could try this-- example call the jquery function on success
$.ajax({
url: //the url,
data: //the data,
type: "POST",
success: function(data){
if(data == "ok"){
colorChange();
}
}
});
here the data will be the success result returned by the php code..
you can call a function depending on the data returned
I'd like to get a csv file from a url and transform it into an array.
So here is my code :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Temperatures</title>
<script type="text/javascript" src="http://www.google.com/jsapi"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.csv-0.71.js"></script>
<script type="text/javascript" src="jquery.csv-0.71.min.js"></script>
<script type="text/javascript">
google.load('visualization', '1', {packages: ['annotatedtimeline']});
var csv_as_array = [];
function drawVisualization() {
$.ajax({
url: "data.txt",
aync: false,
success: function (csvd) {
csv_as_array = $.csv2Array(csvd);
},
dataType: "text",
complete: function () {
// use the array of arrays (variable csv_as_array)
// for further processing
}
});
[Google chart code]
}
google.setOnLoadCallback(drawVisualization);
</script>
</head>
<body style="font-family: Arial;border: 0 none;">
<div id="visualization" style="width: 1000px; height: 600px;"></div>
</body>
</html>
my data.txt is in the same folder as my .html file.
I know the block success: function (csvd) { } is not executed, because when I write alert("toto");, nothing happens.
Also, in the block complete: function () { }, I have written alert(csv_as_array.length); and it always shows 0.
The error is maybe just an import of a library missing ?
If success callback function was not called, it means error happened and error callback function would be called, if there would be one. You can try:
Adding error function, for example, a line like this error: function(jqXHR, textStatus, httpError) { alert('Error: '+textStatus); alert(httpError); }, to check for error.
Using absolute address in url
And you have a typo in the line aync: false - async, not aync.
The alert with "success" is not fired when i run this. I checked with firebug, and it tells me that ret is undefined. What does that mean?
function checkUni() {
var URL = "http://localhost:8080/GradSchoolApp/test.jsp";
var ret = $.getJSON(URL, function(data, textStatus) {
alert("success");
});
}
EDIT:
this is the test.jsp btw
<%# page language="java" contentType="application/json; charset=ISO-8859-1"
pageEncoding="ISO-8859-1" import="java.util.*, net.sf.json.JSONObject"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
<%
response.setContentType("application/json");
JSONObject jo = new JSONObject();
jo.put("location", "1");
jo.put("name", "someUni");
out.println(jo);
out.flush();
%>
</body>
</html>
The AJAX call did not work. A few points to check, is the URL correct? Did you check the application server log to see if the call has ever reached. Can you check firebug for the HTTP code if the AJAX call is successful?
EDIT:
(Changed from text/json to application/json) Thanks Bergi
JSP:
<%# page contentType="application/json" %>
Java Servlet:
response.setContentType("application/json");
First check for ".jsp" file returning json data or not
Use one more parameter for callback
getJSON: function( url, data, callback ) {
return jQuery.get( url, data, callback, "json" );
}
User like this
function checkUni() {
var URL = "http://localhost:8080/GradSchoolApp/test.jsp";
var ret = $.getJSON(URL,"",function(data){
alert("success");
});
}
ret is scoped to your function, so only code inside your function can access it. My guess is that you don't have a web server running on port 8080 of your local computer or the URL is invalid for some other reason. Try .ajax if you want to get a callback on the error also (fiddle):
function checkUni() {
var URL = "http://localhost:8080/GradSchoolApp/test.jsp";
var ret = $.ajax(
{
url: URL,
success: function(data, textStatus) {
alert('success!');
},
error: function(jqXHR, textStatus, errorThrown) {
alert('Error "' + textStatus + '": ' + errorThrown);
}
});
}
You might want to check your json too, the getJson page warns that it will fail silently on inavlid json, including strict requirements like quoted property names, you can try just using .get and deserializing yourself.