Solved

JQUERY AND XML

Posted on 2013-02-06
10
319 Views
Last Modified: 2013-11-19
I need to add a Table to the right of Image and text xml attributes hitting and season.
On the same row as the Image and text
How can I add Hitting these AB="4" R="0" H="0" RBI="0" DOUBLE="0" TRIPLE="0" HR="0"
and Season Season AB="472" H="115" R="70" BB="42" KO="71" CS="4" DOUBLE="25" TRIPLE="5" RBI="43" HR="14" to the right of my page with image and name is there anyway to add Hitting Attributes and Season Attributes.
http://www.powerzsoftware.com/lineup2.html
http://www.powerzsoftware.com/33661.XML

Please help my Boss is tough and he thinks this shit should be done in 5 minutes. The Dude that helped me out with this is awesome I added a CSS EFFECT to expand images. Check It out.
0
Comment
Question by:powerztom
  • 6
  • 4
10 Comments
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38861770
Have a look here how your XML is structured

http://xmlgrid.net/

Load from URL and then you need the xPath that matches your needs
0
 

Author Comment

by:powerztom
ID: 38861799
Nice Tool nOT QUITE WHAT i WANT. could you write an XPATH STATEMENT FOR HITTING AND THEN TRY AND WRITE ONE FOR SEASON. pLease
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38861844
Why don't you start and we can help you fix any issues. You know your data better than we do
0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 

Author Comment

by:powerztom
ID: 38861977
Attached is how I need data retrieved and positioned
Pic1.png
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38863178
Here you go.

It is a little more than just answering questions...

Change
			li.appendChild(txt);
			document.getElementById("players").appendChild(li);

Open in new window

to
			li.appendChild(txt);
			getStats(players[i],li);
			document.getElementById("players").appendChild(li);

Open in new window

and add this
function getStats(player,li) {
  var hittingAttribs = ["AB","DOUBLE","TRIPLE"]; // fill in order
  var seasonAttribs = ["HR","DOUBLE","TRIPLE"]; // fill in order
  var hitting = player.getElementsByTagName("Hitting")[0];
  if (!hitting) {
  	  li.appendChild(document.createTextNode("- Not found")); // or nothing
  	  return;
  }
  var season = player.getElementsByTagName("Season")[0];
  if (!season) {
  	li.appendChild(document.createTextNode(" - Not found")); // or nothing
    return;
  }
  var txt = " Hitting: ";
  for (var i=0;i<hittingAttribs.length;i++) {
  	txt += hittingAttribs[i]+"="+hitting.getAttribute(hittingAttribs[i])+" ";
  }
  li.appendChild(document.createTextNode(txt));
  li.appendChild(document.createElement("br"));  	
  var bold = document.createElement("b");  	
  txt=" Season: ";
  for (var i=0;i<seasonAttribs.length;i++) {
  	txt += seasonAttribs[i]+"="+season.getAttribute(hittingAttribs[i]);
  }
  bold.appendChild(document.createTextNode(txt));
  li.appendChild(bold);
}

Open in new window

0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 500 total points
ID: 38863188
By the way, I did not use any jQuery.

If you want to use jQuery you should change all of the code to use it

function getStats(player,li) {
  var hittingAttribs = ["AB","DOUBLE","TRIPLE"]
  var seasonAttribs = ["HR","DOUBLE","TRIPLE"]
  var hitting = player.find("Hitting");
  if (!hitting) {
  	  li.append("- Not found");
  	  return;
  }
  var season = player.find("Season");
  if (!season) {
  	li.append("- Not found");
    return;
  }
  li.append(" Hitting: ");
  $.each(hittingAttribs,function(i, attrib) {
  	li.append(attrib+"="+hitting.attr(hittingAttribs[i])+" ");
  });
  li.append("<br/>");  	
  var bold = $("<b/>");  	
  bold.append(" Season: ");
  $.each(seasonAttribs,function(i, attrib) {
  	bold.append(attrib+"="+hitting.attr(hittingAttribs[i])+" ");
  });
  li.append(bold);
}
$(document).ready(function(){
  $.ajax({
    type: "GET",
    url: "33661.XML", 
    dataType: "xml",
    success: function(data){
        var players = $(data).find("Player");
	    var li="",txt="",img = "";
        $.each(players,function(i,player) {
        	player=$(player);
			li = $("<li/>");
			li.append($("<img/>").attr("src","http://images.sportsnetwork.com/MLB/attheballpark/players/" + player.attr("ID") + ".jpg"));
			txt = " " +
				player.attr("FirstName") + " " +
				player.attr("Lastname") + ", " +
				player.attr("Pos");
			li.append(txt);
			getStats(player,li);
			
			$("#players").append(li);
		
		});
	}
  });
});

Open in new window

0
 

Author Closing Comment

by:powerztom
ID: 38864034
Thanks for the code this really helps me moveon to the next phase. I cann't thankyou enough.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38864284
You are welcome.

If you need more help, feel free to contact me on the email in my profile
0
 

Author Comment

by:powerztom
ID: 38864756
Your Level of knowledge is amazing I'm going to be your best friend of the next few years. This project is evolving there are many more things that need to be created. I am a VB ASP.NET so JQUERY JAVA SCRIPT CSS3 is foreign to me.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 38865061
:) I have been scripting since 1995 or so. You can be my friend :)

https://coderbits.com/mplungjan
0

Featured Post

Master Your Team's Linux and Cloud Stack!

The average business loses $13.5M per year to ineffective training (per 1,000 employees). Keep ahead of the competition and combine in-person quality with online cost and flexibility by training with Linux Academy.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Before we dive into the marketing strategies involved with creating an effective homepage, it’s crucial that EE members know what a homepage is. In essence, a homepage is the introductory, or default page, of a website that typically highlights the …
"In order to have an organized way for empathy mapping, we rely on a psychological model and trying to model it in a simple way, so we will split the board to three section for each persona and a scenario and try to see what those personas would Do,…
The viewer will learn how to dynamically set the form action using jQuery.
In this fourth video of the Xpdf series, we discuss and demonstrate the PDFinfo utility, which retrieves the contents of a PDF's Info Dictionary, as well as some other information, including the page count. We show how to isolate the page count in a…

809 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question