www.webdeveloper.com
Results 1 to 8 of 8

Thread: help with DOM and JS

  1. #1
    Join Date
    Apr 2003
    Posts
    5

    help with DOM and JS

    HI I'm new to this stuff and was reading some tutorials on formating xml into html it seemed to be going pretty good but now Im having some problems when trying to use JS to fillter the results. can som one look at my code and point me in the right direction. thanks

    <html>
    <head>

    <script type="text/javascript">

    var xmlDoc=new ActiveXObject("Microsoft.XMLDOM")
    xmlDoc.async="false"
    xmlDoc.load("BB_CAST.xml")

    var z = xmlDoc.getElementsByTagName("PERSON")
    var x = xmlDoc.getElementsByTagName("NAME")
    var y = xmlDoc.getElementsByTagName("BIO")

    for (i = 0; i <= x.lenght; i++)
    {
    if (z.item(i-1).getAttribute("ID") = "1")
    {
    name.innerText = x.item(i-1).text

    bio.innerText = y.item(i-1).text

    }
    }
    </script>

    <title></title>
    </head>
    <body>

    <h1>cast</h1>

    <b>Name: </b>
    <span id="name"> </span>
    <br />
    <b>Bio: </b>
    <span id="bio"></span>

    </body>
    </html>

  2. #2
    Join Date
    Apr 2003
    Location
    London, UK
    Posts
    95

    Typo

    Spotted a typo (length):

    for (i = 0; i <= x.lenght; i++)

  3. #3
    Join Date
    Apr 2003
    Posts
    5
    it works with vbscript so I think my problems in the syntax IF statments or the spans. I'm not sure even some link to a good tutorial on this would help.

    Thanks


    This is an example of the xml if that helps.

    <?xml version="1.0" encoding="ISO-8859-1"?>
    <CAST>
    <PERSON ID="1">
    <NAME>QUEST</NAME>
    <BIO>Separately, they are four, seemingly</BIO>
    <SHORTBIO>Four dudes, One ission</SHORTBIO>
    </PERSON>

    <PERSON ID="2">
    <NAME>Sam Kuhlmann</NAME>
    <BIO>As resident “rich" .....</BIO>
    <SHORTBIO>RICH </SHORTBIO>
    </PERSON>

    <PERSON ID="3">
    <NAME>Brady Poter</NAME>
    <BIO>A self-educated ...</BIO>
    <SHORTBIO>Love Harry</SHORTBIO>
    </PERSON>

    <PERSON ID="4">
    <NAME>Andy</NAME>
    <BIO>“HI! I’m Andy! My ecialty.</BIO>
    <SHORTBIO>BananaMan</SHORTBIO>
    </PERSON>

    <PERSON ID="5">
    <NAME>Mark</NAME>
    <BIO>At 13 Mark is the self-proclaimed ...</BIO>
    <SHORTBIO>Home Shopper</SHORTBIO>
    </PERSON>

    </CAST>

  4. #4
    Join Date
    Apr 2003
    Posts
    5
    Thanks for catching that typo. but still no worky

  5. #5
    Join Date
    Dec 2002
    Location
    Calgary, Canada
    Posts
    2,653
    Here you go...

    Code:
    <?xml version="1.0"?>
    <!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" xml:lang="en" lang="en">
    <head>
      <title>Untitled</title>
    	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-5"/>
    	<meta name="Author" content="Khalid Ali"/>
    	
    <link type="text/css" rel="stylesheet" href="http://68.145.35.86/skills/javascripts/style/js_tutorials_style.css"/>	
    <script type="text/javascript">
    function Process(){
    
      var xmlDoc=new ActiveXObject("Microsoft.XMLDOM")
      xmlDoc.async="false"
      xmlDoc.load("BB_CAST.xml")
      
      var z = xmlDoc.getElementsByTagName("PERSON")
      var x = xmlDoc.getElementsByTagName("NAME")
      var y = xmlDoc.getElementsByTagName("BIO")
    
      var strHTML = "<table style=\"width:200px;border:1px green solid; background-color:#FFFFFF;\" ><tr><td style=\"width:50px;\"><b>Name</b></td><td style=\"width:150px;\"><b>Bio</b></td></tr>";
      for (i = 0; i < x.length; i++){
        if (z.item(i).getAttribute("ID") == (1+i)){
          var person = z.item(i);
          var name = person.childNodes[0];
          var bio = person.childNodes[1];
          strHTML+="<tr><td style=\"width:50px;\">"+name.text+"</td><td style=\"width:150px;\">"+bio.text+"</td></tr>";
        }
      }
      
      strHTML+="</table>";
    
      document.getElementById("displayData").innerHTML = strHTML;
    }
    </script>
    
    <title></title>
    </head>
    <body onload="Process();">
    
    <h1>cast</h1>
    <div id="displayData"></div>
    </body>
    </html>

  6. #6
    Join Date
    Apr 2003
    Posts
    5
    Thanks I learned alot from that. I had alot of fun trying to figuring out how it works. But now I have another problem.an example of the code in which I think I have a problem with is below. do single quotes need to be treated diffrently?

    strHTML +="<td onmouseover=\"over(this);\" onmouseout=\"out(this);\" onClick=\"MDprocess(\'"+Mnum.text+"\');\"> p>"+Mname.text+"</p></td>";

    Thanks

  7. #7
    Join Date
    Dec 2002
    Location
    Calgary, Canada
    Posts
    2,653
    Rest of the code looks fine
    only one possibility
    strHTML +="
    variable strHTML?..is it local if its local then the first instance of it can not be
    strHTML +=" unless you define it firs

    strHTML = "";
    now you can use
    strHTML +="

  8. #8
    Join Date
    Apr 2003
    Posts
    5
    Ok. I have two XML pages one with each persons info(which movies each person has made and a bio) and one with each short movies info(size,format,title, who made it).
    In the movie section of the site I'm trying to load the movie names from the movie xml into a table In a Iframe(this works) and be able to click on them and have a short discription of the movie and a link to download load into another Iframe(this is where my problem is).

    these are the two main functions useing what you showed me yesterday.


    //this one is set onLoad and opens the movie xml and creates a table in this frame where each cell is a link to a diffrent movie ID
    function mProcess(){


    var xmlDoc=new ActiveXObject("Microsoft.XMLDOM")
    xmlDoc.async="false"
    xmlDoc.load("BB_MOVS.XML")

    var z = xmlDoc.getElementsByTagName("SHORT")


    var strHTML = "<table cellspacing=\"5\" cellpadding=\"3\" style=\"border:1px black solid;\" ><tr>";
    for (i = 0; i < z.length; i++){

    var vid = z.item(i);
    var Mname = vid.childNodes[0];
    var Mnum = vid.childNodes[8];
    strHTML += "<td onmouseover=\"over(this);\" onmouseout=\"out(this);\" onClick=\"MDprocess('"+Mnum.text+"');\"><p>"+Mname.text+"</p></td>";


    }
    strHTML += "</tr></table>";
    document.getElementById("displayData").innerHTML = strHTML;
    }

    //this one I have set on a onClick and should open a movie discription and a link to download in the right iframe.
    function MDprocess(movid){


    var xmlDoc=new ActiveXObject("Microsoft.XMLDOM")
    xmlDoc.async="false"
    xmlDoc.load("BB_MOVS.XML")

    var z = xmlDoc.getElementsByTagName("SHORT")


    var strHTML = "<table style=\"width:540px;border:1px black solid;\" ><tr><td style=\"width:540px;\">";
    for (i = 0; i < z.length; i++){
    if (z.item(i).getElementsByTagName("ID") == movid){
    var movie = z.item(i);
    var name = movie.childNodes[0];
    var sumery = movie.childNodes[3];
    var pics = movie.childNodes[4];
    strHTML+="<p>"+name.text+"</p></td></tr><tr><td style=\"width:540px;\"><img ALIGN=\"left\" border=\"0\" src="+pics.text+" width=\"250\" height=\"200\"><b>"+sumery.text+"</b></td></tr>";
    }

    }

    strHTML+="</table>";
    parent.frames["right"].document.body.innerHTML = strHTML;
    }


    Hope you can understand all that.
    Thanks

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles