JavaScript - Filtering Children Object From Parent
Similar Tutorialsmorning all, I need help with a HTML UL I have ul inside ul but all I want to get when I select a certain list is the children of that list but remove the ul inside that list so they dont show at all http://pastebin.com/m98deaff any help would be great , current selecting code is http://pastebin.com/m6f4b886f Code: <div class="demo" id="demo_1"> <ul> <li id="1" class="open"><a id="1" href="#"><ins> </ins>Root node 1</a> <ul> <li id="2"><a id="2" href="#"><ins> </ins>Child node 1</a></li> <li id="3"><a id="3" href="#"><ins> </ins>Child node 2</a></li> <li id="4"><a id="4" href="#"><ins> </ins>Some other child node with longer text</a></li> <li id="6"><a id="6" href="#"><ins> </ins>Root node 222</a> //SHOUL NOT BE IN MY ARRAY <ul> <li id="7"><a id="7" href="#"><ins> </ins>Child node 222a</a></li> <li id="8"><a id="8" href="#"><ins> </ins>Child node 222b</a></li> <li id="9"><a id="9" href="#"><ins> </ins>Some other child node with longer text 222</a></li> </ul> //END OF UL ELEMENT N OT NEEDED THERE COULD BE more than 1 </li> </ul> </li> <li id="5"><a id="5" href="#"><ins> </ins>Root node 2</a></li> </ul> </div> Hey all, I have a dropdown (id='job-roles'), and I would like to remove a class from all of the options in the dropdown when certain conditions are met, but I cannot figure out how to do it. Is anyone able to help please? Thanks. Hi guys I have a navagation like this: Code: <ul id="nav" class="menu"> <li><a href="">Link Hover</a> <ul> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> </ul> </li> <li><a href="">Link Hover</a> <ul> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> </ul> </li> <li><a href="">Link Hover</a> <ul> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> </ul> </li> <li><a href="">Link</a></li> <li><a href="">Link</a></li> <li><a href="">Link Hover</a> <ul> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> <li><a href="">hidden</a></li> </ul> </li> </ul> Im trying to use javascript to count only the direct li children of ul. So I tried childnode but im not really familiar with it. Basically the li items inside the li should not be counted. Hi guys I was wondering if its possible in javascript to do something like this: Code: document.getElementById('div').children('img').style This is my code with int value I can target children is this also possible with a string like img? 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" dir="ltr" lang="en-gb" xml:lang="en-gb"> <head> <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> <script type="text/javascript"> window.onload=function() { var d = document; var e = d.getElementById('t'); e.children[0].style.border = "solid black 1px"; } </script> </head> <body> <div id="t"> <img width="120" height="80" src="./images/full6.jpg" alt="" /> <img width="120" height="80" src="./images/full6.jpg" alt="" /> <img width="120" height="80" src="./images/full6.jpg" alt="" /> <img width="120" height="80" src="./images/full6.jpg" alt="" /> </div> </body> </html> Hello all, I have a page which has a form and also one iframe in the same. there is a button on the parent form. when the button is clicked, i am submitting the iframe and parent both. forms are getting submitted. but when i do print_r for iframe values, it is blank below is the code Parent page: Code: <? print "<pre>"; print_r($_POST); print "</pre>"; ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CONTENT="EditPlus"> <META NAME="Author" CONTENT=""> <META NAME="Keywords" CONTENT=""> <META NAME="Description" CONTENT=""> </HEAD> <SCRIPT LANGUAGE="JavaScript"> <!-- function validate(){ document.getElementById('mainform').submit(); window.frames['iframe1'].document.forms[0].submit(); } //--> </SCRIPT> <BODY> <FORM METHOD=POST ACTION="" name='mainform' id='mainform'> <TABLE> <TR> <TD>Name</TD> <TD><INPUT TYPE="text" NAME="Name_VC"></TD> </TR> <TR> <TD>Address</TD> <TD><INPUT TYPE="text" NAME="Address_VC"></TD> </TR> <TR> <TD colspan=2><INPUT TYPE="button" name="proceed" value="Save" onClick="validate();"></TD> </TR> </TABLE> </FORM> <iframe src="test1.php" id='iframe1'></iframe> </BODY> </HTML> iframe page : test1.php Code: <? print "<pre>"; print_r($POST); print "</pre>"; ?> <form name='mainform2' id='mainform2' method='post' action=''> Roll number : <INPUT TYPE="text" NAME="Rollnum" value=''> Age: <INPUT TYPE="text" NAME="Age_IN" value=''> </form> Please tell me what is my mistake or how can i achieve values of all 4 fields Million thanks Hello everyone, I have a page. In that page is an iframe, lets name it 'A'. inside A there is another iframe 'B'. there is a link on that page which on click opens a popup. In that pop up, there is actually a document upload facility. Now i want that after every upload (onSubmit), iframe A should refresh. have done it many times but today its not working. Code: function validate() { (window.parent.opener.location.href)=(window.parent.opener.location.href); window.parent.opener.location.reload(true);// this is tried as well } Can some one please help. it always refreshes only B. Thanks 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. Hi , I need a javascript help for the following snippet of html code. The html displays Data in tabular format. There is drop-down at the 'Status" column of this table. If the status is chosen as 'all', then all the rows will be displayed having status ('CO','OK','IN' and '-'). But if the status is selected as 'valid', then the rows having '-' as status will be discarded and only rows having 'CO','OK,'IN' as status will be displayed. The following code is working except for a single row once I select 'valid' as Status from the drop-down. Please notice the cell under "Task" column having value 'checkRsf1' and its immediate right cell containing 'exec' under "Command" column is not coming at all after filtering by "valid". Instead the 'esdnet' and 'IN' (under Method and Status column) are getting shifted to left under wrong column head. Thanks in advance. Below is the html embedded with Javascript. <html> <head> <link rel="stylesheet" type="text/css" href="/css/tree.css" /> </head> <body style="background-color:#fff"> <table border="1" id="mytable"><tr style="background-color:#d0d0d0"> <th align="left">Task</th><th align="left">Command</th><th align="left">Method</th> <th align="left">Status<br><select onchange="showRows(this.value)"> <option value="all">show status</option> <option value="all">all</option> <option value="active">valid</option> </select> </th> <th align="left">Task version</th><th align="left">Tool</th><th align="left">Last changed</th><th align="left">Comments</th></tr> <tr><td rowspan="1">char32</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">H1p</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">H1c</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">adex</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">ds</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">mec</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">admsSim_post</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">Sim_pre</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap"><font color="red">CO</font></td><td nowrap="nowrap">CO</td><td nowrap="nowrap">CO</td><td nowrap="nowrap">Apr 24 </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">amsdSim_post</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap"><font color="red">OK</font></td><td nowrap="nowrap">CO</td><td nowrap="nowrap">CO</td><td nowrap="nowrap">Apr 21 </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">amsdSim_pre</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap"><font color="red">OK</font></td><td nowrap="nowrap">CO</td><td nowrap="nowrap">CO</td><td nowrap="nowrap">May 3 </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">antdrc</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap"><font color="red">CO</font></td><td nowrap="nowrap">CO</td><td nowrap="nowrap">CO</td><td nowrap="nowrap">Apr 24</td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">archive</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">avenue</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">cdl</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap"><font color="red">IN</font></td><td nowrap="nowrap">CO</td><td nowrap="nowrap">CO</td><td nowrap="nowrap">Apr 2</td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">cdl_pre</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap"><font color="red">CO</font></td><td nowrap="nowrap">CO</td><td nowrap="nowrap">CO</td><td nowrap="nowrap">Apr 8</td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="5">checkRsf</td><td rowspan="5">exec</td><td nowrap="nowrap">antdrc</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">drc</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">erc</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">esdnet</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">lvs</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="5">checkRsf1</td><td rowspan="5">exec</td><td nowrap="nowrap">antdrcres</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">drc</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">erc</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">esdnet</td><td nowrap="nowrap">IN</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">lvs</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="5">checkRsf2</td><td rowspan="5">exec</td><td nowrap="nowrap">antdrcres</td><td nowrap="nowrap">IN</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">drc</td><td nowrap="nowrap">IN</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">erc</td><td nowrap="nowrap">IN</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">esdnet</td><td nowrap="nowrap">IN</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">lvs</td><td nowrap="nowrap">IN</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="2"> designSync</td><td rowspan="2">exec</td><td nowrap="nowrap">dssc_layout</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td nowrap="nowrap">dssc_schematic</td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">diosearch</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap">-</td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td><td nowrap="nowrap"> </td></tr> <tr><td rowspan="1">drc</td><td rowspan="1">exec</td><td nowrap="nowrap"> </td><td nowrap="nowrap"><font color="red">IN</font></td><td nowrap="nowrap">CO</td><td nowrap="nowrap">CO</td><td nowrap="nowrap">Apr 3</td><td nowrap="nowrap"> </td></tr> </table> <script type="text/javascript"> mytab=document.getElementById("mytable") function showRows(val){ for (var i = 0; i < mytab.rows.length; i++) { if (val=="all"){ mytab.rows[i].style.display="table-row" } else { if (mytab.rows[i].innerHTML.match("-")){ mytab.rows[i].style.display="none" } } } } </script> </body> </html> Hi, I have an array for all the trousers on my site. It includes the image, name, waist, description, price and buy link. The javascript I use below outputs all products in the array. What I'd like to do is only output products which contain either "Wrangler" or "Levi" in the name string AND "forty" or "thirty" in the waist string. Would anyone know how to change the for loop in order to do this? Code: for(i=0;i<Trousers.length;i++){ $('body').append("<div><img src='"+Trousers[i].ProductImage+"'>"+"<br /><strong>"+Trousers[i].name+"</strong><br /><span style='color: #999; font-size:10px;'>"+Trousers[i].waist+"</span><br />"+Trousers[i].description+"<br /><strong>"+Trousers[i].price+"</strong><br /><a href='"+Trousers[i].buyLink+"'>Add to Basket</a></div>"); } Thanks in advance I created a method for displaying an object's properties: Code: renderfunction = false; function showProperty (object, property) { document.write ('<td class="type">' + (typeof object[property]) + '</td>' + '<td class="name">' + property + '</td>'); document.writeln('<td class="value">' + ( (typeof object[property] != 'function') ? object[property] :( (property != 'showProperties') ? ( renderfunction ? object[property]() : ('<span class="self">NOT RENDERED</span>') ) : ('<span class="self">THIS</span>') ) ) + '</td>'); document.writeln('<td class="hasOwnProperty" >' + ( object.hasOwnProperty(property) ? "Local" : "Inherited" ) + '</td>'); if (typeof object[property] == 'function') { document.writeln ('<td class="function">' + object[property] + '</td>'); } else { document.writeln ('<td class="function"> </td>'); } } As long as renderfunction = false, the object is fine coming out of this function. However, if I change renderfunction to true, all my properties become undefined. Why isn't this working as I expect it to? How should I fix it? Thanks in advance, -Brian. I can't get any info from Firebug except that one line, uncaught exception [object Object]. The code fully worked, then I needed to make it dynamically create Sortables from the scriptaculous library based on how many X were in a table in my database, which I've done, and I'm thinking it may be a simple slight parse error of some type, I'm not too good with Javascript, because now my script barely works. I've double checked the script's source code, the PHP variables are exactly what they should be. Code: print<<<HERE Sortable.create('sortlist$box', { tag: 'img', overlap:'horizontal',constraint:false, containment: $list, dropOnEmpty: true, onChange: function(item) { var list = Sortable.options(item).element; if(changeEffect) changeEffect.cancel(); changeEffect = new Effect.Highlight('changeNotification', {restoreColor:"transparent" }); }, onDrop: function(item) { var thing=Sortable.options(item).element.identify(); var anchors = document.getElementById(thing).childNodes.length-2; if(anchors > 20){ alert('This box had 20 creatures in it already, your last action has not been saved.'); window.location.reload(); } else{ new Ajax.Request("saveImageOrder.php", { method: "post", parameters: { data: Sortable.serialize("sortlist$box") } }); } } }); HERE; $box++; } ?> }); </script> if you solve this I'll send ya $10 via paypal Hi, I have a large e-commerce site that runs on a database. There are many products on the site which have 'variables' attached to them, e.g. colour, width, height etc. I have a script in place to sort the products depending on these variables. Apologies for the length of the code. Code: (function(i) {var u =navigator.userAgent;var e=/*@cc_on!@*/false; var st = setTimeout;if(/webkit/i.test(u)){st(function(){var dr=document.readyState; if(dr=="loaded"||dr=="complete"){i()}else{st(arguments.callee,10);}},10);} else if((/mozilla/i.test(u)&&!/(compati)/.test(u)) || (/opera/i.test(u))){ document.addEventListener("DOMContentLoaded",i,false); } else if(e){ ( function(){var t=document.createElement('doc:rdy');try{t.doScroll('left'); i();t=null;}catch(e){st(arguments.callee,0);}})();}})(sortinit); var prodlines = new Array(); // for Products var spanids = new Array(); var lastsorttype = 'default'; var bReadyToSort = false; var searchlines = new Array(); // for Search Results var searchspanids = new Array(); var searchlastsorttype = 'default'; var bSearchReadyToSort = false; var sectlines = new Array(); // for Sections var sectspanids = new Array(); var sectlastsorttype = 'default'; var bSectReadyToSort = false; var bSortInitalised = false; // Search Results Related function searchreseq(seqtype){ // resequence search results if ( ! (bSearchReadyToSort || bPageIsLoaded) ) { alert('Please wait until the page has fully loaded. (SRC)'); return false; } searchlines.length = 0; searchspanids.length = 0; var spans = document.getElementsByTagName('span'); for ( var i=0; i<spans.length; i++ ) { if ( spans[i].id.indexOf('searchsortline_') == 0 ) { searchspanids.push(spans[i]); searchlines.push({ id: spans[i].id, price: spans[i].getAttribute('price').replace(/[^\d\.]/g,''), seq: spans[i].getAttribute('seq'), pname: spans[i].getAttribute('pname'), phtml: spans[i].innerHTML }); } } if ( seqtype == 'lowhigh' ) searchlines.sort(function(a,b){return a.price - b.price}); if ( seqtype == 'highlow' ) searchlines.sort(function(a,b){return b.price - a.price}); if ( seqtype == 'default' ) searchlines.sort(function(a,b){return a.seq - b.seq}); if ( seqtype == 'alpha' ) searchlines.sort(function(a,b){return (a.pname <= b.pname) ? -1 : 1;}); if ( seqtype == 'reverse' ) searchlines.sort(function(a,b){return (b.pname <= a.pname) ? -1 : 1;}); searchlastsorttype = seqtype; setCookie('SEARCHSORTTYPE', searchlastsorttype); searchshowsorttype(); for ( var i=0; i<searchlines.length; i++ ) { searchspanids[i].innerHTML = searchlines[i].phtml; searchspanids[i].id = searchlines[i].id; searchspanids[i].setAttribute('price', searchlines[i].price); searchspanids[i].setAttribute('seq', searchlines[i].seq); searchspanids[i].setAttribute('pname', searchlines[i].pname); } return false; } function searchshowsorttype(){ // highlight the type of sort that's currently in use if ( document.getElementById('searchsortdropdown') ) // see if we're using drop-downs { var dropdowns = document.getElementsByTagName('select'); // all drop-downs for ( var i=0; i<dropdowns.length; i++ ) { if ( dropdowns[i].name == 'searchsortdropdown' ) // relevant one { var sdd = dropdowns[i]; for ( var j=0; j<sdd.options.length; j++ ) { if ( sdd.options[j].value == searchlastsorttype ) sdd.selectedIndex = j; } } } } else { var buttonlinks = document.getElementsByTagName('input'); // looking for buttons for ( var i=0; i<buttonlinks.length; i++ ) { if ( buttonlinks[i].name == 'searchsortlink' ) { buttonlinks[i].className = ( buttonlinks[i].id == searchlastsorttype ) ? 'searchsortactive' : 'searchsortinactive'; } } var buttonlinks = document.getElementsByTagName('a'); // looking for A tags for ( var i=0; i<buttonlinks.length; i++ ) { if ( buttonlinks[i].name == 'searchsortlink' ) { buttonlinks[i].className = ( buttonlinks[i].id == searchlastsorttype ) ? 'searchsortactive' : 'searchsortinactive'; } } } } // Section Related function sectionseq(seqtype){ // resequence Sections if ( ! (bSectReadyToSort || bPageIsLoaded) ) { alert('Please wait until the page has fully loaded. (SECT)'); return false; } sectlines.length = 0; sectspanids.length = 0; var spans = document.getElementsByTagName('span'); for ( var i=0; i<spans.length; i++ ) { if ( spans[i].id.indexOf('sectionline_') == 0 ) { sectspanids.push(spans[i]); sectlines.push({ id: spans[i].id, price: spans[i].getAttribute('price'), seq: spans[i].getAttribute('seq'), pname: spans[i].getAttribute('pname'), phtml: spans[i].innerHTML }); } } if ( seqtype == 'lowhigh' ) sectlines.sort(function(a,b){return a.price - b.price}); if ( seqtype == 'highlow' ) sectlines.sort(function(a,b){return b.price - a.price}); if ( seqtype == 'default' ) sectlines.sort(function(a,b){return a.seq - b.seq}); if ( seqtype == 'alpha' ) sectlines.sort(function(a,b){return (a.pname <= b.pname) ? -1 : 1;}); if ( seqtype == 'reverse' ) sectlines.sort(function(a,b){return (b.pname <= a.pname) ? -1 : 1;}); sectlastsorttype = seqtype; setCookie('SECTSORTTYPE', sectlastsorttype); sectshowsorttype(); for ( var i=0; i<sectlines.length; i++ ) { sectspanids[i].innerHTML = sectlines[i].phtml; sectspanids[i].id = sectlines[i].id; sectspanids[i].setAttribute('price', sectlines[i].price); sectspanids[i].setAttribute('seq', sectlines[i].seq); sectspanids[i].setAttribute('pname', sectlines[i].pname); } return false; } function sectshowsorttype(){ // highlight the type of sort that's currently in use if ( document.getElementById('sectionsortdropdown') ) // see if we're using drop-downs { var dropdowns = document.getElementsByTagName('select'); // all drop-downs for ( var i=0; i<dropdowns.length; i++ ) { if ( dropdowns[i].name == 'sectionsortdropdown' ) // relevant one { var sdd = dropdowns[i]; for ( var j=0; j<sdd.options.length; j++ ) { if ( sdd.options[j].value == sectlastsorttype ) sdd.selectedIndex = j; } } } } else { var buttonlinks = document.getElementsByTagName('input'); // looking for buttons for ( var i=0; i<buttonlinks.length; i++ ) { if ( buttonlinks[i].name == 'sectsortlink' ) { buttonlinks[i].className = ( buttonlinks[i].id == sectlastsorttype ) ? 'sectsortactive' : 'sectsortinactive'; } } var buttonlinks = document.getElementsByTagName('a'); // looking for A tags for ( var i=0; i<buttonlinks.length; i++ ) { if ( buttonlinks[i].name == 'sectsortlink' ) { buttonlinks[i].className = ( buttonlinks[i].id == sectlastsorttype ) ? 'sectsortactive' : 'sectsortinactive'; } } } } // Product Related function reseq(seqtype, gotoanchor){ // resequence products if ( ! (bReadyToSort || bPageIsLoaded) ) { alert('Please wait until the page has fully loaded. (PROD)'); return false; } prodlines.length = 0; spanids.length = 0; var spans = document.getElementsByTagName('span'); for ( var i=0; i<spans.length; i++ ) { if ( spans[i].id.indexOf('sortline_') == 0 ) { spanids.push(spans[i]); prodlines.push({ id: spans[i].id, price: spans[i].getAttribute('price'), seq: spans[i].getAttribute('seq'), pname: spans[i].getAttribute('pname'), brand: spans[i].getAttribute('brand'), capacity: spans[i].getAttribute('capacity'), height: spans[i].getAttribute('height'), width: spans[i].getAttribute('width'), depth: spans[i].getAttribute('depth'), colour: spans[i].getAttribute('colour'), energyrating: spans[i].getAttribute('energyrating'), spinspeed: spans[i].getAttribute('spinspeed'), phtml: spans[i].innerHTML }); } } if ( seqtype == 'lowhigh' ) prodlines.sort(function(a,b){return a.price - b.price}); if ( seqtype == 'highlow' ) prodlines.sort(function(a,b){return b.price - a.price}); if ( seqtype == 'default' ) prodlines.sort(function(a,b){return a.seq - b.seq}); if ( seqtype == 'alpha' ) prodlines.sort(function(a,b){return (a.pname <= b.pname) ? -1 : 1;}); if ( seqtype == 'reverse' ) prodlines.sort(function(a,b){return (b.pname <= a.pname) ? -1 : 1;}); if ( seqtype == 'brand' ) prodlines.sort(function(a,b){return (a.brand <= b.brand) ? -1 : 1;}); if ( seqtype == 'capacity' ) prodlines.sort(function(a,b){return (b.capacity <= a.capacity) ? -1 : 1;}); if ( seqtype == 'height' ) prodlines.sort(function(a,b){return (a.height <= b.height) ? -1 : 1;}); if ( seqtype == 'width' ) prodlines.sort(function(a,b){return (a.width <= b.width) ? -1 : 1;}); if ( seqtype == 'depth' ) prodlines.sort(function(a,b){return (a.depth <= b.depth) ? -1 : 1;}); if ( seqtype == 'colour' ) prodlines.sort(function(a,b){return (a.colour <= b.colour) ? -1 : 1;}); if ( seqtype == 'energyrating' ) prodlines.sort(function(a,b){return (a.energyrating <= b.energyrating) ? -1 : 1;}); if ( seqtype == 'spinspeed' ) prodlines.sort(function(a,b){return (b.spinspeed <= a.spinspeed) ? -1 : 1;}); lastsorttype = seqtype; setCookie('SORTTYPE', lastsorttype); showsorttype(); for ( var i=0; i<prodlines.length; i++ ) { spanids[i].innerHTML = prodlines[i].phtml; spanids[i].id = prodlines[i].id; spanids[i].setAttribute('price', prodlines[i].price); spanids[i].setAttribute('seq', prodlines[i].seq); spanids[i].setAttribute('pname', prodlines[i].pname); spanids[i].setAttribute('brand', prodlines[i].brand); spanids[i].setAttribute('capacity', prodlines[i].capacity); spanids[i].setAttribute('height', prodlines[i].height); spanids[i].setAttribute('width', prodlines[i].width); spanids[i].setAttribute('depth', prodlines[i].depth); spanids[i].setAttribute('colour', prodlines[i].colour); spanids[i].setAttribute('energyrating', prodlines[i].energyrating); spanids[i].setAttribute('spinspeed', prodlines[i].spinspeed); } if ( gotoanchor && location.hash ) scrolltoanchor(location.hash); // Product Page just loaded and Anchor so we need to reposition // // Some Drillpine add-ons need reactivated after the DOM has been fiddled with // // Tabber (needs V210 onwards) - reset Tabber if ( window.resetallpanes ) resetallpanes(); // Tabber V3 if ( window.jqinittabber ) jqinittabber(); // Lightbox / Slimbox if ( window.Slimbox && window.Slimbox.scanPage ) Slimbox.scanPage(); // Lightbox / Slimbox2 if ( (typeof(jQuery) == 'function') && (typeof(jQuery.slimbox) == 'function') ) { $("a[rel^='lightbox']").slimbox({/* Put custom options here */}, null, function(el) { return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel)); }); } return false; } function showsorttype(){ // highlight the type of sort that's currently in use if ( document.getElementById('sortdropdown') ) // see if we're using drop-downs { var dropdowns = document.getElementsByTagName('select'); // all drop-downs for ( var i=0; i<dropdowns.length; i++ ) { if ( dropdowns[i].name == 'sortdropdown' ) // relevant one { var sdd = dropdowns[i]; for ( var j=0; j<sdd.options.length; j++ ) { if ( sdd.options[j].value == lastsorttype ) sdd.selectedIndex = j; } } } } else { var buttonlinks = document.getElementsByTagName('input'); // looking for buttons for ( var i=0; i<buttonlinks.length; i++ ) { if ( buttonlinks[i].name == 'sortlink' ) { buttonlinks[i].className = ( buttonlinks[i].id == lastsorttype ) ? 'sortactive' : 'sortinactive'; } } var buttonlinks = document.getElementsByTagName('a'); // looking for A tags for ( var i=0; i<buttonlinks.length; i++ ) { if ( buttonlinks[i].name == 'sortlink' ) { buttonlinks[i].className = ( buttonlinks[i].id == lastsorttype ) ? 'sortactive' : 'sortinactive'; } } } } // General code function hidetagswithid(tag, id){ // hide all tags with ID var alltags = document.getElementsByTagName(tag); // all such tags for ( var i=0; i<alltags.length; i++ ) { if ( alltags[i].id == id ) // with ID { alltags[i].style.display = 'none'; // hide entire control alltags[i].style.visibility = 'hidden'; // hide entire control } } } function scrolltoanchor(anc){ // reposition to display anchor var ancs = document.getElementsByTagName('a'); anc = anc.replace(/.*\#/,''); // Search highlight passes duplicate anchors - lose one if ( ancs[anc] ) ancs[anc].scrollIntoView(true); } function sortinit(){ // called when DOM is loaded if (arguments.callee.done) return; arguments.callee.done = true; bSortInitialised = true; // Products if ( document.getElementById('sortwidget') ) { bReadyToSort = true; lastsorttype = getCookie('SORTTYPE'); if ( lastsorttype == null ) lastsorttype = 'default'; setCookie('SORTTYPE', lastsorttype); showsorttype(); if ( lastsorttype != 'default' ) { reseq(lastsorttype, true); } } // Search Results if ( document.getElementById('searchsortwidget') ) { bSearchReadyToSort = true; searchlastsorttype = getCookie('SEARCHSORTTYPE'); if ( searchlastsorttype == null ) searchlastsorttype = 'default'; setCookie('SEARCHSORTTYPE', searchlastsorttype); searchshowsorttype(); if ( searchlastsorttype != 'default' ) { searchreseq(searchlastsorttype); } } // Sections if ( document.getElementById('sectsortwidget') ) { // check for no prices available and hide buttons if so var spans = document.getElementsByTagName('span'); var rtot = 0; for ( var i=0; i<spans.length; i++ ) { if ( spans[i].id.indexOf('sectionline_') == 0 ) { var price = spans[i].getAttribute('price'); rtot += (price != null) ? price - 0 : 0; } } if ( rtot == 0 ) { if ( SectionSortLinksFinalOnly ) // do we only show links on final Sections { hidetagswithid('span', 'sectsortwidget'); // hide all sort widgets } else { if ( document.getElementById('sectpricelinks') ) // button or text links { hidetagswithid('span', 'sectpricelinks'); } if ( document.getElementById('sectionsortdropdown') ) // drop-down list { var dropdowns = document.getElementsByTagName('select'); // all drop-downs for ( var i=0; i<dropdowns.length; i++ ) { if ( dropdowns[i].id == 'sectionsortdropdown' ) // relevant one { var opts = dropdowns[i].options; for ( var j=opts.length; j>0; j-- ) // scan backwards as we're deleting items { if ( (opts[j - 1].value == "lowhigh") || (opts[j - 1].value == "highlow") ) { opts[j - 1] = null; } } } } } } } bSectReadyToSort = true; sectlastsorttype = getCookie('SECTSORTTYPE'); if ( sectlastsorttype == null ) sectlastsorttype = 'default'; setCookie('SECTSORTTYPE', sectlastsorttype); sectshowsorttype(); // only resequence if button showing and we've a non default sequence if ( (document.getElementById('sectsortwidget').style.display != 'none') && (sectlastsorttype != 'default') ) { sectionseq(sectlastsorttype); } } } function onloadsortinit(){ // optionally called on onload if ( ! bSortInitalised ) sortinit(); // only init if it's not already run } // in case we cannot activate on DOM loaded if (window.attachEvent) // IE { window.attachEvent("onload", onloadsortinit); } else // DOM { window.addEventListener("load", onloadsortinit, false); } I didn't write this script and I'm not a JavaScript expert, so i don't know how to edit it properly. I want to change it's function from sorting to filtering, i.e. something along the lines of a slice function. Any advice would be much appreciated. Hello together! I generate html code with jsp. In that jsp there a several framesets and frames. And yes i know, frames are not really up to date but it's an old program and i have to deal with it now. Anyway, in the top frameset i have an onload attribute like onload="load()". In the function load i want to access the Element.prototype object. But unfortunately typeof Element gives me "undefined". So i looked a little deeper and found that window.toString() gives me "[object]" and not as expected "[object window]" so somehow my window doesn't know that its construcor is Window. window.construcor is "undefined" as well. And i don't have access to the Element object. I really don't know where the error could be. When the page is loaded and i access the same window over the console, then everything is right. But in my function a can't get access to the objects i need. I also don't know what part of the code could be useful to post here, but maybe someone had a similar problem before? i should say that this problem only occurs in IE8. In IE9 it works perfectly. Has anyone any idea?? Ignore post (if mod, please delete)
Hi all, I'm stumped on finding a way in javascript to create an object factory whose instances are also object factories. In short I want something like that below, but no joy ... any clues? Code: function createClass () { return new createClass() function createClass() { return new createInstance () function createInstance () { //Default properties, values and methods which might later be extended } } } var createDoor = createClass(); var door1 = createDoor(); var door2 = createDoor(); var createChair = createClass(); var chair1 = createChair (); var chair2 = createChair (); I'm writing a program that involves a network of interconnected nodes (or simply objects in my example below). It depends on being able to access properties of an object's linked objects (a bit oddly worded, sorry)... Problem is I'm not sure how to properly access those properties... see below please. <script> //This is an example of a problem im having in my own code... //I want to access the name of the object within the links array wintin the object... var objA = {name: "Object A", links: [objB, objC]}; var objB = {name: "Object B", links: [objC, objD, objE]}; var objC = {name: "Object C", links: [objB]}; var objD = {name: "Object D", links: [objE]}; var objE = {name: "Object E", links: [objD]}; //ex: I want to access the name of Object A's first link... console.log(objA.links[0].name); </script> I'm hoping to get "Object B"... But instead I get: TypeError: Result of expression 'objA.links[0]' [undefined] is not an object. Is there another way around this? Any thoughts are appreciated. Hello. Is there any way to get the variable name of an object from inside the object? E.g. PHP Code: function Bla(){ this.write = function(){ document.write(<objectname>); } } obj1 = new Bla(); obj1.write(); //Outputs obj1 Here is my script: PHP Code: function myTimer(seconds, obj){ this.seconds = seconds; this.obj = obj; this.startTimer = function(){ if(this.seconds>0){ this.seconds--; this.obj.innerHTML = this.seconds; this.timer = setTimeout("Timer.start()",1000); } } } Timer = new Timer(10, obj); Timer.startTimer(); Now the problem is that the variable that contains the object must be named "Timer". This way I cannot create new timer objects with different variable names I have tried: this.timer = setTimeout("this.start()",1000); but it doesn't work. That's why it would be good to detect the variable name and instead use something like this: this.timer = setTimeout(varname+".start()",1000); I would rather not have to pass the variable name through a parameter like this: Timer1 = new Timer(10, obj, "Timer1"); Thanks in advance. Quote: menu: function( a, b ) { $( b ).observe( 'click', function( event ) { event.stop(); if( $( a ).visible() ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); } else { $( a ).show(); $( b ).addClassName( 'selected' ); document.observe( 'click', function( e ) { if( e.target.id != a && e.target.id != b && !Element.descendantOf( e.target, $( a ) ) ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); } }); } }); $$( '#' + b + ' > a' ).each( function( element ) { element.observe( 'click', function( event ) { $( a ).hide(); $( b ).removeClassName( 'selected' ); document.stopObserving( 'click' ); }); }); } This work's perfrect accept when i use it with others on the menu it leaves the other ones open, how do i get it to close the open one when i open a new menu.. Thanks. I am trying to troubleshoot my javascript function below. Code: <script type="text/javascript"> function txtboxfill(fillobj) { var rChar=String.fromCharCode(13); var myVal = "To: " + this.form.to.value + rChar; myVal = myVal + "From: " + this.form.from.value + rChar; myVal = myVal + "Subj: " + this.form.subj.value + rChar + rChar; myVal = myVal + "Message: "; fillobj.value = myVal; } </script> Then I have a text box input field with an Code: <input type="text" id="tp" name="to" size="34" class="totext" onkeyup="txtboxfill(this.form.msg_area);"> and when I enter text in this field it gives me a 'this.form.to' is null or not an object and does not populate the textarea. BTW, msg_area is the id of my textarea. Thank you. Dear Great Coders, I am having some trouble to get the id of the parent of a document which is iframe1 here. As you can see it the <javascript> is residing in the javascript section. Do mind giving me some ideas? Yes, I know. I can insert the javascript on the top, but believe me i cant for some purpose because I am intergrating many other codes into it. <html> <iframe id="iframe1"> <html> <head> <javascript> </head> <body> </body> </html> </iframe> </html> |