JavaScript - Some Selected Buttons Should Go Back Being Unselected
Please follow these steps in my jsfiddle:
1. click on the (open grid) link and select option "13", buttons A to N would appear 2. click on the select all answers button, all buttons A to N would turn green. 3. Now click on the open grid again and select option "5". As you can see all the buttons from A to 5 are now selected (Have all turned green). 4. Now go back to grid and choose option 13. As you can see all buttons A to N would be selected. I don't want this to happen. What should happen is that the 5 buttons selected before the option change should remain selected and the other 8 buttons should go back being unselected, but I do not know how to do this. I tried including this in the selectAll() function but it did not work: Code: $('.answerBtns:hidden').removeClass('answerBtnsOn').addClass('answerBtnsOff'); Does anyone have any ideas? Code is in jsfiddle, click [here][1] Thank You [1]: http://jsfiddle.net/C7vcQ/5/ Similar TutorialsHello kind folk of codingforums.com! I am pretty new to JS and have been racking my brain all week to find a solution for this. I have a javascript fading slideshow but it has no back or next button. I'm not sure if i need to add another function or go about it a different way. Here is the code if anyone can help. Thanks in advance!!! <script type="text/javascript"> var slidespeed=5800 var slideimages=new Array("my_images/SBDCslide.gif","my_images/americanbuilding.gif","my_images/emerald.gif", "my_images/nautical.gif", "my_images/rent.gif","my_images/allyn.gif","my_images/SBDCslide.gif","my_images/signs.gif","my_images/cobalt.gif","my_images/test.gif","my_images/federal.gif") var slidelinks=new Array("#" ,"american.asp","emerald.asp","nautical.asp") var whichlink=0 var whichimage=0 var imgobj, filtersupport, blenddelay var imageholder=new Array() for (i=0;i<slideimages.length;i++){ //preload images imageholder[i]=new Image() imageholder[i].src=slideimages[i] } function gotoshow(){ window.location=slidelinks[whichlink] } function slideit(){ if (filtersupport) imgobj.filters[0].apply() imgobj.src=imageholder[whichimage].src if (filtersupport) imgobj.filters[0].play() whichlink=whichimage whichimage=(whichimage<slideimages.length-1)? whichimage+1 : 0 setTimeout("slideit()", slidespeed+blenddelay) } window.onload=function(){ imgobj=document.getElementById("slideshow") //access img obj filtersupport=imgobj.filters //check for support for filters blenddelay=(filtersupport)? imgobj.filters[0].duration*1000 : 0 slideit() } </script> Hello everyone, I am totally new to javascript, I have a web form I designed using coffeecup, the form is very long about 4 pages long and it is all in one long scroll down the page, I was wondering if I can add page breaks and at the bottom of each categoty inserting a button for next and back whilst hiding the rest of the categories until next is clicked etc. until you reach submit. Please help in anyway you can?\ Yhanks K Hey everyone, I cant seem to get this submitForm Validator to work. It needs to see if one of the two radio buttons are selected. I just cant seem to get it to work, anyone know whats wrong? Thanks. 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>Concert</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <script type="text/javascript"> /* <![CDATA[ */ function setFormFocus() { document.forms[0].visitor_name.focus(); } function validateIt() { if(document.forms[0].visitor_name.value == "" || document.forms[0].phone.value =="" || document.forms[0].email.value =="" || document.forms[0].area.value =="" || document.forms[0].feet.value =="" || document.forms[0].bedrooms.value =="" || document.forms[0].price.value ==""){ window.alert("You must enter enter information in all text boxes"); return false; } function submitForm(){ var radioSelected = false; for (var i=0; i<5; ++i) { if (document.forms[0].contactHow[i].checked == true) { radioSelected = true; break; } if (radioSelected == false){ window.alert("you"); return false; } else return true; } } } /* ]]> */ </script> </head> <body onload="setFormFocus();"> <h1>Real Estate Inquiry</h1> <form action="FormProcessor.html" method="get" onsubmit="return validateIt(); onsubmit="return submitForm();" enctype="application/x-www-form-urlencoded"> <p>Name<br /> <input type="text" name="visitor_name" size="50" value="Enter your name" onclick="if (this.value == 'Enter your name') this.value = '';" /></p> <p>E-mail address<br /> <input type="text" name="email" size="50" value="Enter your e-mail address" onclick="if (this.value == 'Enter your e-mail address') this.value = '';" /></p> <p>Phone<br /> <input type="text" name="phone" size="50" value="Enter your phone number" onclick="if (this.value == 'Enter your phone number') this.value = '';" /></p> <p>Area of town<br /> <input type="text" name="area" size="50" value="What are of town are you interested in?" onclick="if (this.value == 'What are of town are you interested in?') this.value = '';" /></p> <p>Property <select name="property_type"> <option value="unselected">Select a Property Type</option> <option value="condo">Condos</option> <option value="single">Single Family Homes</option> <option value="multi">Multifamily Homes</option> <option value="mobile">Mobile Homes</option> <option value="land">Land</option> </select> Sq. feet <input type="text" name="feet" size="5" value="???" onclick="if (this.value == '???') this.value = '';" /> </p> <p>Bedrooms <input type="text" name="bedrooms" size="5" value="???" onclick="if (this.value == '???') this.value = '';" /> </p> Maximum price <input type="text" name="price" size="12" value="???" onclick="if (this.value == '???') this.value = '';" /> </p> <p>How should we contact you? <input type="radio" name="contactHow"value="call_me" /> Call me <input type="radio" name="contactHow" value="e-mail_me" /> E-mail me</p> <p><input type="submit" /></p> </form> </body> </html> Hey, I need help with a javascript function to show a div when 3 "Yes" radio buttons are clicked. Heres my code: Code: <form> <ul id="quiz-list"> <li>1. My bed partner complains that I snore. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>2. My bed partner says I hold my breath while asleep. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>3. I wake at night gasping for breath. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>4. I have no energy in the daytime. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>5. I'm tired all the time. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>6. I wake up at night with a dry mouth. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>7. I often wake in the morning with a headache. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>8. I'm at least 20 Ibs. overweight. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>9. I have high blood pressure. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>10. I sweat a lot at night. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>11. I wake up with my heart pounding. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>12. I wake up with my heart skipping beats. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>13. I'm losing interest in sex. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>14. I can't stay awake during the day. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>15. I can't concentrate on my work. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>16. I have had work accidents because I'm tired. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>17. I'm irritable most or all of the time. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>18. My neck collar size is larger than 17". <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>19. I've fallen asleep while driving at night. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> <li>20. I have to pull off the road to nap. <input id="checkme" name="snore" type="radio" value="Yes" />Yes <input id="checkme" name="snore" type="radio" value="No" />No</li> </ul> If you answered YES to 3 or more of the above questions you may have Sleep Apnea - a potentially serious breathing disorder that can lead to heart attack, stroke, or high blood pressure in later life. <div id="extra"> <!--cforms name="Quiz Form"--> </div> </form> I'm making a javascript game for a digital media class and I'm having a hard time figuring out how to code this. The idea is that there's three similar images, one that's different and the user must select the image that's different by selecting the radio button below it and pressing the Submit button. So in the if/else statement, I want it to be programmed so that if the correct answer is selected and then submitted, it will take you to another webpage. If an incorrect answer is selected, I want an alert to pop up and say Sorry, that's Incorrect. Here's the coding I have so far, none of which is working. Code: <script type="text/javascript"> function processAnswer() { for (i = 0; i <= 3; i++) { if (document.myForm.radSize[i].checked == true) { size = document.myForm.radSize[i].value; } // end if } // end for loop alert("You Selected a Button") } // end </script> And in the body... <div id="imagediv"><br /><br /><center> <form name = "myForm" action=""> <table width="500" border="0"> <tr> <td><center><img src="images/image2.png" /><br /> <Input type = radio Name = r1 Value = "1" > </center> </td> <td><center><img src="images/image1.png" /><br /> <Input type = radio Name = r1 Value = "2" > </center> </td> <td><center><img src="images/image2.png" /><br /> <Input type = radio Name = r1 Value = "3" > </center></td> </tr> </table><br /><br /> <center><input type = "button" value = "Submit" onClick = "processAnswer()"/> </center> Any help would be greatly appreciated, I've never worked with javascript before so I'm having a really hard time! like for example i have text areas named upload1 and upload2 when I click or add input on upload1 a drop down list below upload2 will not change, but when I add input on upload2 the dropdown will select "parts" i have the following code which i am trying to insert a 'back button' into to go back to the previous page. i can only seem to get the button to appear either at the very top or very bottom of the page, does anyone know how i can specify the location? this script is generated from easypano tourweaver - Code: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Virtual Tour Created By CAPITA SYMONDS</title> </head> <body leftMargin="0" topMargin="0" rightMargin="0" bottomMargin="0"> <script type="text/javascript" src="swfobject.js"></script> <div id="flashcontent"> To view virtual tour properly, Flash Player 9.0.28 or later version is needed. Please download the latest version of <a href="http://www.adobe.com/go/getflashplayer" target="_blank">Flash Player</a> and install it on your computer. </div> <script type="text/javascript"> // <![CDATA[ var so = new SWFObject("twviewer.swf", "sotester", "1024", "768", "9.0.0", "#FFFFFF"); so.addParam("allowNetworking", "all"); so.addParam("allowScriptAccess", "always"); so.addParam("allowFullScreen", "true"); so.addParam("scale", "noscale"); //<!-%% Share Mode %%-> so.addVariable("lwImg", "resources/2_area_multipix_preloading image file.jpg"); so.addVariable("lwBgColor", "255,255,255,255"); so.addVariable("lwBarBgColor", "255,186,186,186"); so.addVariable("lwBarColor", "255,153,0,0"); so.addVariable("lwBarBounds", "-512,-384,1024,768"); so.addVariable("lwlocation", "4"); so.addVariable("lwShowLoadingPercent", "false"); so.addVariable("lwTextColor", "255,0,0,0"); so.addVariable("iniFile", "config_2_Area_Multipix.bin"); so.addVariable("progressType", "1"); so.addVariable("swfFile", "resources/2_area_multipix_1_animation for tourweaver.swf"); so.addVariable("href", location.href); so.write("flashcontent"); // ]]> </script> </body> </html> here is the button code - Code: <span onclick="javascript:history.back()" style="text-decoration:underline; color:blue; cursor:hand">Back</span> Not sure how to explain this but...... Using a meta refresh to display a thankyou page for 5 seconds after a form submit, then return to form. If user clicks back to return to main page from form, returns to thankyou page instead, and has to go back to form again, then back to main page. I can have thankyou page return to main page, but would rather return to form. This is what it should do: main page -> form -> thankyou page -> form -> main page This is what it does: main -> form -> thankyou -> form -> thankyou -> form -> main Is there any way to remove thankyou page from history? Hello there, I'm a 30yr old returning to school and I signed up for a CMIS102 class, thinking it be more explanatory as the syllabus let on. But I was wrong. While I do understand some of what the professor has been teaching us, like modular programming and IfElse statements, I can't wrap my head around things like While Loops. My professor has saddled us with a couple assignments, requiring us to write in pseudocode and I was wondering if anyone could explain what he wants from this assignment or even help me with it, that maybe I can finally have a grasp of it, and will know what I'm doing on the final. ~Tia P.S. I've posted the assignment question below: I need to write a pseudo-codepseudocode for the following question but don't know how: Write a program to read a list of exam scores (in the range 0 to 100) and to output the total number of grades and the number of grades in each letter=grade category. The end input is indicated by a negative score as a sentinel value. (The negative value is used only to end the loop, so do not use it in the calculations. Example: 88 93 55 77 100 -1 (The output would be) Total number of grades = 5 Number of A's =2 Number of B's = 1 Number of C's =1 Number of D's = 0 Number of F's =1 Must prompt user to run again I need an html page that when visited automatically redirects the browser to return to the previous page it was on. here is the current code I have: Code: <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <script type="text/javascript"> function load() { history.go(-1) alert(""); } </script> </head> <body onload="load()"> <input type="button" value="Back" onclick="goBack()" /> </body> </html> this works in firefox but in IE you have to press ok in the alert box before it returns. I admit I am a javascript novice. Any suggestions overview: from my javascript, i call a function in the php block, that function successfully retrieves a value from the database, but when i pass that retrieved value back to the calling function....all is lost somehow. when i test this code by itself, it works fine and gets the correct number. <?php mysql_select_db($database_connFtH, $connFtH); $result = mysql_query("SELECT status_index FROM cpqc_status ORDER BY row_id DESC"); $row_result = mysql_fetch_assoc($result); $index = $row_result['status_index']; echo $row_result['status_index']; echo $index; echo "the value of index is ".$index; ?> however, when i set this same code up as a function to be called upon globally, and to return the value of $index, it all just seems to "not work". <?php function runStatus() { mysql_select_db($database_connFtH, $connFtH); $result = mysql_query("SELECT status_index FROM cpqc_status ORDER BY row_id DESC"); $row_result = mysql_fetch_assoc($result); $index = $row_result['status_index']; return ($index); } //end function runStatus() ?> the calling function, with an alert box to check if the value of $index was passed down accurately <script type="text/javascript"> var x = runStatus(); alert(x); </script> all i want to do is call a server-script function that deals with the database and gets me a value out of the database, and pass that value back to the calling function. can't figure out what is wrong. the "return($index)" should send back the value of $index. the call to that function should receive back a value and assign it to "x". and the alert(x) should spit it out with no problem. but......something is wrong and it won't work. any ideas what is wrong? it is my understanding that a function inside the php determants can be called upon from anywhere and that function can return a value.(?) argh!! i think i know why Einstein's hair was always so messy!! thanks, Paul Williams weather today in Kalispell, MT: 7 deg this morning, got a little snow last night, only about 6 or 8 inches, not much. maybe more later. Hi, I currently have a <div> with a <p> and have an edit button that when clicked will transform it into a textarea using jQuery's .html(). I also have a cancel button which allows the user to cancel the edit and return the textarea to the previous content, any ideas how I do this? JavaScript Code: // JavaScript Document jQuery(document).ready(function(e) { $('#edit_p').click(function(e){ $('#cancel_p').show(); $('#greeting').html("<textarea id='txt_greeting' cols='20'>" + $('#greeting p').text() + "</textarea>"); $(this).hide(); }); $('#cancel_p').click(function(e){ $('#edit_p').show(); $(this).hide(); }); }); HTML Code: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>Textarea/Button Change</title> <script type="text/javascript" src="jquery-1.7.js"></script> <script type="text/javascript" src="txt_area_jquery.js"></script> <link rel="stylesheet" type="text/css" href="txt_area_style.css" /> </head> <body> <div id="greeting"><p>Hello, today is a great day!</p></div> <input type="button" name="edit_p" id="edit_p" value="Edit" /> <input type="button" name="cancel_p" id="cancel_p" value="Cancel" /> <?php ?> </body> </html> I am making a simple puzzle game on Android using Phonegap, that is HTML5, CSS3 and JavaScript. When a user fills an answer on a page, if the answer is correct, it will go to another page. However, once the user goes to the next page, he/she CANNOT return back to the previous page. I do not want the user to return back, else he/she will have to fill the answer again to go to the next page, so it's not good. Thank I am not sure if this has been posted before but I need help with this. When a user clicks on the back button I need them to be directed to the previous page and still have their original selections and not the defaults. Here is the rest of code on the back button. At the moment this is not working. <input id=STDBUTSHORT type="button" value="Back" onClick="history.back();">') Thanks in advance. this function seems to be working fine in all browser but of course. I'm still a noob at JavaScript and well things like this just doesn't make sense. when I go to alert this function in IE I get undefined. But other browser gives me a value. What am I doing wrong with this function? Code: function ext() { var img = document.getElementById('photoSmall'); img = img.src; if (typeof img == 'string' && img != 'undefined') { var typeis = img.substr(-4); if (typeis == '.png' || '.jpg' || '.gif') { return typeis; } } } Thanks Jon W I need a back to top link on the bottom of my page that stays there all the time while people are scrolling.. is this possible? is this close to what i'm looking for? http://javascript.internet.com/page-...ting-link.html i've seen it on some other sites but I can't find any to reference now... I'm totally new to this! thanks for your help! -B Hey, I was wondering if there was something in javascript that could tell if the text is selected. Selected as in when you click and hold your mouse down and go over text. Is there something in javascript to tell if you've selected any text? Thanks. hi i have a html page that has a link "OPEN POP UP" when this link is clicked a new pop up window is opened. and this pop has two LINKS first is ONE and second is TWO. what i want to do is. when any of these LINKS is clicked on the popup the should close and the my main html page from where the popup came should execute a javascript function. please help I have a website using this pageslide function http://srobbin.com/blog/jquery-pageslide/ Basically the page you see in the example is acting as a side menu bar and when you click the links on that page, it performs the sliding action and a new page slides into the screen. I'm wondering if there is any way to get the back button to slide it back to the main page, rather than having to click a link to go back? |