JavaScript - Creating And Managing Unknown Numbers Of Objects
ok, so I can make an object, I can also make a new instance of that object and have it running around the screen at the same time.
What I'm a bit confused about is how to go about things when I want X number of these objects. So instead of making objects seperately I need a loop. Instead of referring to each object seperately every time I want to redraw it, I want to loop through all instances of the object. Except I can't quite see how one goes about doing this. I need something like (pseudocode) Code: for (i = 0;i <= 10; i++) { var dot + i = new Dot; } and var b = numberOfDots; for (i = 0;i <= b; i++) { dot + i +.moveMe(); drawDot(dot + i + .posY, dot + i +.posX); } obviously this code does not work but it represents the essence of what i'm trying to do and can't get my head around, no matter the google searches I try. Similar TutorialsHello, I have the following code: A = { "value" : "a", }; B = A ; B.value = "b"; alert (A.value); // => b I expected A.value to be "a". Can someone explain what I'm thinking wrong? And: how can I change values of a new object, without changing the parent-object ? tnx hi, My script creates random numbers as shown in ; 2,5,8 1,4,5 8,9,4 5,3,3 1,1,2 2,5,8 5,3,3 ...... ...... but there are many duplications as in row1 and row6(2,5,8.)....row4 and row7 how can we modify the script so that there wont be any smilir lines.. thanks.. here is my script. PHP Code: <script> keywords1 = ["1","4","5","7","2","3"]; keywords2 = ["5", "9", "2", "10","11","6","4"]; keywords3 = ["13", "1", "3", "4", "6","7","8","2"]; var toplam=0; z1=keywords1.length z2=keywords2.length z3=keywords3.length toplam=z1*z2*z3; say=0; zaman=setInterval("yaz()",500); function yaz() { var keyword1 = keywords1[Math.floor(Math.random()*keywords1.length)]; var keyword2 = keywords2[Math.floor(Math.random()*keywords2.length)]; var keyword3 = keywords3[Math.floor(Math.random()*keywords3.length)]; say++; document.getElementById("kutu").innerHTML+=keyword1+".."+keyword2+".."+keyword3; document.getElementById("kutu").innerHTML+="<br>"; document.getElementById("kutu2").value=say; document.getElementById("kutu3").value=toplam; if(say>=toplam) dur(); } function dur() { clearInterval(zaman); } </script> <input type=button value=yazz onclick="yaz()">.. .<input type=button value=dur bakalım onclick="dur()"> ....<input type=text value="" id=kutu2 size=3> ....<input type=text value="" id=kutu3 size=3> <div id="kutu" style="position:absolute;top:5;left:250;background-color:yellow;border-style:solid;border-width:5;border-color:red;"></div> <div id="kutux1" style="position:absolute;top:5;left:350;background-color:yellow;border-style:solid;border-width:5;border-color:red;"></div> </body> </html> Hello! I am trying to create a javascript code in which I prompt the user for a number (an integer from 0 to 100) to search for, then search a function with the number they entered and then display whether the number was found, and if found, a location where it can be found within the list. Can you please tell me what is wrong? <html> <head> </head> <body> <script language = "javascript"> var list = new Array(200); for (var i=0; i < 200; i++){ list=Math.round(Math.random()*100) + " "; document.write(list); } var value=prompt("What is the number you are searching for? ", " "); if (list[i]==value){ {alert("Number has been found in location" +i)}; } </script> </body> </html> Thank you Hi I am trying to create a page that has a couple of pop-up overlay boxes from a couple of links, Everything is working ok I think except for a problem on a browser resize. The original code I found : ( http://kalyanchakravarthy.net/?p=208 ) was created or only one window so the resize code controls both windows, when I think need each one controlled separately. The resize code will make a closed overlay box appear. Any suggestions or help will be greatly appreciated. THANK YOU 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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <script language="javascript" src="jquery-1.2.6.min.js"></script> <!--script language="javascript" src="jquery-schedule-overlay.js"></script--> <style type="text/css"> .bgCover { background:#000; position:absolute; left:0; top:0; display:none; overflow:hidden } .overlayBox { border:1px solid #09F; position:absolute; display:none; width:730px; height:600px; background:#fff; } .overlayBoxb { border:1px solid #09F; position:absolute; display:none; width:730px; height:600px; background:#fff; } .overlayContent { padding:0px; } .overlayContentb { padding:0px; } .closeLink { float:right; color:red; text-decoration:none; } a:hover { text-decoration:none; } </style></head> <body> <div class="bgCover"> </div> <a href="#" class="launchLink">Launch Window</a> <div class="overlayBox"> <div class="overlayContent"> <a href="#" class="closeLink">Close</a> <img src="Session-A-mock-up.jpg" alt="Session A Schedule " /> </div></div> <br /><br /> <a href="#" class="launchLinkb">Launch Window 2</a> <div class="overlayBoxb"> <div class="overlayContentb"> <a href="#" class="closeLink">Close</a> <img src="Session-B-mock-up.jpg" alt="Session B Schedule "/> </div></div> <script language="javascript"> function showOverlayBox() { //if box is not set to open then don't do anything if( window.isOpen == false ) return; // set the properties of the overlay box, the left and top positions $('.overlayBox').css({ display:'block', left:( $(window).width() - $('.overlayBox').width() )/2, top:( $(window).height() - $('.overlayBox').height() )/2 -20, position:'absolute' }); // set the window background for the overlay. i.e the body becomes darker $('.bgCover').css({ display:'block', width: $(window).width(), height:$(window).height(), }); function showOverlayBoxb() { windowb=window.open; //if box is not set to open then don't do anything if( windowb.isOpen == false ) return; // set the properties of the overlay box, the left and top positions $('.overlayBoxb').css({ display:'block', left:( $(window).width() - $('.overlayBoxb').width() )/2, top:( $(window).height() - $('.overlayBoxb').height() )/2 -20, position:'absolute' }); // set the window background for the overlay. i.e the body becomes darker $('.bgCover').css({ display:'block', width: $(window).width(), height:$(window).height(), }); } function doOverlayOpen() { //set status to open isOpen = true; showOverlayBox(); $('.bgCover').css({opacity:0}).animate( {opacity:0.5, backgroundColor:'#000'} ); // dont follow the link : so return false. return false; } function doOverlayOpenb() { //set status to open isOpen = true; showOverlayBoxb(); $('.bgCover').css({opacity:0}).animate( {opacity:0.5, backgroundColor:'#000'} ); // dont follow the link : so return false. return false; } function doOverlayClose() { //set status to closed isOpen = false; $('.overlayBox,.overlayBoxb').css( 'display', 'none' ); // now animate the background to fade out to opacity 0 // and then hide it after the animation is complete. $('.bgCover').animate( {opacity:0}, null, null, function() { $(this).hide(); } ); } // if window is resized then reposition the overlay box $(window).bind('resize',showOverlayBox) ; $(window).bind('resize',showOverlayBoxb) ; // activate when the link with class launchLink is clicked $('a.launchLink').click( doOverlayOpen ); // activate when the link with class launchLink2 is clicked $('a.launchLinkb').click( doOverlayOpenb ); // close it when closeLink is clicked $('a.closeLink').click( doOverlayClose ); </script> </body> </html> Hello. I am setting up a simple registration page for a community arts project, but I am new to JS and having some issues. Right now I have a list of check boxes like this: Code: <input type="checkbox" id="HA0001" onclick="updateTotal()" /> Wendy Day <input type="checkbox" id="HA0002" onclick="updateTotal()" /> Al Benne <input type="checkbox" id="HA0003" onclick="updateTotal()" /> Julie Steppe What I would like to do is GET the input boxes ID value - which will be different for every checkbox. That value will correspond with a variable of the same name in my javascript code, that will be added or subtracted from the users total cost. So when a box is clicked, I need my variable (called "currentId") to update to the ID value, such as "HA0001" - etc. I was thinking something along the lines of this, but I know it is incorrect: Code: var currentId = document.getElementById.id; All the other add/subtract stuff I will figure out, but I am having a problem getting the ID value from a checkbox when it is clicked. Can anyone help me figure this out? THANKS! -AJ an unknown popup appears every once in a while in my site...i have never been using popups ever..and i use wordpress... the popup appears once in every 3 to 7 days ..and sometimes once a every 20 page loads..(my site has lot of impressions so 20 is a high possibility) and the popup link is http://ads.linkbucks.com/redrockspop-sumo.html further i use statcounter (http://www.statcounter.com/) and whos.amung.us (http://whos.amung.us) as visitor tracing systems but i never heard that they cause popups so i guess nothing wrong with that, i tried to find which is the cause of this but i failed.. I appriciate if you guys can help me with this and my site url is : http://channelslk.com Thanks in Advance So... I'm using an AJAX query to replace the innerHTML for an element. On the "front end" of the site, this method works fine in IE7/8... For some reason - in the administrative back end - not so much. I'm not sure why. I get an "Unknown runtime error" in IE7/8 - though works fine in Chrome/FireFox... I'm posting the HTML for the page I'm having problems with and also the HTML that is being returned by the AJAX query. I'm beating my head against a wall here. Any help would be great! :-) I've attached the HTML for the page in question... AJAX query returns: Code: <form name="domains" id="domains"> <table border="1" cellpadding="0" cellspacing="0" width="500" id="domain_table"> <tr style="font-weight: bold; font-size: 14px; text-align: center; height: 25px; background: #214232; color: #fff; "><td>Practice Area</td><td>City</td><td>Excellent Keyword Domain Name</td><td>Select</td></tr><tr style="background: #fff;"><td colspan="4"> </td></tr> <tr bgcolor="#d6e3bc"><td align="left" colspan="4"><b>Bankruptcy</b></td></tr> <tr bgcolor="#d6e3bc"><td> </td><td align="left">Anchorage</td><td align="left">AnchorageBankruptcyAttorney.net</td><td align="center"><input type="checkbox" name="seldomains[]" id="domain_37" value="37-1" /></td></tr> <tr style="background: #fff;"><td colspan="4"> </td></tr> <tr bgcolor="#d6e3bc"><td align="left" colspan="4"><b>Criminal</b></td></tr> <tr bgcolor="#d6e3bc"><td> </td><td align="left">Anchorage</td><td align="left">AnchorageCriminalAttorney.net</td><td align="center"><input type="checkbox" name="seldomains[]" id="domain_38" value="38-1" /></td></tr> <tr style="background: #fff;"><td colspan="4"> </td></tr> <tr bgcolor="#d6e3bc"><td align="left" colspan="4"><b>Divorce</b></td></tr> <tr bgcolor="#d6e3bc"><td> </td><td align="left">Anchorage</td><td align="left">AnchorageDivorceAttorney.net</td><td align="center"><input type="checkbox" name="seldomains[]" id="domain_39" value="39-1" /></td></tr> <tr style="background: #fff;"><td colspan="4"> </td></tr> <tr bgcolor="#d6e3bc"><td align="left" colspan="4"><b>Dui</b></td></tr> <tr bgcolor="#d6e3bc"><td> </td><td align="left">Anchorage</td><td align="left">AnchorageDuiAttorney.net</td><td align="center"><input type="checkbox" name="seldomains[]" id="domain_40" value="40-1" /></td></tr> <tr style="background: #fff;"><td colspan="4"> </td></tr> <tr bgcolor="#d6e3bc"><td align="left" colspan="4"><b>Personal Injury</b></td></tr> <tr bgcolor="#d6e3bc"><td> </td><td align="left">Anchorage</td><td align="left">AnchoragePersonalInjuryAttorney.net</td><td align="center"><input type="checkbox" name="seldomains[]" id="domain_41" value="41-1" /></td></tr> <tr style="background: #fff;"><td colspan="4"> </td></tr> <tr bgcolor="#d6e3bc"><td align="left" colspan="4"><b>Trial</b></td></tr> <tr bgcolor="#d6e3bc"><td> </td><td align="left">Anchorage</td><td align="left">AnchorageTrialAttorney.net</td><td align="center"><input type="checkbox" name="seldomains[]" id="domain_42" value="42-1" /></td></tr> <tr style="background: #fff;"><td colspan="4"> </td></tr> </table> <table border='0' width='500'> <tr><td align='right'><input type=button onClick='addToProduct();' value='Update Product' /></td></tr> </table></form> Hi, I've written a small script for a website, and strangely enough (or maybe not) it works in Firefox and Chrome but not IE. I'd read about block level inside inline causing this but i'm still not entirely sure. Here is the offending script: Code: function changeImage(image) { if (image == 6) { var vid = document.createElement('object'); vid.width = "700"; vid.height = "370"; vid.id = "photo"; vid.innerHTML = '<param name="movie" value="http://www.youtube-nocookie.com/v/g4cpDgGlFng&hl=en_US&fs=1&rel=0"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube-nocookie.com/v/g4cpDgGlFng&hl=en_US&fs=1&rel=0" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="700" height="370"></embed>'; document.getElementById("body").replaceChild(vid, document.getElementById("photo")); } else { var img = document.createElement('img'); var old = document.getElementById("photo") img.width = "700"; img.height = "370"; img.id = "photo"; img.alt = "Photo of Gippsland Lakehous"; img.src = "images/photos/" + image + ".jpg"; document.getElementById("body").replaceChild(img, old); } The offending line is the long innerHTML one. I'm sure this must be a very hacky way of doing things (incidentally the thing is replacing an image with another image or video depending on what is clicked), but I rarely code at all, so don't know any better Thanks! function($) { $.fn.superfish = function(op){ var sf = $.fn.superfish, c = sf.c, } So I see the '.superfish' method being added to the object '$.fn'. I find it interesting that the first order of business is to declare 'sf' and stuff in to it some value '$.fn.superfish' which I do not fully understand. Also the statement c=sf.c How can 'c' be set to equal 'sf.c' when no 'sf.c' has been declared yet? Thanks! Good day, I have the following code: Code: var img = new Image(); img.myProperty = 'something'; I've tried Image.prototype.myProperty and a few other things. It seems IE just doesn't want me extending the Image object. Is there a known work-around? Thanks Hi If i was using c# i would use a generic list and add all my people objects to the list collection but how do i do this in jquery/javascript eg //container object var allObj= { }; //people object var people= { name:"fred",: age:00; }; How do I add many people objects to allObj (the amount of people added in not always the same) eg the final result is something like this allObj -person1 -person2 -person3 -person4 thanks I'm trying to reuse some code in a different context to do a different job. The code to be reused contains hundreds of lines similar to a = new b.c.d(e,f) with different value for e and f. I need to create a new user defined object with the structure b.c.d. I've made numerous attempts along the lines of: Code: function d (e, f) { this.e = e; this.f = f; } function c () { this.d = d (e, f); } function b () { this.c = c; } var a = new b.c.d("test", "message"); with various permuations of functional declarations. However I get error message "Object expected" or "b.c.d is null or not an object" at the final line of the example. It works with the test line var a = new d("test", "message") but not when I start to build up the expression. How should I define of b.c.d? Hello everybody am a JavaScript beginner. here is a code making rollovers //////////////////////////////////////////////// window.onload=rolloverInit; function rolloverInit() { for(var i=0; i<document.images.length; i++) { if(document.images.parentNode.tagName=="A") { setUpRollover(document.images); } } } function setUpRollover(currentImage) { currentImage.outImage = new Image(); currentImage.outImage.src = currentImage.src; currentImage.onmouseout = rollOut; currentImage.overImage = new Image(); var source = currentImage.src; var sourceText = source.toString(); if(sourceText.indexOf("png")>0) { currentImage.overImage.src ="images/"+currentImage.id+"_on.png"; } else { currentImage.overImage.src ="images/"+currentImage.id+"_on.gif"; } /*currentImage.overImage.src ="images/"+currentImage.id+"_on.gif";*/ /*currentImage.overImage.src ="images/"+currentImage.id+"_on.png";*/ currentImage.onmouseover = rollOver; currentImage.clickImage = new Image(); if(sourceText.indexOf("png")>0) { currentImage.clickImage.src ="images/"+currentImage.id+"_click.png"; } else { currentImage.clickImage.src ="images/"+currentImage.id+"_on.gif"; } /*currentImage.clickImage.src = "images/"+currentImage.id+"_on.gif";*/ /*currentImage.clickImage.src = "images/"+currentImage.id+"_on.png";*/ currentImage.onmousedown = rollClick; currentImage.parentNode.childImage = currentImage; currentImage.parentNode.onblur = rollOutParent; currentImage.parentNode.onfocus = rollOverParent; } function rollOut() { this.src = this.outImage.src; } function rollOver() { this.src = this.overImage.src; } function rollClick() { this.src = this.clickImage.src; } function rollOutParent() { this.childImage.src = this.childImage.outImage.src; } function rollOverParent() { this.childImage.src = this.childImage.overImage.src; } //////////////////////////////////////////////// 1-I do understand "if iam right, lol" that here ///currentImage.outImage = new Image();/// and here ///currentImage.overImage = new Image();/// and here ///currentImage.clickImage = new Image();/// we are creating an image object "overImage" on the fly which still a property of currentImage object, to keep track and store the current image and new image src. but here ///currentImage.parentNode.childImage = currentImage;/// I am unable to see the point behind creating the childImage object -same rule applied here??? is it really a brand new independent object "still a property of the parent" created on the fly like before? and if so -what is is purpose here?? how the cildImage object is interacting here, what is its purpose? and how it is able to modify "actually change" the <a> object child node Image object "currentImage". it seems stupid question but its quiet simple ---///currentImage.parentNode.childImage = currentImage;/// here I have an object on the fly, a new Image object "childImage", that is Fine until now. ---///this.childImage.src = this.childImage.outImage.src;/// now how the childImage became able to change my parent "<A>" child "currentImage" src ??? how it "childImage" became displayable at all is is because of the assignment here ///currentImage.parentNode.childImage = currentImage;/// ??? Yes i assigned currentImage to the childImage, but based on my java programing concepts background each still independent objects refrences representing two different objects ---->and so based on that here is these functions rollOutParent(), rollOverParent() am supposed to say something like ***this.currentImage.src = this.childImage.src*** or ***this.childImage.src = this.childImage.outImage.src;***or whatever "i know thats wrong coding here am just giving example". ------------ am confused, how with this simple line of code currentImage.parentNode.childImage = currentImage; childImage became able to define the currentImage ? and if so, how this was achieved, hoe the Objects is being represented and how they interact in the core memory? Hi All I thought it was about time to actually learn Javascript rather than pretend I know it, so I'm new to Javascript. I've been reading Javascript 'The Good Parts' and have watched a few google videos on Youtube. So I came across prototyping which seems to be quite fundamental to JS but is quite awkward to use. I am trying to avoid the use of the 'new' keyword and limit my application to one Global variable, as this can improve the JS scripts performance, reliability and security. In essence I'm just trying to make a simple MsgBox object that has a method called 'alertMe', which in turn simply shows an alert box with 'Hello' If this is not very clear then say so as trying to explain something you don't fully understand is quite hard. Here's my code, doesn't alert when I called the object. Have a look Code: var MyLib = {}; MyLib.MsgBox = function(){ //Object methods MyLib.MsgBox.prototype.alertMe = function(){ alert('Hello'); }; }; MyLib.MsgBox.alertMe(); Any help and pointers will be very appreciated. Regards, Magnetica Is it possible to create an array of objects? I require a two dimensional array of objects. Thanks! I'm having a spot of trouble in making my functions work and my book seems to be pure rubbish. I'm sure that the error is purely syntax, although it may be something more. Code: <script type="text/javascript" src="flowers.js"></script> <script type="text/javascript"> function pageSetup() { var today = new Date(); // this creates a date object with today's date var banner = displayBanner(today); // *should* call the displayBanner function var days = calcDaysToSale(today); // *should* call the function using today's date document.sale.saleMessage.value = days; // *should* set the value to days. // Obviously none of it works. } </script> This is the code working with the script contained in the html file. I'll post the full page at the bottom. The following code is the JavaScript code. The first function isn't made to provide full functionality at the moment, I'm trying to get the rest of it working. Code: function displayBanner(currentDate) { if (currentDate.getMonth() == 2) imgSrc = "winterLogo"; return ("<img src='" + imgSrc + ".gif'>"); } function calcDaysToSale(currentDate) { var saleDay = new Date(); saleDay.setDate(15); // sets the sale date to the 15th of the current month // Subtracts the days remaining until the sale. // If the number is negative, the sale is over. var Days = saleDay.getDate()-currentDate.getDate(); if (Days < 0) { return "The sale has ended."; } else { return Days; } } I have tried to Google the problem and I have also tried to look it up in my book. I simply don't know the right terms to Google, and as I said the book is rubbish. I don't know why the Code: document.sale.saleMessage.value = days; doesn't work for this. Oh well, I'll learn quickly I suppose. Here is the full HTML code: 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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Carol's Flowers</title> <link href="flowers.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="flowers.js"></script> <script type="text/javascript"> function pageSetup() { var today = new Date(); // this creates a date object with today's date var banner = displayBanner(today); // *should* call the displayBanner function var days = calcDaysToSale(today); // *should* call the function using today's date document.sale.saleMessage.value = days; // *should* set the value to days. // Obviously none of it works. } </script> </head> <body class="oneColLiqCtrHdr"> <div id="container"> <div id="header"> <p><img name="myBanner" src="banner" id="myBanner" alt="Carol's Flowers" /> <!-- end #header --> </p> <div id="links"><a href="#">Home</a> | <a href="#">General Arrangements</a> | <a href="#">Seasonal Designs</a> | <a href="#">Custom Orders</a> | <a href="#">Location</a></div> </div> <div id="mainContent"> <table id="mainTable"> <tr> <td width="201"><h1><img src="Flowers.JPG" alt="Random Flowers" width="200" height="255" /></h1></td> <td width="687"> <p>Here at Carol's Flowers, we believe that there is a perfect floral arrangment for every occasion! Take a look around and see if there is anything you like. If we don't already have it, then we will create it for you!</p></td> </script> </tr> </table> <!-- end #mainContent --></div> <div id="footer"> <p> <form name="sale" id="sale"> Days Until Mid Month Madness Sale : <input type="text" name="saleMessage" id="saleMessage" /></form></p> <!-- end #footer --></div> <!-- end #container --></div> <!-- I am trying to run the script here --> <script type="text/javascript"> pageSetup(); </script> </body> </html> Hi, I am trying to detect a users browsers and output a different code based on browser. I found this code online that uses the object detection method and it works. When I document.write(BrowserDetect.browser) it outputs Chrome, (which is what I am using). The code can be found he http://www.quirksmode.org/js/detect.html So I can't understand why the following code does not work? It ouputs the "not" in the else statement. I believe that BrowserDetect is an object and the .browser at the end is a property of the object. Can one not make an object a variable? or make an object a string? oh and BTW there is a bunch of javascript that creates the browserdetect object that can be found on the site above, but I thought it would be too unwieldy to post here. Thanks. The following script outputs: Chrome Not Working <script type="text/javascript"> document.write(BrowserDetect.browser); var browser="BrowserDetect.browser"; if(browser=="Chrome") { document.write(" Working"); } else { document.write(" Not working"); } </script> I am able to do the following; Code: alert(myObject.Income.EESA.Name); However I'm looking at Code: alert(myObject.Income[0].Name); Or even better, not the full name, just "EESA". I need to loop through as you can see at the end of this script what I'm working on. Code: <script type="text/javascript"> var EESARate = 289.3; var DLARate = 111.20; var CARate = 61.35; var SkyCost = 54.75; var PerfectHomeCost = 28.17; var CreditExpertCost = 14.99; var UnitedUtilitiesCost = 8.13; var BTCost = 57.18; var AdobeCCCost = 46.88; var TVLicenceCost = 6.06; var GasCost = 10.00; var ElectricCost = 20.0; var ServerPackageCost = 9.99; var USDValue = 123; //Fetch the value var myObject = { "Income": { "EESA": { "Name": "Enhanced Employment and Support Allowance", "Amount": { "GBP": EESARate, "USD": EESARate * USDValue }, "Frequency": { "When": "14", "Next": "30/10/2014" }, "Description": "", }, "DLA": { "Name": "Disibility Living Allowance", "Amount": { "GBP": DLARate, "USD": DLARate * USDValue }, "Frequency": { "When": "7", "Next": "Wednesday" }, "Description": "", }, "CA": { "Name": "Carers Allowance", "Amount": { "GBP": CARate, "USD": CARate * USDValue }, "Frequency": { "When": "7", "Next": "Saturday" }, "Description": "", }, }, "Bills": { "Sky": { "Name": "Sky", "Amount": { "GBP": SkyCost, "USD": SkyCost * USDValue }, "Frequency": { "When": "30", "Next": "XX/XX/XX" }, "Description": "", }, "PerfectHome": { "Name": "Sky", "Amount": { "GBP": PerfectHomeCost, "USD": PerfectHomeCost * USDValue }, "Frequency": { "When": "7", "Next": "Wednesday" }, "Description": "", }, "CreditExpert": { "Name": "Experian Credit Expert", "Amount": { "GBP": CreditExpertCost, "USD": CreditExpertCost * USDValue }, "Frequency": { "When": "30", "Next": "XX/XX/XX" }, "Description": "", }, "UnitedUtilities": { "Name": "United utilities", "Amount": { "GBP": UnitedUtilitiesCost, "USD": UnitedUtilitiesCost * USDValue }, "Frequency": { "When": "7", "Next": "Wednesday" }, "Description": "", }, "BT": { "Name": "British Telecomunications", "Amount": { "GBP": BTCost, "USD": BTCost * USDValue }, "Frequency": { "When": "30", "Next": "XX/XX/XX" }, "Description": "", }, "AdobeCC": { "Name": "Adobe Creative Cloud Suite", "Amount": { "GBP": AdobeCCCost, "USD": AdobeCCCost * USDValue }, "Frequency": { "When": "30", "Next": "XX/XX/XX" }, "Description": "", }, "TVLicence": { "Name": "Television Licence", "Amount": { "GBP": TVLicenceCost, "USD": TVLicenceCost * USDValue }, "Frequency": { "When": "30", "Next": "XX/XX/XX" }, "Description": "", }, "Gas": { "Name": "Eon Gas", "Amount": { "GBP": GasCost, "USD": GasCost * USDValue }, "Frequency": { "When": "7", "Next": "Wednesday" }, "Description": "", }, "Electric": { "Name": "Eon Electric", "Amount": { "GBP": ElectricCost, "USD": ElectricCost * USDValue }, "Frequency": { "When": "7", "Next": "Wednesday" }, "Description": "", }, "ServerPackage": { "Name": "1&1 Unlimited Plus (12 mo. term)", "Amount": { "GBP": ServerPackageCost, "USD": ServerPackageCost * USDValue }, "Frequency": { "When": "30", "Next": "XX/XX/XX" }, "Description": "", }, }, }; var IncomeTotal = 0; for (var k in myObject.Income) { if (myObject.Income.hasOwnProperty(k)) { ++IncomeTotal; } } alert(myObject.Income.EESA.Name); document.write('<table>') for(i = 0; i < IncomeTotal; i++){ document.write('<tr>') document.write('<td>row ' + (i+1) + ', column 0</td>') document.write('</tr>') } document.write('</table>') var TotalBills = 0; for (var k in myObject.Bills) { if (myObject.Bills.hasOwnProperty(k)) { ++TotalBills; } } //alert(TotalBills); </script> Hello there folks, First time poster, so please be gentle I am ok with using objects creating classes if someone else defines, but when it comes to defining my own, I hit a nasty brick wall... I am using an XML/XSLT wrapper called Sarissa to help with programming a utility to transform XML into HTML in different views. For this to happen, I have created a Loader class which loads in XML required. I am aware of prototyping for binding methods to objects (as opposed to replicating the same method every time an instance is created)... The aim being I want to create a progress bar for the essential files that need to be loaded in. Presently I have them load in Synchronous mode just to get the utility working, which I know is poor, so would like to address it. So can someone answer me this: I understand why this works: Code: var SWMU = new Object(); SWMU.stylesheets = new Object; SWMU.joblot = null; SWMU.cache = new Object; SWMU.filtering = new Object; SWMU.locns = null; function Loader(sXml, sTitle) { this.doc = Sarissa.getDomDocument(); this.doc.load(sXml); this.doc.summary = sTitle; this.doc.onreadystatechange = function() {if(this.readyState) {alert(this.summary + " state change to..." + this.readyState);} else {alert(this.summary + " state change to..." + this.doc.readyState);} } } function async() { SWMU.stylesheets[0] = new Loader("swmu_test/swmu_berthing.xsl", "Main SWMU Stylesheet"); SWMU.stylesheets[1] = new Loader("assets/xsl/controls.xsl", "Drop down boxes"); } function _init() { async(); } as it recreates the "this.doc.onreadystatechange" anonymous function everytime an instance is created (which is yuck). However, when I do this (using prototype)... Code: var SWMU = new Object(); SWMU.stylesheets = new Array; SWMU.joblot = null; SWMU.cache = new Object; SWMU.filtering = new Object; // Now define the Loader object // Create the loader method for dealing with items loaded function Loader(sXml, sTitle) { this.doc = Sarissa.getDomDocument(); this.doc.load(sXml); this.doc.summary = sTitle; } function rHandler() {alert(this.summary + " State changed to... "+this.readyState);} // Create the request handler Loader.prototype.doc = {}; Loader.prototype.doc.onreadystatechange = rHandler; function async() { SWMU.stylesheets[0] = new Loader("swmu_test/swmu_berthing.xsl", "Main SWMU Stylesheet"); SWMU.stylesheets[1] = new Loader("assets/xsl/controls.xsl", "Drop down boxes"); } function _init() { async(); } Nothing happens and no errors are thrown, though there should be an alert box everytime there is state change to the progress of a file loading. Can someone help me with this? Apologies if this is on the basic side, but it has been causing me a headache all week, and I can not find any answers on this. Shaun Greetings! This is actually a two part question from the html source I attached as a .txt document (too big for the post). 1) How can I get the name of an object. I took my failed attempt in the function named disableJobStream: Code: function disableJobStream(obj) { if((obj.value == "completed") && (getRadioCheckedValue("shift") == "2")) { if(obj.name == "artprogs") { document.shiftreport.artprogs.disabled = true; } } <select style="100px;" name="artprog_stat" OnChange="disableJobStream(this)"><option style='background-color:white;' value='none'selected='selected'>None</option> <option style='background-color:red;' value='stopped'>Stopped</option> <option style='background-color:yellow;' value='running'>Running</option> <option style='background-color:green;' value='completed'>Completed</option> </select> 2) Once I put my form through validation any of the fields that I disabled become enabled again. How would I go about keeping that from happening? Page is too large to post and too large to put up as an attachment! Thanks for your help! |