JavaScript - Select All Checkbox Script Working On One Page But Not Another?
Hi all,
I have a script that checks and unchecks all boxes depending on the current state of the box. I have used it on one page and it works perfectly fine... copied it over to a new page where I wanted to reuse and can't get it to work. Code: <script type="text/javascript"> function check_all(form, input_name, self){ if(!input_name){ return; } var input = form.getElementsByTagName('input'); for(var i = 0; i < input.length; i++){ if(input[i].name.indexOf(input_name)!=-1){ input[i].checked = self.checked; } } } </script> Code: <input type="checkbox" name="notimportant" onclick="check_all(document.form1, 'check', this)" value="test" /><b>All</b> Code: <input type="checkbox" name="check_list[]" value="<?php echo $row2['email'];?>"> Code: <form name="form1" action="emailspecificcandidates.php" method="post"> As I say this script works perfectly on another page, and as far as i can see i have copied everything over correctly. Can anyone spot anything wrong? Many thanks, Greens85 EDIT: I think this may be broken because of the way I presenting it with php on my page... i copied a seperate entity of the script onto the page and it worked first time. Similar TutorialsHey: I have two javascripts on my page but one isn't showing with both codes in page. [CODE]<script type="text/javascript" src="js/image-slideshow.js"></script>[ICODE] The above code is for the image slide. When this is in the html the other one doesn't work (a text changer). The wbesite is http://www.uwics.com/constitution.htm There is no text at the top of the page currently. If you check Home you'll see how it should be. Any help would be greatly appreciated. Thank you, Mitka Hi, I'm trying to build up a multi-select filter with checkboxes. I found few good scripts but I've got a problem to adapt them.. The script below can filter results based on criteria (that you can select via checkboxes). The results displayed are checked or unchecked boxes. What I want is : display results with div (for ex:<div>result1</div>) and not checkbox. How can I do that? Code: <script type="text/javascript" src="js/jquery.js.css"></script> <script type="text/javascript"> $(function() { $('#search input:checkbox').click(function() { var classes = $('#search input:checkbox:checked'). map(function() { return $(this).val(); }).get().join('.'); classes = (classes ? '.' : '') + classes; $('#results input:checkbox').attr('checked', false). filter(classes).attr('checked', true); }); }); </script> </head> <body> <div id="search"> <fieldset> <label><input type="checkbox" value="animal"> Animal</label> <label><input type="checkbox" value="vegetable"> Vegetable</label> </fieldset> <fieldset> <label><input type="checkbox" value="small"> Small</label> <label><input type="checkbox" value="large"> Large</label> </fieldset> </div> <div id="results"> <p><input type="checkbox" class="small animal"> Cat</p> <p><input type="checkbox" class="medium animal"> Tiger</p> <p><input type="checkbox" class="large animal"> Elephant</p> <p><input type="checkbox" class="small vegetable"> Pea</p> <p><input type="checkbox" class="large vegetable"> Pumpkin</p> </div> </ul> </body> </html> Thanks for your help I am finishing up my Form page, and totally forgot to have a numeric only field. So I added it and I can't get it to work. I also am having issues throwing an error when you don't select at least one topping. And are these lines correct? Code: document.cookie = "toppings=" + encodeURIComponent(document.getElementsByName("toppings[]").value); Code: document.cookie = "extra=" + encodeURIComponent(extra); Here is a link to the page hosted on my dropbox http://dl.dropbox.com/u/49211616/dw/...orderPage.html Javascript: Code: function validateOrder () { var crustSelection = document.orderForm.crust.value; var crustPrice; //Adds $1 for Deep DishParmesagn, and Sourdough var count = 0; //Amount of Toppings Selected var choice = ""; //Toppings Selected list var x = ""; //Don't need for the Cookie var extra = 0; //extra charge for toppings over 3 try{ var error = ""; // Initialize Var to store the error messages. if(document.getElementById("delivery").checked != true && document.getElementById("takeout").checked != true) { error=error+"Order Type is required.\n" } if(document.getElementById("fname").value == "") { error = error + "First Name is required.\n"; } if(document.getElementById("lname").value == "") { error = error + "Last Name is required.\n"; } if(document.getElementById("address").value == "") { error = error + "Street address is required.\n"; } if (isNaN(document.getElementById("quantity"))) { error = error + "Enter Pizza Quantity in Numbers Only.\n"; } if(document.getElementById("crust").value == "") { error = error + "Crust Type is required.\n"; } if(document.getElementsByName("toppings").value == 0) { error = error + "Select at Least One Topping.\n"; } if(error == "") { // save all the information in the cookie document.cookie = "firstName=" + encodeURIComponent(document.getElementById("fname").value); document.cookie = "lastName=" + encodeURIComponent(document.getElementById("lname").value); document.cookie = "address=" + encodeURIComponent(document.getElementById("address").value); document.cookie = "order=" + encodeURIComponent((document.getElementById("delivery").checked) ? "delivery" : "takeout"); document.cookie = "quantity=" + encodeURIComponent(document.getElementById("quantity").value); document.cookie = "quantity=" + encodeURIComponent(document.getElementById("quantity").value); document.cookie = "crust=" + encodeURIComponent(document.getElementById("crust").value); document.cookie = "toppings=" + encodeURIComponent(document.getElementsByName("toppings[]").value); alert("Order successfully Placed!"); } else { alert(error); } } catch(ex) { alert("An error occurred!.\n" + "Error Name : " + ex.name + "\nError Message : " + ex.message); } for (var i=1; i<11; i++) { x = document.orderForm['toppings' + i].value; if (document.orderForm['toppings' + i].checked) { choice = choice + " " + x ; count ++; } } if (choice.length <= 0) { choice = choice + "NONE"; } if (count > 3) { extra = (count - 3) * 1 } document.cookie = "extra=" + encodeURIComponent(extra); } </script> HTML: Code: <form name = "orderForm" onsubmit="validateOrder()"> <table width="600" border="0"> <tr> <th scope="col" width="400" align="left"><b>First Name</b><br /><input type="text" id="fname" name="fname" size=30> <br /> <br /> <b>Last Name</b><br /> <input type="text" id="lname" name="lname" size=30> <br /> <br /> <b>Street Address</b><br /> <input type="text" id="address" name="address" size=30> <br /> <br /> <input name="orderType" value="delivery" id="delivery" type="radio">Delivery</font> <input name="orderType" value="takeOut" id="takeout" type="radio">Take Out</font></th> <th scope="col" width="200" align="Left"> How Many Pizzas? <input type="text" id="quantity" name="quantity" size=5> <br /> <br /> <select name="crust" id="crust"> <option selected value="false">Select Crust Type</option> <option value="regular">Regular Crust</option> <option value="thin">Thin Crust</option> <option value="deep">Deep Dish</option> <option value="Parmesagn">Parmesagn Cheese</option> <option value="sourdough">Sourdough</option> </select> <br /> <br /> Select at Least One Topping: <br /> <br /> <input name = "toppings1" type = "checkbox" value = "extraCheese"> Extra Cheese<br> <input name = "toppings2" type = "checkbox" value = "sausage"> Sausage<br> <input name = "toppings3" type = "checkbox" value = "pepperoni"> Pepperoni<br> <input name = "toppings4" type = "checkbox" value = "bacon"> Bacon<br> <input name = "toppings5" type = "checkbox" value = "canadianBacon"> Canadian Bacon<br> <input name = "toppings6" type = "checkbox" value = "mushroom"> Mushroom<br> <input name = "toppings7" type = "checkbox" value = "pineapple"> Pineapple<br> <input name = "toppings8" type = "checkbox" value = "onion"> Onion<br> <input name = "toppings9" type = "checkbox" value = "olive"> Olive<br> <input name = "toppings10" type = "checkbox" value = "greenPepper"> Green Pepper<br></th> </tr> </table> <input name="submit" type="submit" value="submit" /><input name="" type="reset" /> </form> I am trying to make a checkbox on the screen so that when I check or uncheck it a word will print on the screen. Unfortunately it is not working. The checkbox shows up but nothing happens when I check/uncheck it. Also, even though that part of the code isn't working everything that comes after it that is suppose to print onto the screen is also not printing. I am assuming it is because there is an error and cannot reach that part of the code. I am used to programming in Java and using eclipse which has a debugger in it and was wondering if there is a nice editor/debugger like eclipse I can use for JavaScript. Thanks. Code: <html> <title>Welcome :D</title> <head> <style type="text/css"> body { background-color:F0F0F0; } </style> </head> <body> CheckBox1 <input type="checkbox" id="tandc" onClick="validate()" /> <script type="text/javascript"> fuction validate(){ if(cb1.onClick){ document.write("Print something"); }else{ document.write("Now print something?"); } } document.write("</br></br></br></br>"); document.write("Hello, thank you for visiting my webpage I hope you like it."); </script> </body> </html> hi i have 4 check boxes chk1 , chk2,chk3,chk4 also textbox1 , textbox2 textbox3 textbox4 when selecting one chk box (chk1) textbox1=45 textbox44=45 when chk1 checked if textbox2=56 textbox45=56 when chk2 checked plz give me code sample for me plzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz give me a answer For the sample code: Code: <form name=form> <ul> <li><input type="text" onkeyUp="calc1();" name=x ></li> <li><input type="text" onkeyUp="calc2();" name=y ></li> </ul> </form> <script> function calc1() { document.form.y.value = (10 * document.form.x.value).toPrecision(5); } function calc2() { document.form.x.value = (0.1 * document.form.y.value).toPrecision(5); } </script> How can I use a checkbox to : (1) Upon check, change the current values to toExponential(5) format (2) Use a different script and/or function that would then calculate with toExponential(5) [as opposed to the hard coded toPrecision(5) in the current functions. (3) Upon unchecking, the result should should go back to Precision and change the function and/or script back to the original. Guys Need Help here... here i send attach my script. i need combine 2 function script into . but i can figure it out. can everyone helps me. Code: <?php require_once('../Connections/koneksi.php'); ?> <!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> <script> function addRow(tableID) { var table = document.getElementById(tableID); var rowCount = table.rows.length; var row = table.insertRow(rowCount); var colCount = table.rows[0].cells.length; for(var i=0; i<colCount; i++) { var newcell = row.insertCell(i); newcell.innerHTML = table.rows[0].cells[i].innerHTML; switch(newcell.childNodes[0].type) { case "text": newcell.childNodes[0].value = ""; break; case "checkbox": newcell.childNodes[0].checked = false; break; case "select-one": newcell.childNodes[0].selectedIndex = 0; break; } } } function deleteRow(tableID) { try { var table = document.getElementById(tableID); var rowCount = table.rows.length; for(var i=0; i<rowCount; i++) { var row = table.rows[i]; var chkbox = row.cells[0].childNodes[0]; if(null != chkbox && true == chkbox.checked) { if(rowCount <= 1) { alert("Cant delete all rows"); break; } table.deleteRow(i); rowCount--; i--; } } }catch(e) { alert(e); } } function selectnama() { var i = 0; i = document.form1.txtcustomer.value; i= i.replace(/^[\s]+/,'').replace(/[\s]+$/,'').replace(/[\s]{2,}/,' '); //alert(cust[i]); document.form1.select2.value = i; } function change2() { document.form1.txtcustomer.value = document.form1.select2.value; } function enable_text(status) { status=!status; document.form1.qty_material.disabled = status; } </script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Untitled Document</title> </head> <body> <form name="form1" method="post" > <table id="dataTable" width="auto" style="margin:-4px 0 0 0;" cellspacing="6"> <tr> <td style="width:20px;"><INPUT type="checkbox" name="chk" /></td> <td> <input type="text" name="txttipe[]" placeholder="Tipe" id="txttipe" size="40"/> / <input name="txtcustomer" type="text" id="txtcustomer" onkeyup="selectnama()" size="10" maxlength="10"/> <select name="select2" style="color:blue;" onchange="change2()" > <option></option> <?php $query = mysql_query("select right(KUNNR,6), NAME1 from kna1 order by NAME1") or die(mysql_error()); $query3 = mysql_query("select * from spg_kna1_exception order by NAME1") or die(mysql_error()); while($row = mysql_fetch_array($query)) { echo "<option value=".$row[0].">$row[1] - $row[0]</option>"; } while($row3 = mysql_fetch_array($query3)) { echo "<option value=".$row3[0].">$row3[1] - $row3[0]</option>"; } ?> </select>; <input type="checkbox" name="qty_matnr" onClick="enable_text(this.checked)" > Qty <input type="text" name="qty_material"> </td> </tr> </table> <INPUT type="button" value="Add Model" onclick="addRow('dataTable')" /> <INPUT type="button" value="Delete Model" onclick="deleteRow('dataTable')" /> </form> </body> </html> Hi Folks, I'm trying to figure out a script to transfer selected checkbox information to another page. I'm making a needs list for a non-profit group and the list is "huge" so I thought it would be nice to have something where the viewer could have a list of the items they checked to donate instead of printing out or transmitting the six pages for the entire list. I found a script in the archives from 10/2002 that "Adios" wrote in reply to an inquiry. It is real close to what I want but it involves transfering graphics instead of the text information from the checkbox. I've been working on it for several days but cannot get it to work. Here's Adios' script: <html> <head> <title>untitled</title> <script type="text/javascript" language="javascript"> var lefty = righty = null; function pop_twins() { lefty = open('lefty.htm','lefty','left=0,top=0,width='+screen.availWidth/2+',height='+screen.availHeight+',status=0'); righty = open('righty.htm','righty','left='+screen.availWidth/2+',top=0,width='+screen.availWidth/2+',height='+screen.availHeight+',status=0'); lefty.focus(); righty.focus(); } </script> </head> <body> <a href="javascript:void pop_twins()">pop 'em</a> </body> </html> [lefty.htm] <html> <head> <title>The Source</title> <base href="http://aabode.com/victoria/images/"> <script type="text/javascript" language="javascript"> var path = 'http://aabode.com/victoria/images/'; function addIMG() { var HTML = '', img, box_arr = document.addform.ImgAdd, which = 0; HTML += '<html><head><title>The Destination</title></head><body>'; HTML += '<h1>&#149; The Destination &#149;</h1>'; while (box = box_arr[which++]) if (box.checked) HTML += '<img vspace="5" border="1" src="' + path + box.value + '"><br>'; HTML += '</body></html>'; if (opener.righty) { opener.righty.document.write(HTML); opener.righty.document.close(); } } </script> </head> <body> <h1>&#149; The Source &#149;</h1> <form name="addform"> <input type="checkbox" name="ImgAdd" value="apple.jpg" onclick="addIMG()"> <img align="middle" vspace="5" border="1" src="apple.jpg"><br> <input type="checkbox" name="ImgAdd" value="strawberry.jpg" onclick="addIMG()"> <img align="middle" vspace="5" border="1" src="strawberry.jpg"><br> <input type="checkbox" name="ImgAdd" value="pumpkin.jpg" onclick="addIMG()"> <img align="middle" vspace="5" border="1" src="pumpkin.jpg"><br> <input type="checkbox" name="ImgAdd" value="lettuce.jpg" onclick="addIMG()"> <img align="middle" vspace="5" border="1" src="lettuce.jpg"><br> <input type="checkbox" name="ImgAdd" value="raspberries.jpg" onclick="addIMG()"> <img align="middle" vspace="5" border="1" src="raspberries.jpg"><br> <input type="checkbox" name="ImgAdd" value="tomatoes.jpg" onclick="addIMG()"> <img align="middle" vspace="5" border="1" src="tomatoes.jpg"> </form> </body> </html> [righty.htm] <html> <head> <title>The Destination</title> <body> <h1>&#149; The Destination &#149;</h1> </body> </html> I would like to also include a print function and submit. The print feature is not a big issue as the viewer can print from the browser but I thought it would make the transferred information page a bit more snazzy and they will have a record of thier selections. On the submit I don't have a URL setup yet but if you could put something like "URL HERE" in the script placement I can change it when they get up and going. Thanks in advance for your help, and thanks for taking the time to read all this. Firstly, I'm a complete Javascript noob, so apologies if this is blindingly simple. I'm trying to write a piece of javascript that will check a single checkbox depending on a dynamically-imported piece of information further up the page. The page will look like this: Code: <div id="title"> <p class="white">1</p> </div> <div id="question"> <p>Please indicate your area(s) of interest below:<br /> <input type=checkbox value="1" /> Option 1<br /> <input type=checkbox value="2" /> Option 2<br /> <input type=checkbox value="3" /> Option 3<br /> <input type=checkbox value="4" /> Option 4</p> </div> The variable which indicates which checkbox should already be checked is in the div 'title' in the p class 'white'. So in the case above, when the page loads the 'Option 1' checkbox should already be checked. The javascript i have, rather poorly, cobbled together so far just doesn't work, and I was wondering if anyone could point me in the direction of some useful tutorials. All the tutorials I have read so far deal with mass checking all the boxes with a button click. Hi guys, I have the following code that should hide the dropdown part of a select box when clicked (don't ask why, this is part of a separate project). Please see a simple example below: Code: <script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.js"></script> <select name="select1" id="select1" onfocus="$(this).blur();"> <option value=""></option> <option value="">1</option> <option value="">2</option> <option value="">3</option> <option value="">4</option> </select> This all works fine in IE and FF but in chrome the options are still shown after clicking the element. I've been racking my brains for hours on this and, no matter what method I use, I can't get this to work correctly in Chrome. Can anyone suggest a way I can get this to work? Thanks in advance! I have a dropdown menu. the code is as below: <html:select name="data1" property="accountNumber" styleClass="formContent" > <option>Id1 </option> <option>Id2 </option> I need to give user an option to select from the list or enter a new value. how do you do this ? I can add another option say "new value" and when he choose this user should be able to add the new value/ please help !! I'm new to java script. Greetings, I recently learned that the <option> tags can not use the onclick attribute inside of IE. This works great for firefox, but sadly not a single version of internet explorer supports it (from what I am told via countless Google searches). I have been modifying my attempit at a solution to use the <select> tag with the attribute onchange. Maybe I am casing this wrong, or not seeing a solution as the below code does not operate in any browser, and no errors are reported back through firebug or IE. Excuse my sloopy attempt at {smarty tags} this script is written in a bunch of PHP object->vales and to save space cored the issue down to it's basics. On change of the select box, the value="5-28" is sent to javascript showBox to split the number away from the id_trips and only focus on the locations (the number before the '-' . IF the location matches the switch value then the box should show / hide or value change. The IDs are all correct I just think that there is a ' or a " or something off as I am not a javascript expert. my SQL return values <code class="php"> //PHP VARIABLES from QUERY sample loop 1 trip-number = 200 locations = 5 id_trips = 28 </code> my HTML form loop <code class="html"> {BEGIN LOOP 'trips'} <!--HTML form for {trip-number} --> <form id="trip{trip-number}" method="post" action="#"> <select id="depid{trip-number}" name="depId" class="inputed greybig required" onchange="showBox(this.value, '{trip-number}', 'dep');"> <option value="">Select Time</option> <option value="{locations}|{id_trip}">{trip-time}</option> </select> </form> <!--/HTML form for {trip-number} --> {/END LOOP 'trips'} </code> my javascript at the bottom of the page before the </body> <code class="javascript"> <!-- JAVASCRIPT AT END OF PAGE BEFORE CLOSING </body> I am using the jQuery Tools latest build 1.4.2 pull value, split and process for hide / show options --> <script type="text/javascript"> function showBox(val, trip, arrdep){ var splitVal = val.split("-"); switch (splitVal[0]){ case 1: //Airport $("#"+arrdep+"dep_win_airport"+trip).show(); case 2: //Port of Miami $("#"+arrdep+"_win_cruse"+trip).show(); case 4: //Port Canaveral $("#"+arrdep+"_win_cruse"+trip).show(); case 5: //door drop off $("#"+arrdep+"_win_door"+trip).show(); case 6: //Door Pick Up case 7://Airport NO FLIGHT default: $("#"+arrdep+"_window"+trip).hide(); $("#"+arrdep+"_info_"+trip).hide(); $("#"+arrdep+"_win_door"+trip).hide(); $("#"+arrdep+"_win_cruse"+trip).hide(); $("#"+arrdep+"_win_airport"+trip).hide(); $("#"+arrdep+"info_"+trip).val("Supply Address"); }; //end switch splitVal }; //end function showBox </script> </code> the script below should open a new window with a url specified in the select area. However, my script ignores the changes in the select area. it keeps opening the same page. I was wondering could someone take a look and tell me why? Thank you very much. <code> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title> Jump Menu</title> <meta http-equiv="content-type" content="text/html;charset=UTF-8" /> <script type="text/javascript"> function jump_menu() { var i=document.getElementById("page_select").selectedIndex; document.getElementById("jump_to_page").onclick=function() { (i==0) ? alert("Please select a page to go"):window.open("http://www."+document.getElementById("page_select").options[i].value); } } window.onload=jump_menu; </script> </head> <body> <select id="page_select"> <option>Select a Page</option> <option value="yahoo.ca">Yahoo</option> <option value="topnews.ru">Top News</option> <option value="google.com">Google</option> <option value="amazon.com">Amazon</option> </select> <button type="button" id="jump_to_page">Go</button> </body> </html> </code> Hi all, firstly i'm not a coder but i am capable of doing as instructed. I have some script that when used in conjunction with a button highlights all the text between 2 tags to make it easier for copying, it works great in IE but doesn't work in firefox, could someone help please? Here's the script and the button is below. Code: <script type="text/javascript"> function selectCode(a) { // Get ID of code block var e = a.parentNode.parentNode.getElementsByTagName('CODE')[0]; // Not IE if (window.getSelection) { var s = window.getSelection(); // Safari if (s.setBaseAndExtent) { s.setBaseAndExtent(e, 0, e, e.innerText.length - 1); } // Firefox and Opera else { var r = document.createRange(); r.selectNodeContents(e); s.removeAllRanges(); s.addRange(r); } } // Some older browsers else if (document.getSelection) { var s = document.getSelection(); var r = document.createRange(); r.selectNodeContents(e); s.removeAllRanges(); s.addRange(r); } // IE else if (document.selection) { var r = document.body.createTextRange(); r.moveToElementText(e); r.select(); } } </script> Html button Code: <input type="button" value="Highlight Code" onclick="selectCode(this); return false;"> Hey guys..... I've built a tool where users can search for something & the results show up in a select list as selectable options..... sometimes the results can take a few seconds to load depending on how many results there are... so I was attempting to show some "Results are loading" text when they search, & then hide it when they are displayed. However for some reason it's not working correctly...... both commands don't appear to work until the select list options have loaded & hence rendering them redundant.... I have tried putting them inside separate functions but no change in the behavior. What basically happens is I press the button to search & it searches & once the results show up so does the loading text.... however if I include the hide text command then the text doesn't show at all as it's hidden as soon as it's shown. Here is the code I am using.. PHP Code: function searchCats(text) { // Set URL for ajax request var url = 'search_cats.php?search_text='+text; // Set up element we're modifying var results = document.getElementById('cat_list'); // Trim string text.replace(/^ss*/, '').replace(/ss*$/, ''); if (text.length < 3) { alert('Please enter a search string more than 2 characters.'); return; } // Send the request, giving it an anonymous function that acts as the oncomplete event ajaxRequest(url, (function(ajaxResponse) { /* Deal with results */ // First we remove all current childs while(results.hasChildNodes()) { while (results.childNodes.length >= 1) { results.removeChild(results.firstChild); } } if (ajaxResponse == '') { // Display no results text document.getElementById('no_results').style.display='block'; } else { // Hide no results text document.getElementById('no_results').style.display='none'; // Display loading text document.getElementById('loading_results').style.display='block'; // Check for occurence of cat seperator (if not there then we know we only have one results) var sep_found = ajaxResponse.indexOf('!@!'); if (sep_found === -1) { // One result only // Seperate ID & cat name var parts = ajaxResponse.split('^@^'); // Create option element var option = document.createElement('option'); // Add attribute option.setAttribute('value', parts[0]); // Create text node var textNode = document.createTextNode(parts[1]); // Append text node to option element option.appendChild(textNode); // Now append option element to select list results.appendChild(option); } else { // Seperate cat data var cats = ajaxResponse.split('!@!'); // Loop through cat data for(i = 0; i < cats.length; i++) { // Seperate ID & cat name var parts = cats[i].split('^@^'); // Create option element var option = document.createElement('option'); // Add attribute option.setAttribute('value', parts[0]); // Create text node var textNode = document.createTextNode(parts[1]); // Append text node to option element option.appendChild(textNode); // Now append option element to select list results.appendChild(option); } } } })); // Hide loading text document.getElementById('loading_results').style.display='none'; } Thanks guys! Hi All, I have a javascript function which adds a label and value to a select widget in its parent window. The function is working fine in firefox and chrome without any errors or warnings. But it is not working in internet explorer. Please tell me what the issue is. Thanks in advance for your help. Code: function addToParent( formName, selectName, name, label ) { var parent = window.opener; var selectWidget = parent.document.forms[formName].elements[selectName]; if( selectWidget ) { var length = selectWidget.length; selectWidget[length] = new Option( name, label, false, false ); } } When I tried to debug, internet explorer shows an error in the following line Code: selectWidget[length] = new Option( name, label, false, false ); Is there anything wrong with this statement ?? I have a website www.foodfinda.com and on a specific page http://www.foodfinda.com/recipecatinfo.php?id=Beef I have the following code <tr> <? ?> <td width="20%" align="center">Select a Page </td> <td width="24%" align="left"> <?if($page > 1){ $prev = ($page - 1); echo "<a href=\"".$_SERVER['PHP_SELF']."?page=$prev&search=$_GET[search]\"><<Previous</a> "; } for($i = 1; $i <= $total_pages; $i++){ if($i%20==0){ echo "<br>"; } if(($page) == $i){ echo "$i "; } else { echo "<a href=\"".$_SERVER['PHP_SELF']."?page=$i&search=$_GET[search]\">$i</a> "; } } // Build Next Link if($page < $total_pages){ $next = ($page + 1); echo "<a href=\"".$_SERVER['PHP_SELF']."?page=$next&search=$_GET[search]\">Next>></a>"; } ?> </td> This should allow me to dispaly 20 recipes and also to display additional pages for all the other recipies, but it doesn't seem to work. Can anyone shed any light on what I am doing wrong? Thanks ok i have auto complete that i want to be able to select a column of the database before searching on it i just want to pass the oneone variable over to the php page. so i have this javascript Code: <script type="text/javascript"> $().ready(function() { function log(event, data, formatted) { $("<li>").html( !data ? "No match!" : "Selected: " + formatted).appendTo("#result"); } $("#search").autocomplete("test.php", { width: 260, selectFirst: false }); $("#search").result(function(event, data, formatted) { if (data) $(this).parent().next().find("input").val(data[1]); }); $(":text, textarea").result(log).next().click(function() { $(this).prev().search(); // shows resluts }); }); </script> the html Code: <p class="field" > <select id="oneone" name="oneone" style="width:100px;margin:5px 0 5px 0;" value=""> <option value="s_last">Last Name</option> <option value="s_first">First Name</option> <label>Search</label> <input type="text" id="search" /> </p> <p> <label>Hidden input</label> <input type="text" id="inputit" /> is it possible to refresh a select list on it's own without refreshing the whole page?
I have a multiple fields on my page and wish to have a reusable javascript to update the previous box with the selction made. how would this be done Code: <form name="form1" method="post" action=""> <p> <input type="textone" name="textfieldone" id="textfieldone"> </p> <p> <select name="selectone" onChange="UpdatePreviousField()"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> <input type="texttwo" name="textfieldtwo" id="textfieldtwo"> </p> <p> <select name="selecttwo" onChange="UpdatePreviousField()"> <option value="1">1</option> <option value="2">2</option> <option value="3">3</option> </select> </p> <p> </p> </form> |