JavaScript - Reading An Xml File: Problem Accessing Tags
Hi
I have a large'ish project under development. The code below distills the problem I am having. In essence, I am trying to read in an XML file. It appears to load okay but when I try to count how many there are of a certain tag (The "Team" tag) I am told that there are zero. This is despite being told that that file loads okay (as the callback function is called). Javascript and the xml file is below. I hope that it is easy to follow. When the page is loaded, the initialize function is called. I first check my browser as I only need this to work on a Mozilla browser (I am using Mozilla Firefox 3.6.3). I then load the xml file and the callback function (fileLoaded) is called. I then try to find out how many "Team" tags I have, but get the message that there are zero. Sorry if this is a simple question but I have spent the best part of yesterday trying to get this to work. Any help would be appreciated. Thx G === javascript === Code: <!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" xml:lang="en" lang="en"> <head> <script type="text/javascript"> // Global variable so that everything can access it var xlmDoc; function initialize() { // This function gets called when the page loadds browserCheck(); xmlDoc=document.implementation.createDocument("", "doc", null) xmlDoc.load("small.xml"); // This file is shown at the end of this document, but it is a separate xml document xmlDoc.onload = fileLoaded; } // End of initialize function fileLoaded() { // Called when file is loaded (this does get called as expected) alert("File loaded"); var teams = xmlDoc.getElementsByTagName("Team"); var count = teams.length; alert("no of Teams: " + count); // This displays zero - WHY??? } // End of fileLoaded function browserCheck() { // START: This function just checks that I am using a Mozilla browser (I am) var moz = (typeof document.implementation != 'undefined') && (typeof document.implementation.createDocument != 'undefined'); if(moz) { alert("Mozilla"); } else {alert("Not Mozilla"); } } // End of browserCheck </script> </head> <body onload="initialize()"> </body> </html> === xml file === Code: <Root> <Team> <Type>GLF</Type> <Name>Verulam</Name> <Postcode>AL1 1JG</Postcode> <Page>693</Page> </Team> <Team> <Type>RFU</Type> <Name>London Manx RFC</Name> <Postcode>AL1 2DJ</Postcode> <Page>704</Page> </Team> <Team> <Type>RFU</Type> <Name>University of Hertfordshire RFC</Name> <Postcode>AL10 9AB</Postcode> <Page>729</Page> </Team> </Root> Similar TutorialsHello, I have a simple form with simple validation. I am just playing around a bit with forms and don't really have concrete knowledge. What I have done is created a form. Asking for first name, last name, age and email. When the user clicks the submit button I want 2 functions to run, the first checking the input is correct and also making sure all fields have a value. Once everything is checked and is O.K I want to go into another function which sends all this information to an array one by one. I am having difficulty accessing each individual input tag. I could achieve what I want to do, but it will take double the lines of code because each input has a different 'name'. So, what I am trying to do is access the input tags the same as you would do an array. Here is my code: HTML: Code: <form name="regForm" id="form"> <fieldset> <legend>Real Heroes - Registration Form</legend> <p>First Name:<input type="text" size="30" maxlength="20" name="txtFirstName" /></p> <p>Last Name:<input type="text" size="30" maxlength="20" name="txtLastName" /></p> <p>Age:<input type="text" size="30" maxlength="3" name="txtAge" /></p> <p>Email Address:<input type="text" size="30" maxlength="50" name="email" /></p> <p><input type="button" value="Submit Registration" name="butChkForm" onclick="callFuncs_onclick()" /> <input type="reset" value="Reset" name="resetForm" /></p> </fieldset> </form> JavaScript: Code: //CALLING THE FORM SCRIPTS// function callFuncs_onclick() { chkForm_onclick(); creatingDatabase_onclick(); } //**************FORM VALIDATION***************// function chkForm_onclick() { var theForm = document.regForm; if (theForm.txtFirstName.value == "" || theForm.txtLastName.value == "" || theForm.txtAge.value == "" || theForm.email.value == "") { alert("Please complete all of the form."); if (theForm.txtFirstName.value == "") { theForm.txtFirstName.focus(); } if (theForm.txtLastName.value == "") { theForm.txtLastName.focus(); } if (theForm.txtAge.value == "") { theForm.txtAge.focus(); } if (theForm.email.value == "") { theForm.email.focus(); } } else if (isNaN(theForm.txtAge.value)) { alert("That is not valid input for this field. Please re-enter your age."); theForm.txtAge.focus(); } else { alert("Thank you for completing the form, " + theForm.txtFirstName.value); } } function creatingDatabase_onclick() { var form = document.regForm; var index = form.input[0].value; alert(index); } I'm not quite sure where I am going wrong. Please note that these functions really labour the point, I know I have way too many lines of code but I am still very amateur with JS. Thank you for any help/information. Kind Regards, LC. hi Guys , I have some instructions in property files , now I wat to retrive that fmt tag values in scriptlets So that I can modify the content in property file So i have written the code in jsp as <c:set var="mailBodyData" value='<fmt:message key="confirmemail.body.message"/>' scope="request"/> <% out.println("hero "+request.getAttribute("mailBodyData")); %> but its displays empty , Also I have tried as <% String str ="<fmt:message key="confirmemail.body.message"/>' %> but its throughs the Compilation error , Pls help , So that I can retrive the data from fmt to Scriptlets i m trying to extract data from an xml file and display data on Google maps but when i try to run my code In IE - Access denied error is display (while accessing the xml file) Mozilla - code is working fine but displays following error - Error: xmlDoc.getElementsByTagName("lat")[1] is undefined Source File: file:///I:/BE%20Project%20Data/coding/Myexample/exam2.html Line: 48 HTML file- <html> <head> <title>Google Maps JavaScript API v3 Example: Fusion Tables Layer</title> <link href="http://code.google.com/apis/maps/documentation/javascript/examples/default.css" rel="stylesheet" type="text/css" /> <style type="text/css"> html { height: 100% } body { height: 100%; margin: 0px; padding: 0px } #map_canvas { height: 500px;width: 800px } </style> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> function initialize() { if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else {// code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.open("GET","agridata.xml",false); xmlhttp.send(); xmlDoc=xmlhttp.responseXML; var latlng = new google.maps.LatLng(48.75028,-94.91667); var mapOpts = { zoom: 5, center: latlng, mapTypeId: google.maps.MapTypeId.ROADMAP, }; var map = new google.maps.Map(document.getElementById("map_canvas"),mapOpts); var l1=xmlDoc.getElementsByTagName("lat")[1].childNodes[0].nodeValue; var l2=xmlDoc.getElementsByTagName("lng")[1].childNodes[0].nodeValue; var pt = new google.maps.LatLng(parseFloat(l1), parseFloat(l2)); var marker = new google.maps.Marker({ position: pt, map: map, title: 'Just a simple marker'}); } </script> </head> <body onload="initialize();"> <h1>output</h1> <div id="map_canvas"></div> </body> </html> XML file - <?xml version="1.0"?> <markers> <marker> <lat>52.09667</lat> <lng>-173.50056</lng> <state>Alaska</state> <county>Aleutian</county> </marker> <marker> <lat>48.75028</lat> <lng>-94.91667</lng> <state>Minnesota</state> <county>Lake of woods</county> </marker> <marker> <lat>52.09667</lat> <lng>-173.50056</lng> <state>Washington</state> <county>Stevans</county> </marker> </markers> do let me know the reason behind the undefined error and ACCESS DENIED error ... i have tried modification in the security setting of the browser but error is not solved yet ... thks My swf.js file is getting hacked along with some jquery files, they are injecting cross browser hacking script to .js files. Please help me how can I protect it? OK, There's a script on my site that's included like <script src='somePHPfile.php?params... etc It generates an image with some text in it and a few links. When I click 'view source' it just comes up with the <script> tags and nothing else. In Firefox, if I right click on the actual image and go to this frame > view source, I can see everything it's doing. Is there some way I can access this code with Javascript/jquery? I've tried html/dom parsers, etc. with no luck. Dear frnd I wanna read on html page , and i have script : " [I]<html> <head> <script type="text/javascript" language="javascript"> function Read() { var Scr = new ActiveXObject("Scripting.FileSystemObject"); var CTF = Scr .OpenTextFile("C:\\123.txt", 1, true); data = CTF .ReadAll(); document.write("<pre>" + data + "</pre>"); CTF .Close(); } </script> </head> <body onLoad="Read()" > </body> </html> [I] " But as its using activex control not allowing in all browser . Have you any other way with pure js to read the file contains ? or allowing activex in all browser ? i am thinking of using a xml file as a data base for example , the xml file stores a list of reference numbers which is allocated to a url or a name such as 0123456789 and i have a text box on a webpage and the user types in a reference number and the javascripts reads the xml file to check if its a valid reference number i.e a registered number i am new to working with xml etc... so would be nice to have a little help here EXAMPLE <DATA> <REF> <0123456789>JOE</01234567890> <1111111111>www.google.com</1111111111> </REF> </DATA> id like it to read the specific data thats contained within the tag such as 0123456789's tag = JOE Hi all, How can i read CSV data from the text file using Java Script.Please give me the script for the problem. Thanx, Nari Hi I'm reading a text file, manipulating the string that I've read, and then writing to a new text file called temp. The error that I am getting is basically reading past the end of the file. function SpaceFileEntries() { fso = new ActiveXObject("Scripting.FileSystemObject"); filename = "NDELPROF.txt"; path1 = document.getElementById("lblDataOutputDirectory").innerText + "\\" + filename; path2 = document.getElementById("lblDataOutputDirectory").innerText + "\\temp.txt"; s = fso.OpenTextFile(path1); j = fso.CreateTextFile(path2 , true); do { text = s.readLine(); partOne = text.substring(0,34); lastPart = text.substring(35, 54); space = " "; j.write(partOne); j.write(space); j.writeline(lastPart); } while ( text != null ) s.Close(); j.Close(); } Can someone please help me find this bug in the code. I know it's got to do with the while statement, but can't think or find good alternatives. Thanks. Daniel Somebody had posted this query on how to read text files using JavaScript.......can't find that post now... Anyways, though it's not possible to read text-files using JavaScript it is possible to read XML files using it. Here is an XML based JavaScript Ticker http://www.dynamicdrive.com/dynamicindex2/xmlticker.htm It works only on browsers supporting XML (IE) Enjoy! Hey guys, I'm writing a script and I've encountered a problem.. I have a txt file with many words, each word in a different line. For example: the file words.txt contains: word1 word2 word3 word4 word5 I need to load the content of the file into a variable in my script. I prefer that all the words will be in the same variable with line breaks, but if you'll figure out a way to put it in an array, it's ok too. I really don't know how to do it, and I tried to google but didn't understand.. By the way, I don't want to change the txt file to js file, I need it to remain txt.. Can anybody help me with that? Thanks Alot, Ran i have this code: PHP Code: <?php foreach ($freechat_list as $r) { $uniqueCode = substr($r,0,12); $id = substr($r,13); $blocked_record = RcBlockListTablePeer::isBlocked($id,$requestor_id); ?> <a href="#" id="profilelink" name="profilelink" onClick="return viewornot(<?php echo $id."/".$blocked_record; ?>)"><?php echo $uniqueCode; ?></a> } then i have my JS: [CODE] thank you all but i am totally confused now...here is my full code: <?php foreach ($freechat_list as $r) { $uniqueCode = substr($r,0,12); $id = substr($r,13); $blocked_record = RcBlockListTablePeer::isBlocked($id,$requestor_id); ?> <a href="#" id="profilelink" name="profilelink" onClick="return viewornot(<?php echo $id."/".$blocked_record; ?>)"><?php echo $uniqueCode; ?></a> } my JS: Code: function viewornot(id) { alert(id); } alert(id) only gives me the id but in my href i concatenated it with blocked_record: viewornot(<?php echo $id."/".$blocked_record; ?>) please help? Hi I have written the following code to read contents of a text file using FileReader object of HTML 5 for Google Chrome. Quote: <script> function handle_files(files) { var i; if (checkBrowser("Chrome")) { for (i = 0; i < files.length; i++) { file = files[i]; var reader = new FileReader(); ret = []; reader.onload = function (e) { console.log(e.target.result) } reader.onerror = function (stuff) { console.log("error", stuff) console.log(stuff.getMessage()) } text = reader.readAsText(file[i]); alert(text); } } } </script> ---------------------- <input type="file" multiple="multiple" onchange="handle_files(this.files)"> Unfortunately, the variable text always displays as undefined. Everything above the line text = reader.readAsText(file[0]); works fine. How can I fix it?. Or is there any other solution to read a text file using HTML5/JavaScript on Chrome? Thanks in advance. What I am trying to achieve, is a button that calls a function that changes the onclick attribute of that button, so that when it is clicked again, it resets the onclick attribute to call the default function. here is what the stripped down code looks like: Code: <html> <head> <script type="text/javascript"> function remove_prep(a){ a.value="cancel"; a.onclick="cancel_remove(this);"; } function cancel_remove(a){ a.value="remove"; a.onclick="remove_prep(this);"; } </script> </head> <body> <input type="button" value="remove" onclick="remove_prep(this);" /> </body> </html> for some reason, it only fires once, after which it ceases to work properly. thanks for the help this part of my code is killing me. I am very new to javascript. I have a problem getting to any element from this form generated by the jsp page using struts. Please show me how to get to item[0].totalAmount for example, so that I can create a function to calculate the calculateTotal(). So far, when I do the alert, it is only valid up to document.myForm.item; the document.myForm.item[0] is invalid according to the alert. Any help is very much appreciated. function calculateTotal(){ alert(document.myForm.item); } <form name="myForm" method="post" action="/myAction.do"> <table id="display" border="1"> <tr> <th scope="col" id="totalAmount">Total Amount</th> <th scope="col" id="adjustmentAmount>Adjustment Amount</th> <th scope="col" id="newAmount">NewAmount</th> </tr> <tr> <td><input type="text" name="item[0].totalAmount" id="totalAmount" value="100" readonly="readonly"></td> <td><input type="text" name="item[0].adjustmentAmount" id="adjustmentAmount" value="" onblur="javascript:calculateTotal();" readonly="readonly"></td> <td><input type="text" name="item[0].newAmount" id="newAmount" value="" readonly="readonly"></td> </tr> <tr> <td><input type="text" name="item[1].totalAmount" id="totalAmount" value="350" readonly="readonly"></td> <td><input type="text" name="item[1].adjustmentAmount" id="adjustmentAmount" value="" onblur="javascript:calculateTotal();" readonly="readonly"></td> <td><input type="text" name="item[1].newAmount" id="newAmount" value="" readonly="readonly"></td> </tr> </table> </form> Hello I am fairly new to Javascript. I have a function which takes a string which consists of key value pairs and sets a form control based on key being the form element name and value being the value to set. eg string could be "key1=orange;key2=2;key3=whetever" Here is the function: function processresponse(frm, serverResponse) { var items = serverResponse.split(";"); for(var i = 0; i < items.length; i++) { var item = items[i]; var eqchar = item.search("="); if(eqchar != -1) { var key = item.slice(0, eqchar); var value = item.slice(eqchar+1); var elemname = key; if(document.getElementById(elemname) != null) { var type = frm.elements[elemname].type; if (type=="checkbox") { value == "1" ? frm.elements[elemname].checked=true : frm.elements[elemname].checked=false; } else if (type=="text"){ //do processing for text (text input) frm.elements[elemname].value = value; } else if(type=="select-one"){ //only one is openformmode - default to [0] - true if(value == "0" || value.length == 0) { frm.elements[elemname].options[0].selected = true; } else { frm.elements[elemname].options[1].selected = true; } } else { alert("unknown ctrl type: " + type + " name: " + frm.elements[elemname].name + " val: " + value + " key: " + key); } } //if(frm.getElementById(elemname) } } } The problem line is: var type = frm.elements[elemname].type; elemname is case sensitive so if for example the form element is called dog and the string elemname is Dog, then the line fails with Error: 'elements[...].type' is null or not an object So my check if(document.getElementById(elemname) != null) is insufficient to guard against this. I realise I could do a try catch but there must be a more legant way than that. How can I test the formname more reliably? Any ideas would be very welcome. Angus hy all, I am creating an accordion menu that when i press the " UNIT " tab, it opens up a list of " Chapters " tab, and when i press on any one of those chapters, a list of lessons opens up. Till now, i have managed to create all the appropriate lists, but in default, lessons and chapters are opened automatically, and the lessons elements when pressed do not scroll back up to the chapters parents. My html5 file: Code: <script type="text/javascript" src="jqueryjs.js"></script> <script type="text/javascript" src="jqueryuiaccor.js"></script> <script type="text/javascript"> $(document).ready(function() { $('#accordion').accordion(); }); </script> <div id="container"> <div id="content"> <div id="sidebar"> <ul id="accordion"> <li> <a href="#recent" class="heading">Unit 1</a> <ul id="accordion"> <li> <a href="#recent" class="heading">Chapter 1 </a> </li> <ul id="accordion2"> <li> Lesson 1 </li> </ul> </ul> </li> <li> <a href="#recent" class="heading">Unit 2</a> <ul id="accordion"> <li> <a href="#recent" class="heading">Chapter 1 </a> </li> <ul id="accordion"> <li> <a href="#recent" class="heading" role="tab" aria-expanded="true">Chapter 2 </a> <ul id="accordion"> <li> <a href="#recent" class="heading">Lesson 1 </a></li> </ul> </li> </ul> </ul> </li> </ul> </div> </div> </div> My acorjs.js file: Code: $(document).ready(function() { $('ul#accordion a.heading').click(function() { $(this).css('outline','none'); if($(this).parent().hasClass('current')) { $(this).siblings('ul').slideUp('slow',function() { $(this).parent().removeClass('current'); $.scrollTo('#accordion',1000); }); } else { $('ul#accordion li.current ul').slideUp('slow',function() { $(this).parent().removeClass('current'); }); $(this).siblings('ul').slideToggle('slow',function() { $(this).parent().toggleClass('current'); }); $.scrollTo('#accordion',1000); } return false; }); }); Please HELP! Hello, I have a multi-dimensional object, derived from JSON returned by the Foursquare API. The object has the following structure (as printed using a print_r type method from http://www.openjs.com/scripts/others...hp_print_r.php PHP Code: '0' 'id' => "27110xxx" 'created' => "Sun, 11 Apr 10 15:09:45 +0000" 'timezone' => "America/New_York" 'user' ... 'id' => "48xxx" 'firstname' => "Barry" 'lastname' => "xxx" 'photo' => "http://playfoursquare.s3.amazonaws.com/userpix_thumbs/4abb5bxxxxxx.jpg" 'gender' => "male" 'display' => "xxxx. @ [off the grid]" '1' ... 'id' => "2538xxxx" 'created' => "Wed, 07 Apr 10 13:24:41 +0000" 'timezone' => "Europe/London" Could anyone tell me the best way to access its elements? I have this so far which gets the required values, but I want to preserve the order ie. get the data from the first element in the object first, then move to the next - each element represents a user so I want to keep their data separate. PHP Code: /* This is a custom function which has the same function as print_r */ function dump(arr,level) { var firstName, lastname, geolat, geolong, photo; var dumped_text = ""; if(!level) level = 0; //The padding given at the beginning of the line. var level_padding = " "; for(var j = 0; j < level + 1; j++) level_padding += " "; if(typeof(arr) == 'object') { //Array/Hashes/Objects for(var item in arr) { var value = arr[item]; if(typeof(value) == 'object') { //If it is an array, dumped_text += level_padding + "'" + item + "'\n"; dumped_text += dump(value,level + 1); } else { dumped_text += level_padding + "'" + item + "' => \"" + value + "\"\n"; } if (item == 'firstname') { firstname = value; document.write("First name: " + firstname + "<br />"); document.write(item); } if (item == 'lastname') { lastname = value; document.write("Last name: " + lastname + "<br />"); document.write(item); } if (item == 'geolat') { geolat = value; document.write("Latitude: " + geolat + "<br />"); document.write(item); } if (item == 'geolong') { geolong = value; document.write("Longitude: " + geolong + "<br />"); document.write(item); } } } else { //Stings/Chars/Numbers etc. dumped_text = "===>"+arr+"<===("+typeof(arr)+")"; } return dumped_text; } var myObj = <?php echo json_encode($checkin); ?>; alert(dump(myObj)); Sorry for the bloated code, I normally work in Java and PHP so although I understand the theory, I haven't worked with objects much in JavaScript before. Any help would be much appreciated! Hey is it possible to access javascript variables in an iframe src page from the parent page, or vice versa. How do you do this? What about the DOM? thanks I'm trying to accessing the Parent window fom a sub window previously opened using window.open I'm using firebug to t yand debug, and it shows that this DOM entry exists.. window.opener.location.href But trying to access it gives "window opener is null" error I've tried all these, and get the various errors tagged on the end... Code: <script language="JavaScript"> //alert(opener.location); // = opener is null //alert(opener.location.href); // = opener is null //alert(parent.location); // = uncaught exeption - could not convert to javascript argument arg 0 //alert(parent.location.href); // = Permission denied to get property Location.href //alert(parent.opener.location); // = uncaught exeption - could not convert to javascript argument arg 0 //alert(parent.opener.location.href); // = Permission denied to get property Location.href //alert(parent.window.opener.location.href); // = Permission denied to get property Location.href //alert(parent.window.opener.location.href); // = Permission denied to get property Location.href //alert(window.opener.location); // = window opener is null //alert(window.opener.location.href); // = window opener is null //alert(window.parent.location); // = uncaught exeption - could not convert to javascript argument arg 0 </script> driving me crazy! Anyone have a solution? |