i have Something this type of xml with huge of data:-
<root>
<child1 id="4331" value="twenty-twenty">
<child2 id="4332" value="India">
<child4 id="4334" value="Mumbai Indian"></chlild4>
<child5 id="4335" value="Rajshthan Royal"></child5>
</child2>
<child3 id="4333" value="Pakishtan">
<child6 id="4336" value="Arngabad"></child6>
<child7 id="4337" value="Punjab"></child7>
</child3>
</child1>
</root>
i tried this
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("button").click(function() {
});
});
$(function() {
$.ajax({
type: "GET",
url: "atry.xml",
dataType: "xml",
success: function(xml) {
data = xml;
$(xml).find('*').each(function(){
console.log($(this).attr('id'));
console.log($(this).attr('value'));
});//close $.each(
}
}); //close click(
});
</script>
</head>
<body>
<!-- we will add our HTML content here -->
<button>Link</button>
</body>
</html>
i am try this but no output display...
import the all child attribute using jquery with click event...
thanks
You can try this code with jquery:
var xml = '<root><child1 id="4331" value="twenty-twenty"><child2 id="4332" value="India"><child4 id="4334" value="Mumbai Indian"></chlild4><child5 id="4335" value="Rajshthan Royal"></child5></child2><child3 id="4333" value="Pakishtan"><child6 id="4336" value="Arngabad"></child6><child7 id="4337" value="Punjab"></child7></child3></child1></root>';
var $root = $(xml);
$root.find('*').each(function(){
console.log($(this).attr('id'));
console.log($(this).attr('value'));
});
You may try like this
$(document).ready(function() {
$("button").click(function() {
$.ajax({
type: "GET",
url: "atry.xml",
dataType: "xml",
success: function(xml) {
data = xml;
$(xml).find('*').each(function(){
console.log($(this).attr('id'));
console.log($(this).attr('value'));
});//close $.each
}
}); //cloase ajax
}); //close button click
}); //close ready
Related
Here is the Code. I've already researched about it and so far, haven't found the right solution. Any help would be much appreciated. Thanks.
<script type="text/javascript" src="{%static 'javascript/jquery-3.1.1.js'%}"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#itemid").change(function(){
var itemid = $(this).val();
var func_url = '/get_itemdetails/' + itemid +'/';
$.ajax({
type:"GET",
url: func_url,
dataType:"json",
success: function(data){
console.log(data);
}
});
});
});
</script>
Below is the latest script header for Google's hosted CDN which allows for the $.ajax Function:
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#itemid").change(function(){
var itemid = $(this).val();
var func_url = '/get_itemdetails/' + itemid +'/';
$.ajax({
type:"GET",
url: func_url,
dataType:"json",
success: function(data){
console.log(data);
}
});
});
});
</script>
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/
This is a script when the script is executed I want to load the data into the div of id #trial. The script is an external array with three names the second I am trying to call is 'sarah'. Whats wrong?
<script>
$(document).ready(function(){
$("#trial").click(function(){
var attempt=$.ajax({
url: "names.js",
dataType: "script"
});
var msg=names[1];
attempt.done(function( msg ) {
$( "#trial" ).html( msg );
});
});
});
</script>
Change your code to this:
<script>
$(document).ready(function(){
$("#trial").click(function(){
$.ajax({
url: "names.js",
dataType: "script",
success: function(res){
//todo something with res
}
});
});
});
</script>
Json page is : http://freegeoip.net/json/59.92.78.49
and my code is
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">
</script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.getJSON("http://localhost/02/t.php",function(result){
alert(result.ip);
});
});
});
</script>
this simple code is not working :(
Seem like freegeoip.net support jsonp,you can do:
$('button').click(function () {
$.ajax({
url: "http://freegeoip.net/json/59.92.78.49",
dataType: "jsonp",
success: function (result) {
alert(result.ip); // server response
}
});
});
Fiddle Demo
I am using Jquery to fetch some xml code that I am trying to parse. I have one tag that has a bunch of similar tags nested with in it how can I extact the text from these tags and dipslay them in a paragraph right now it is taking all the text from the tags nested in the parent tag and placing them all in one paragraph.
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>DJ Ron Love Music Catalog</title>
<script type='text/javascript' src='http://imaginationeverywhere.info/jslib//dev/jquery-1.5.1.js'>
</script>
<script type='text/javascript' src="http://imaginationeverywhere.info/djronlove/itunes.js">
</script>
</head>
<body>
<h3>Displaying DJ Ron Love's Music Catalog</h3>
</body>
</html>
The js I have written is below:
$(function(){
$(window).load(function(){
$.ajax({
url: 'http://imaginationeverywhere.info/djronlove/new_2.xml',
dataType: 'xml',
success: function(xml){
$(xml).find('dict').each(function(){
var key = $(this).find('key').text();
$('<p></p>').addClass('key').html(key).appendTo('#container');
});
}
});
});
$('<div></div>').attr('id', 'container').appendTo('body');
});
$.ajax({
type: "GET",
url: "test.xml",
dataType: "xml",
success: function(xml){
parseXml(xml);
}
});
function parseXml(xml){
$(xml).find(*).each(function(){ //i have put * here for children but if you know what you want then put that instead ie "author" or "title"
var text = $(this).text();
$("body").append("<p>"+text+"</p>");
});
}
//using your code
$(document).ready(function(){
$("body").append("<div id='container'></div>");
$.ajax({
url: 'http://imaginationeverywhere.info/djronlove/new_2.xml',
dataType: 'xml',
success: function(xml){
$(xml).find('dict').each(function(){
var key = $(this).find('key').text();
$("#container").append("<p>"+text+"</p>");
});
}
});
});
Maybe something like this?
$.ajax({
url:'goGetMyscript.xml'
, type : 'GET'
, dataType : 'xml'
, success : parseXML
});
function parseXML(xml){
$(xml).find('catalogItem').each(function(){
$('#someDiv').append('<p>' + $(this).text() + '</p>' )
});
};