I am trying to multiply two values that script get from below two different api. I am using document.getelementbyid to get the two id that I need which is gbp and balance. The api script can display the data get from api. However, the multiply script is not working. Nothing is showing. Help please?
first api
$(function() {
$.ajax({
type: "GET",
url: "https://min-api.cryptocompare.com/data/price?fsym=ETH&tsyms=ETH,GBP,HKD",
dataType: "json",
success: function (data) {
console.log(typeof data);
var json = data;
$('#gbp').html(json.GBP);
$('#hkd').html(json.HKD);
}
});
});
second api
$(function() {
$.ajax({
type: "GET",
url: "https://api.nanopool.org/v1/eth/reportedhashrate/1",
dataType: "json",
success: function (data) {
console.log(typeof data); // -- Object
var json = data;
$('#balance').html(json.data);
}
});
});
multiply javascript:
$(function () {
"use strict";
var $butbut =document.getElementById('gbp').html;
var $siksik =document.getElementById('balance').html;
var $lamlam = $butbut * $siksik;
document.getElementById('money').html=$lamlam;
});
html script
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="Untitled-4.js"></script>
</head>
<body>
<div id="balance"></div>
<div id="money"></div>
<div id="gbp"></div>
</body>
</html>
Getting the inner html of an element is .innerHTML, not .html
var $butbut = document.getElementById('gbp').innerHTML;
var $siksik = document.getElementById('balance').innerHTML;
document.getElementById('money').innerHTML = $lamlam;
Alternatively, you can use jquery
var $butbut = $('#gpb').html();
var $siksik = $('#balance').html();
$('#money').html($lamlam);
Related
Im using $.ajax in javascript. I need to get the response from php file. The code in javascript is -
var datavalues = {
a: 12,
b: 54
};
$.ajax({
type: "POST",
url: 'http://localhost/example/test.php',
data: datavalues,
success: function(response)
{
console.log(response);
$('#label').html(response);
var responsevalue = response;
}
});
and the code in php file is -
$bt = rand(0, 99);
$bt = intval($bt);
echo $bt;
The issue is that it shows the value in the label but value is not coming fine in the responsevalue variable. I need integer value in the responsevalue variable.
Output of console.log(response); statement is -
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Page</title>
</head>
<body>
</body>
</html>68<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Page</title>
</head>
<body>
</body>
</html>
Here 68 should be the value of responsevalue variable.
I hope you are not confused with the above code.
Use jquery param
var datavalues = {
a: 12,
b: 54
};
$.ajax({
type: "POST",
url: 'http://localhost/example/test.php',
data: $.param(datavalues),
success: function(response)
{
console.log(response);
$('#label').html(response);
var responsevalue = response;
}
});
in PHP file echo $_POST['a'];
The answer is given by #ceejayoz in the comments. For reference Im posting his answer here
"#pareza If that's the response, your http://localhost/example/test.php does more than just echo $bt;. You need to stop it from outputting all that HTML around the value you want."
I want to make an html5 select with data given by javascript, and inside this javascript an ajax calling a Json URL. I mean, I´ve got this:
--index.html
<!DOCTYPE html>
<html>
<head>
<script src="functions_app.js"></script>
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body onload="getData()">
<p>Sessions:
<select id="Select"></select>
</body>
</html>
functions_apps.js
function getData(){
$.ajax({
type: "GET",
url: 'http://.../json_offers.php',
async: false,
dataType: "json",
success: function(data){
//alert(data);
$.each(data,function(key, registro) {
var id = "";
var name = "";
$.each(registro, function(key, value) {
//alert(campo + ": " + valor);
if (key == "id") { id = value; }
if (key == "name") { name = value; }
});
});
$("#select").append('<option value='+id+'>'+nombre+'</option>');
},
error: function(data) {
alert('error');
}
});
}
json_offers.php
Json data:
[{"id":"6","name":"FLOWERS"},{"id":"8","name":"GROCERY"}]
But It does not work. It always return:
error: function(data)
I can´t load data given inside html select.
Any Help?
Best Regards
You have <select id="Select"></select>, but you are trying to put options into $("#select_zcas")
I'm new to JQuery and I really am not sure why this get and post request isn't working. I keep getting the error message. I'd appreciate any advice or resources to help figure this out. Thanks in advance.
$(document).ready(function(){
$.getJSON("http://api.github.com/users/noeladd", function(json){$.ajax({
type: "POST",
url: "http://httpbin.org/post",
data: json,
success: function(){
var parentDiv = document.getElementByClassName('container')[0];
var div = "<div><img src = 'json.avatar_url' width = '150px'></img><br> json.login <br> json.name</div>";
parentDiv.append(div);
} ,
error: function(){
alert("request failed!")
},
dataType: JSON
});});
})
I don't get it... but take it corrected.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Sample</title>
<link href="css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
<div class="container">
</div>
<script src="js/jquery/jquery-2.1.1.min.js"></script>
<script>
$(document).ready(function(){
$.getJSON("http://api.github.com/users/noeladd", function(json){
$.ajax({
type: "POST",
url: "http://httpbin.org/post",
data: json,
success: function(data){
//You not using data... why???
var parentDiv = $('.container');
var div = "<div><img src = '"+json.avatar_url+"' width = '150px'></img><br> "+json.login+" <br> "+json.name+"</div>";
parentDiv.append(div);
} ,
error: function(){
alert("request failed!")
},
dataType: 'json'
});});
})
</script>
</body>
</html>
I don't know why you post the json to another website that only return the dada posted, but take a look at this example:
$(document).ready(function () {
$.getJSON("https://api.github.com/users/noeladd", function (json) {
$("<div />").append(
$("<img />").attr("src", json.avatar_url).css("width", 150),
$("<br />"),
$("<span />").text(json.login),
$("<br />"),
$("<span />").text(json.name)
).appendTo("div.container:eq(0)");
});
});
Working example on JSFiddle: https://jsfiddle.net/evandroprogram/Lbqbewsz/
I'm using YQL and jQuery.ajax to retrieve an inline JavaScript variable from another website. This variable contains a complete XML document that base64 encoded.
While the AJAX request is working, I can't figure out how to take the res.query.results and append it to a dynamically made <script> element.
Here's the jQuery:
$.ajax({
url: "http://query.yahooapis.com/v1/public/yql/dj/fsp?format=json",
type: "GET",
success: function(res) {
var sc = $('script');
$(sc).append(document.createTextNode('var '+$(res.query.results)));
$('head').append(sc);
}
});
Here's what the console log is telling me:
Any ideas or suggestions would be greatly appreciated. Thanks, everyone!
Three things:
To create a script element, you do $('<script>'), not $('script'). The latter searches for all script elements.
No need for createTextNode, jQuery will handle that for you.
You're over-doing it with the calls to $():
var sc = $('<script>');
sc.append(document.createTextNode('var '+res.query.results));
// ^ #1 (see below) ^ #2
You don't want to do $(sc) again, it's pointless, it's already a jQuery instance.
You don't want to parse res.query.results into a jQuery instance, you want to grab the string into a JavaScript variable (apparently).
Live example:
<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<meta charset="utf-8">
<title>Example</title>
</head>
<body>
<script>
(function() {
"use strict";
display("Doing query...");
$.ajax({
url: "http://query.yahooapis.com/v1/public/yql/dj/fsp?format=json",
type: "GET",
success: function(res) {
display("Got result, creating <code>script</code>...");
var sc = $('<script>');
sc.append('var '+res.query.results);
$('head').append(sc);
display("length of <code>txt</code> global variable: " + window.txt.length);
}
});
function display(msg) {
var p = document.createElement('p');
p.innerHTML = String(msg);
document.body.appendChild(p);
}
})();
</script>
</body>
</html>
I'm using jQuery AJAX to get an array from a PHP file which is getting data from a MySQL database. I'm now trying to use that array outside my ajax call. Specifically I'm loading multiple videoIDs for YT.Player but I'm stumbling on getting my array to another function.
Here's my testing code:
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
<script>
var data = new Array();
$(document).ready( function() {
$.ajax({
type: 'POST',
url: 'test.php',
data: 'id=testdata',
dataType: 'json',
cache: false,
success: function(result) {
data = result;
$('#div1').html(result[4]);
},
});
});
$("button").click(function(){
alert(data[4]);
});
</script>
</head>
<body>
<button id="button">Test</button>
<div id="div1"><h2>div1</h2></div>
</body>
</html>
The div changes a half second after the page loads as expected. The click function for testing doesn't work, and its not working in the real function I'm working on:
function onPlayerStateChange(event) {
if(event.data === 0) {
++i;
player.loadVideoById(data[i]);
}
}
This is my first project with jQuery and JS so I'm hoping I'm missing something simple
You should put
$("button").click(function(){
alert(data[4]);
});
inside
$(document).ready( function() {
});
Also, if you put var before variable then it becomes local variable.
So, you should either remove var before
data = new Array();
or just put as a additional parameter
function onPlayerStateChange(event, data) {
if(event.data === 0) {
++i;
player.loadVideoById(data[i]);
}
}
but then you also need to call it inside
$(document).ready(function() {} );
scope.