JavaScript - Create New Blank Xml Object With Javascript
I know I can use the functions like parseFromString() to access and modify an existing XML documents, but is it possible to use JavaScript to create a blank xml document?
I want to take data entered into the client, package it up as XML and use ajax to transmit it to the server. So far I've written my own class to create a simple xml document, but I'd like to do it properly with the inbuilt functions. Similar TutorialsI'm writing a script in javascript(actually a chrome extension) and I need an object that I can write to it like this(sorry, don't know how to explain it better) and then I convert it to string with format of json. Code: id[129].weekDay[6].hour[23] = 0 Here, id is an array, that each element in it contain another array(weeksDay) and in that array each contain another array(hour). The id indices are unlimited, for weekDay 7 and hour 24. I searched in google but i couldn't find what I wanted. Actually don't know the best keyword to search.(objects in arrays?) I don't know what exactly it is called, I can write it's declaration in VB.NET if that helps you. Hi, every time I try and alert: [ { number:0, secondnumber:0 }, { number:2, secondnumber:1 }, { number:1, secondnumber:2 } ] it just shows [object object], [object object], [object object]. Why is this and what can I do to make the record be shown as it is above in an alert? Thanks. I have a select with a OnChange Function. I would like to know how to create a different object depending on the selection on the Select. Example: MySelect have Option 1 and Option 2, so If (Myselect.value == Option 1) {Create Object 1} If (Myselect.value == Option 2) {Create Object 2} I'm using the object under <body> and it's working, but when I'm trying to use it under a <script> does not work. This is the object I'm trying to create: (It is a map) so what I'm trying is to change the values or map depending on the selection of the Select. <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="900" height="600" id="zoom_map" align="top"> <param name="movie" value="us_albers.swf?data_file=senate.xml" /> <param name="quality" value="high" /> <param name="bgcolor" value="#FFFFFF" /> <embed src="us_albers.swf?data_file=senate.xml" quality="high" bgcolor="#FFFFFF" width="100" height="100" name="Clickable U.S. Map" align="top" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer"> </embed> </object> Thank you very much This is in reference to Crockford's articles found he http://javascript.crockford.com/prototypal.html http://javascript.crockford.com/private.html I'm attempting to understand the use of privileged methods when used with Object.create. I put together a quick demo (code below) that shows what happens when I use Object.create to create a new object based on one that has a privileged method. The outcome is not pleasant, as changing the value in the first object also changes it in the second. Unless I am reading Crockford's articles incorrectly, this makes Object.create almost useless for anything but objects that have only public members. I've seen many JavaScript programmers use closures extensively to create private members, and that still holds to be a good programming practice. However I still can't find an elegant way to create inheritance in combination with closures in JavaScript, given downfalls such as the one I mentioned above. With all of that said I still think Crockford has a nice way of programming, creating factory functions that produce objects, staying away from the prototype property and making the language look more functional. Here's the code to demonstrate what I'm referring to. Firebug needs to be enabled to view the console.debug output, otherwise convert them to alerts. Code: if (typeof Object.create !== 'function') { Object.create = function (o) { function F() {} F.prototype = o; return new F(); }; } var o = (function() { var msg = "hi"; return { msg: function(m) { if (m === undefined) { return msg; } msg = m; } }; })(); var foo = Object.create(o); var bar = Object.create(foo); console.debug(foo.msg()); // "hi" foo.msg("what?"); console.debug(foo.msg()); // "what?" console.debug(bar.msg()); // "what?" I am doing my homework for my class, and I don't usually ask for this much help because I get most of them done by myself. However, I am having a really hard time to understand this time. I have lots lots of questions...I tried to follow the instructions that I got from my professor, but it seems not clear enough to me... If anyone can fix or add on my codes, I will be really really appreciated....and here is the instructions and my codes.. If the form validates, instead of returning true, call the GetValues() function followed by the DisplayOutput() function. so, I changed result true to calling functions like this, Code: if (blnError == true){ return false; } else { DisplayOutput(); GetValues(); } In the .js file, create a PortraitOrder class using the following specifications Properties: portrait, copies, size, buyer Method: CalculateCost () -- determines the size (radio buttons) and then mutiplies the related cost by the number of copies Code: function PortraitOrder(){ var cost; this.copies = ""; this.portrait = ""; this.size = ""; this.buyer = ""; var CalculateCost = { met1 : function () { if(size == 0){ cost = this.copies * 10 } else if(size ==1){ cost = this.copies * 20 } else if(size ==2){ cost = this.copies * 10 } else if(size ==3){ cost = this.copies * 30 } else{ cost = this.copies * 20 } } } } Create a new instance of the class named portraits as a global variable in the ,js file -" I don't see why I need this. So I did not create Create a GetValues() function that will retrieve the values from the form fields (document.forms[0].element.value) and assign them the properties of the instance of the PortraitOrder class. use a for loop to retrieve the value from the radio buttons use the prototype property to add a new property named email to the instance of the class retrieve the value from the form field and assign it to the new email property Code: function GetValue(){ this.copies = document.forms[0].Copies.value; this.buyer = document.forms[0].Buyer.value; var file = document.getElementsByName('Filename'); for(var i = 0; i < file.length; i++){ if(file[i].checked){ this.portrait = file[i].value; } } var sizes = document.getElementsByName('Size'); for(var i = 0; i < sizes.length; i++){ if(sizes[i].checked){ this.size = sizes[i].value; } } GetValue.prototype.email = document.forms[0].Email.value; } Create a DisplayOutput() function that calls the CalculateCost () method for the current instance of the class. displays the image using the value from the portrait property which contains the filename. Be sure to include height and width (and that would be why all of the images had to be the same dimension. These values can be hardcoded. The filename, however, may NOT be hard coded.. it must use the object.property format. displays the buyer, email, copies, size, and cost using the object.property format (document.forms[0].element.value is not permitted) The cost must be formatted as ##.## where # represents a number (Hint: Use a method of the Number class). It is NOT okay just to concatenate .00 to then end of the cost. Code: function DisplayOutput(){ CalculateCost.met1(); document.write("buyer: " + this.buyer); document.write("Email: " + email); document.write("Portrait: " + this.portrait); document.write("Copies: " + this.copies); document.write("Cost: " + "$"+cost.toFixed(2)); document.write("Thank you"); } The order form must include the site's header and footer and coordinate with the rest of the site. There is no form processing file, everything is done in the .js file. You may think like, this is horrible codes. And yes, it is. I know probably this is totally odd. This is why I came here for ask help. Also, I spent days to tried, but I could not get any idea...Anyone please help me on this? How can i display a javascript object having [CODE]var myVarr = [{"name":"xyz","age":21}, {"name":"cde","age":25}].[CODE] in a table in jsp page? Regards, Anas I am rather new to javascript programming and not sure if this is the best approach to handle a problem. In setting up a simple image display that can later be modified to a rotator, I am using the following code window.document.display1.src = image1.src; now the question is when modifying that to be more dynamic, where display1,display2,.. can refer to a different image (or set). var Image = "image"; var Display = "display"; for (i=1; i<n; i++){ window.document.this[Display+i].src = this[Image+i].src; } I know the right hand side of the equation is working (alert() displays the right soure), but the problem is the left hand side. I guess because of me not fully understanding the way objects work. why this[] works on the right and not on the left? and how do I resolve it? All your comments, and a push in right direction are appreciated. Hi all, Have problem from getting data of JavaScript Object ie. Associative Array. Code: var a, table1 a = new ActiveXObject("MyProgID"); a.GetDataFromExcel("C:\\Users\\myFolder\\Desktop\\test.xls","Sheet1") a.Generate() table1 = a.writeInTable(); Here writeInTable function returns a 2D Object array from DLL written in VB.Net. So I got the Object to table1. But from table1, I can't access the values but its there. table1 shows values as in this image(Image Attached.) Actually, I tried many ways like tab(0)(0) tab[0][0] tab["0"] tab.(0).(0) tab.[0].[0] Also with toArray(), (new VBArray(tab)).toArray().... I don't know what I am wrong..Can anyone help me on this? Thanks... Shanmugavel.C Hi, My JS Date validation was failing for a date which as per business is a valid date (01/01/0001) - MM/DD/YYYY It seems that the constructor for Date object is doing something funny.. var dayobj = new Date(yearfield, monthfield-1, dayfield) wasn't working for this case whereas teh one mentioned below seems to be working fine : var dayobj = new Date() dayobj.setFullYear(yearfield,monthfield-1,dayfield) What's the trick here ?? I have several list items in an html document. Each list item has an anchor tag and each anchor has an 'onmouseover' event. Is it possible to get the containing object for the event upon the mouseover? Hi i am confused in one topic and need help, I have a javascript array containing objects like; Object values are ordered as Type, Amount and count. Object 1 => ("A" , 100 ,10) Object 2 => ("C" , 50 ,10) Object 3 => ("A" , 100 ,20) Object 4 => ("B" , 200 ,10) Object 5 => ("A" , 10 ,10) Object 6 => ("B" , 100 ,10) Object 7 => ("C" , 100 ,5) Object 8 => ("C" , 50 ,5) In the end i want to group these objects like ; ("A" , 100,30) (Note : 30 = 20 +10) ("A" , 10,10) ("B" , 200,10) ("B" , 100,10) ("C" , 100,5) ("C" , 50,15) 15 = 10 + 5 How can i do this in javascript, note that the new types will be added to this array ? Hi, I am trying to create an array to pass to JQuery, but after several hours of trying, am falling over. I am trying to use Ajax to populate the javascript FullCalendar. I am trying to pass an arry to the following property: This works: $('#calendar').fullCalendar({ events: [{"id":1112,"title":"Event1","start":"2009-10-10"},{"id":222,"title":"Event2","start":"2009-10-20","end":"2009-10-22"}] }; something like: $('#calendar').fullCalendar({ events: MyJSArray() }; I will be using AJAX to populate MyJSArray(). I have tried the likes of: MyJSArray = new array("id"=>112,"title"=>"Event1", etc); But no joy I don't know how to get a javascript array into that format. I have my database values, but I need to put them into a format that the "Event" will accept. I have used PHP and arrays fine, but coming to grips with JS arrays,etc are a bit finiky at the moment. I am a little stuck, any help or points in the right direction will be much appreciated. Thanks Blueevo. I was going through an article on JavaScript objects on "http://www.howtocreate.co.uk/tutorials/javascript/javascriptobject" and there I read Quote: Intrinsic objects - variable types with constructors. * Array * Boolean * Date * Function * Image * Number * Object * Option * Regular Expression * String does it mean that, whenever I want to use any of these objects, I have to create it using new and only then I can use its properties or methods ? 1) There are other objects like document, history, location, navigator, parent and screen. If objects which need to be created using constructor are called intrinsic objects , then what are other objects which can be used without constructor are called as ? Array, Boolean, Image, Date etc all start with capital letter. While document, history, navigator etc start with lower case letter. Why is that ? Is there any difference between objects that start with upper case and those start with lower case ? Are they known by different names ? Thanks Hi, I'm looking for some help, or perhaps an explaination in regards to "click & rotate" an image using your cursor with Javascript. I've seen this a couple of times on various websites and I'm wondering how difficult/expensive it is to develop such an image. I own a clothing company and what I'm looking to do is to create images on my website of a product in which the customer can click on and "rotate" to see a 360 degree view of the product. Think autocad to a degree... Is Javascript the best language to pursue for this function? I'm quite new to this department, so any help/advice is greatly appreciated. Firstly let me say, im relatively new to Javascript so im still picking things up.. I have a website that i want to add several mp3's onto. When a user clicks a link i wanted to make javascript change the streaming audio to the one that was selected. My HTML is as follows.. Code: <table style="background-color:Black; color:gold; font-weight:700; font-size:16px"> <tr onClick="Click('http://www.m-hops.co.uk/Music/Motown Flavours.mp3')"><td> 1. Motown Flavours </td></tr> <tr onClick="Click('http://www.m-hops.co.uk/Music/All_Around_The_World.mp3')"><td> 2. All Around The World </td></tr> <tr><td> <OBJECT ID="MediaPlayer" WIDTH="290" HEIGHT="50" CLASSID="CLSID:22D6F312-B0F6-11D0-94AB-0080C74C7E95" STANDBY="Loading Windows Media Player components..." TYPE="application/x-oleobject"> <PARAM id="TRACK" name="FileName" value="http://www.m-hops.co.uk/Music/Motown Flavours.mp3"> <PARAM name="autostart" value="true"> <PARAM name="ShowControls" value="true"> <param name="ShowStatusBar" value="true"> <EMBED id="sound" TYPE="application/x-mplayer2" src="" NAME="MediaPlayer" WIDTH="290" HEIGHT="50" ShowControls="1" ShowStatusBar="1" autostart="1"> </EMBED> </OBJECT> </td></tr> </table> and my Javascript is.. Code: <script language="javascript" type="text/javascript"> function Click(track) { document.getElementById('TRACK').value = track; window.alert(document.getElementById('TRACK').value); } </script> It appears that the right track is being parsed to the javascript but its not changing the audio thats being played. Any ideas?? I am trying to understand why I had an error, or why my solution worked. In my HTML I had: Code: <script language="JavaScript" type="text/javascript" src="Book.js"></script> <script language="JavaScript" type="text/javascript" src="Book_TEST.js"></script> Book.js said: Code: function Book(title, author) { this.title = title; this.author = author; } Book.prototype.toString = function() { return '"' + this.title + '" by '+ this.author; }; var Book = new Book ("John", "Dough"); alert (Book); // displays "John Dough" And, predictably, at this stage, the code worked. Book.js said: Code: var myBook = new Book ("JavaScript Tutorials", "Herong Yang"); However, at this point the JavaScript would crash and I'd get an error "Error: Book is not a constructor javascript." I drove myself nuts trying to figure out why the code wasn't working at this later point. Eventually, I copied another object: Code: /* * Person class */ /** * Person constructor * * @param {String} first * The person's first name * @param {String} last * The person's last name */ function Person(first, last) { this.first = first; this.last = last; } /** * Create a string representation of this object * * @return {String} A string representation of this object */ Person.prototype.toString = function() { return this.first + " " + this.last; }; /* var person = new Person ("John", "Dough"); alert (person); // displays "John Dough" */ and then used find and replace to swap {Person, first, last} with {Book, title, author}, resulting in: Code: /* * Book class */ /** * Book constructor * * @param {String} title * The Book's title * @param {String} author * The Book's author */ function Book(title, author) { this.title = title; this.author = author; } /** * Create a string representation of this object * * @return {String} A string representation of this object */ Book.prototype.toString = function() { return '"' + this.title + '" by '+ this.author; }; var Book = new Book ("John", "Dough"); alert (Book); // displays "John Dough" Now, the code worked fine in both script. (i.e., no more error.) So far as I can tell, the only differences between the first and next version of Book.js are the comments and the whitespace. Am I missing something? Can the comments or whitespace somehow effect the logic with which this code has been executing? If I get an error like this again, is there an easier/better way to fix it than to essentially retype the code? Thanks in advance for helping me to understand this. Hi All, I am using javascript to get the number of rows in my HTML Table by using below code: Code: var oRows = document.getElementById("HTMLTable").getElementsByTagName('tr'); var iRowCount = oRows.length; Later I am using iRowcount in the FOR loop further in my code as below: Code: for(k=1; k<=iRowCount; k++) { ............................ rest of code ........... ............................ } This piece of code is working fine (i.e. it handles the functionalities which is needed) but it also opens a new browser window with the error message "Object Required".I have really no idead why this is happening.Can anyone suggest me the reason for this? Thanks in advance. -Anil Hi I am using a custom form elements script in the link below: www_bristolstreet_co_uk/page/find_a_dealer.htm and an error for null object is appearing from this line: active = option[0].childNodes[0].nodeValue; Can anyone please help? I am a novice at Javascript but got this script working perfectly on my local machine - once I loaded it the live site it didn't work... any advice would be greatly appreciated. I am currently designing a table as such Code: ___________________________ | TABLE | | | FRAME A |___________________________| | last row clicked | FRAME B |___________________________| the top frame is a table and the bottom frame contains the last row clicked called through onclick. question: if frame B is a php file with a javascript object, how do i call the javascript object's function to print the data? here is what i have so far index.html //this is the source code for the site Code: <html> <frameset rows = "60%, 40%"> <frame src = "table_driver.php" name = "A" id = "FRAME1"> <frame src = "bottom_row.php" name = "B" id = "FRAME2"> </frameset> </html> printJSTable() //prints the table shown in frame A Code: function printJSTable() { echo '<script src = "java_script.js"></script>'; echo '<script src="sorttable.js"></script>'; echo '<table class = "sortable" id = "myTable" border = "1">'; echo '<thead id = "header"><tr>'; foreach($this->columns as $header => $order) { echo '<th>'; echo $header; echo '</th>'; } echo '</tr></thead><tbody>'; $counter = 0; for($i = 0; $i < $this->numRows; $i++) { //IMPORTANT changeRow(this) is JS call echo '<tr onclick = "changeRow(this)" onmouseover = "mouseOver(this)" onmouseout = "mouseOut(this)">'; foreach($this->data[$i] as $key => $value) { echo '<td>'; if($value!="") echo $value; else { echo ''; } $counter++; echo '</td>'; } echo '</tr>'; } echo '</tbody></table>'; echo '<form><input id = "'.$this->numRows.'"type = "button" value = "add row" onclick = "addRow(id)"></form>'; } and this is changeRow(this) which is supposed to create the table in frame b Code: //populates headersArr and rowArr correctly parent.B.obj = new TableData(headersArr, rowArr); parent.B.obj.printTable(); here are the function definitions for TableData Code: function TableData(headers, row) { this.headerArr = headers; this.rowArr = row; } TableData.prorotype.printTable = function() { for(i=0; i<this.headerArr.length; i++) { document.write('<tr><th>'); document.write(this.headerArr[i]); document.write('</th><td>'); document.write(this.rowArr[i]); document.write('</td></tr>'); } } and then, finally, this is the php file for the bottom frame Code: <html> <head> <link rel = "stylesheet" type = "text/css" href = "style.css"/> <script type = "text/javascript" src="java_script.js"></script> </head> <body> <script> obj = new TableData; </script> </body> </html> what i want to do is populate the variable obj from ^ (bottom_row.php) and then use the print function to print it out. right now it is populating correclt,y but i cant get it to print. The error console says that Value undefined (result of expression parent.B.obj.printTable) is not object. ?? sry for all the code! just didnt want to leave anything out thanks! Hi, I'm very new to javascript and I need your help. What I'm trying to do is: I have a html file with javascipt embeded in, in this file I want to use a table object in another javascript file. How do I access this object? Your help is very much appreciated. Regards, lep2 |