JavaScript - Get Value Of A Checkbox When Check Box Is Clicked
Hey all, I would like to get the id of a html check box when the client clicks it. I want to do this on the client side so i need to use java script. I want to be able to do this in both fire fox and ie
window.event.srcElement works great for ie but not for firefox please do not tell me to use Event.target for firefox because that does not work. At least it is not working for me anyway. Thanks Similar TutorialsCan a checkbox do 2 different things after it is clicked? Right now I am using this... Code: <input type="checkbox" onclick="processCheckbox(this);"> <input type="checkbox" onclick="activLink(this.checked)"> I don't want to have 2 checkboxes on my page, just 1 and get the same result. Is this possible? Chad Hi, may I ask how do you display a line or a sentence when you click the checkbox? Hi guys. I have a lot of information on my site that is in multiple categories. I have a list of categories, each with its own checkbox. By default, all the information is displayed (therefore all the checkbox's are checked by default). When someone unchecks the box I want to hide the divs with that class, and when someone rechecks the box, they should reappear. Here is my code so far. It is hiding the div's fine, but they are not reappearing when user tics the checkbox again. Code: <script type="text/javascript"> function toggledisplay(category){ if(document.getElementById(category).checked){ $("."+category).removeClass(category+"-hidden").addClass(category); } else{ $("."+category).addClass(category+"-hidden").removeClass(category); } } </script> <input type="checkbox" checked="checked" name="fitness" id="fitness" onclick="toggledisplay('fitness')" /> So here's what i want to do: i have 2 checkboxes, when Checkbox A is checked, i want to automatically check the checkbox B. When A is unchecked, then uncheck B how can i do that? thanks a lot ! All, I have the following checkbox code: PHP Code: echo "<input name=\"picbigid[]\" type=\"checkbox\" value=\"$pic[src_big]\">"; I then want to select all the checkboxes so I have this code: [PHP] echo "<input type=\"button\" name=\"CheckAll\" value=\"Check All\" onClick=\"checkAll(document.photos.picbigid)\"> <input type=\"button\" name=\"UnCheckAll\" value=\"Uncheck All\" onClick=\"uncheckAll(document.photos.picbigid)\">"; [PHP] My JS function is: Code: function checkAll(field) { for (i = 0; i < field.length; i++) field[i].checked = true ; } function uncheckAll(field) { for (i = 0; i < field.length; i++) field[i].checked = false ; } If I do it like this: PHP Code: echo "<input name=\"picbigid\" type=\"checkbox\" value=\"$pic[src_big]\">"; It works but I can't have it like that because the form posts to another PHP page that needs the input name as an array. Any ideas? Thanks! Hello I am trying to find a way to use the check all javascript code to select all my checkboxes within a while...loop. Codes goes as follows: within the header on the top of page 1: <SCRIPT LANGUAGE="JavaScript"> function CheckAll(chk) { for (i = 0; i < chk.length; i++) chk[i].checked = true ; } function UnCheckAll(chk) { for (i = 0; i < chk.length; i++) chk[i].checked = false ; } </script> The code that displays the checkboxes, which is a page included onto page 1: echo "<a class='comp' onclick='singleHideandShow({$row['pr_id']})' style='cursorointer'>{$row['propname']}</a><p>"; $propqry = mysql_query("SELECT * FROM users WHERE propid={$row['pr_id']}"); //using the hide and show id number, once clicked it will display the below contents echo "<div id={$row['pr_id']} style='display:none;'>"; while($propf = mysql_fetch_assoc($propqry)) { if($propf['uactive'] == "yes") { $pactive = "active"; } else { $pactive = "deactivated"; } //displays the information from the DB with a checkbox echo "<form name='myform' id='formmsg' method='post' action='profile.php?paction=edit&find=none' >"; echo " <input type='checkbox' name='check_list' value='{$propf['us_id']}'> <a href='profile.php?paction=edit&pid={$propf['us_id']}' /><img src='../images/secure/edit.png' name='Edit' border='0' /></a> <a href='profile.php?paction=delete&pid={$propf['us_id']}' /><img src='../images/secure/delete.png' name='Delete' border='0' /></a><label class='cuser'> {$propf['fname']} {$propf['lname']}, ({$propf['uname']}), {$pactive}</label><br>"; } echo "</form>"; echo '<p><input type="button" name="Check_All" value="Check All" onClick="CheckAll(document.myform.check_list)"> <input type="button" name="Un_CheckAll" value="Uncheck All" onClick="UnCheckAll(document.myform.check_list)"> <p>'; echo "</div>"; I receive the following error message when I click on the Check All button. Message: 'length' is null or not an object Line: 15 Char: 13 Code: 0 URI: http://www.domainname.com/profile.ph...edit&find=none Can anyone help me figure this out? I currently have this script, I need it to check when I click the checkall button. Hm... now for some reason the select all button isnt working... Current code: Javascript: Code: <script type="text/javascript"> function checkall(chek) { for (i = 0; i < chek.length; i++) chek[i].checked = true; } </script> <script type="text/javascript"> function uncheckall(chek) { for (i = 0; i < chek.length; i++) chek[i].checked = false; } </script> PHP: PHP Code: <?php error_reporting(E_ALL); require("inc/config.php"); if (isset($_POST['del'])) { for ($count = 0;$count<count($_POST[delchk]);$count++) { $delete = $_POST[delchk][$count]; $query = "DELETE FROM persons WHERE id = '$delete'"; $result = mysql_query($query); if (!$result) { die("Error deleting persons! Query: $query<br />Error: ".mysql_error()); } } } $result = mysql_query("SELECT * FROM persons"); // Check how many rows it found if(mysql_num_rows($result) > 0){ echo "<table id=\"mytable\"> <thead> <tr> <th align=\"center\" scope=\"col\">Delete</th> <th align=\"center\" scope=\"col\">First Name</th> <th align=\"center\" scope=\"col\">Last Name</th> <th align=\"center\" scope=\"col\">High Scores</th> <th align=\"center\" scope=\"col\">Date of Entry</th> <th align=\"center\" scope=\"col\">IP Address</th> </tr> </thead> <tbody>"; echo "<form name = 'myform' action='' method='post'>"; while($row = mysql_fetch_array($result)) { echo "<tr align=\"center\">"; echo '<td><input type="checkbox" id="delchk" name="delchk[]" value="'.$row['id'].'" /></td>'; echo "<td>" . $row['FirstName'] . "</td>"; echo "<td>" . $row['LastName'] . "</td>"; echo "<td><a target=frame2 href='" ."profile.php?user1=". $row['FirstName'] ."'>Check HighScores</a></td>"; echo "<td>" . $row['AddedDate'] . "</td>"; echo "<td>" . $row['Ip'] . "</td>"; echo "</tr>"; } echo "</tbody>"; echo "</table>"; echo "<hr>"; echo "<input type='submit' name = 'del' value='Delete Selected'></form>"; echo "<input type='button' onclick='checkall(document.myform.delchk);' value='Select All'>"; echo "<input type='button' onclick='uncheckall(document.myform.delchk);' value='UnSelect All'>"; } else{ // No rows were found ... echo "No Registered Members"; echo "</tbody>"; echo "</table>"; } mysql_close($con); ?> 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. Hello I am new at Javascript. Please help me this: I have a form and a checkbox: Code: <input name="pass" type="password" class="textfield" /> <input type="checkbox" class="check"> Click here to show/hide password If I the checkbox is checked, it will show the password in the form, it means Code: <input name="pass" class="textfield" /> if not, the input form is: Code: <input name="pass" type="password" class="textfield" /> <script language="JavaScript"> function changeColor(cell_id){var state1="#dde6ed"; var state2="#ffc20e"; var cellid = new Array ("id1", "id2", "id3", "id4", "id5", "id6"); for(var i = 0; i < cellid.length; i++){var nav = document.getElementById(cellid[i]); if(cellid == nav.id){nav.style.backgroundColor=state2;} else {nav.style.backgroundColor=state1;}}} </script> Can anyone tell me what is wrong with this script. I put an onClick= changeColor(this);" in my <td> tag to call the script but still not working. On this webpage http://www.corkdiscos.com/testimonials.html i have a like button. when a user clicks like a comment box appears. when i unlike the button the comment box disappears this is ok but when a user has already liked the facebook page and comes to my webpage the comment box does not show. so im looking for a piece of javascript to check if a user has like the button on my page and if so to show the comment box. please check my source code of the website http://www.corkdiscos.com/testimonials.html to see what i have so far. any help would be greatly appreciated Hi, If I have two check-boxes and one is already checked and then the is checked, how would I get it to uncheck the first one using JavaScript. Thanks, Cs1h Hey, I'm not to good at javascript and need help. When someone clicks an option in a <select> box, I want a field to appear with a normal text box. For example: Code: <!--Option box--> <select name="method"> <option>Post 2 Host</option> <option>Paid</option> <!--I want it when they click Paid, a box shows up below. Such as--> <input type="text" name="paid" /> Can you show me how I can do this? Thanks. Hey, I'm new to javascript and was wondering if there is something where you can tell if something is clicked. All I need is to know something where you click something and it appears, and click again it disappears. How can I do this? Thanks! Hi guys. I'm working a bunch of pre existing code on a CMS. Just after a quick fix. Doing a show/hide thing on a particular div somewhere on the page depending if a checkbox is ticked or not. Currently there is 3 checkboxes that are dynamically added through the CMS. Here's simplified version of the form: Code: <form id="simplesearch" name="simplesearch"> <input type="checkbox" onclick='showhidefield(this.value)' name="meta_data_array_search_criteria[custom_profile_type][]" value="5" class="input-checkboxes" /> <input type="checkbox" onclick='showhidefield(this.value)' name="meta_data_array_search_criteria[custom_profile_type][]" value="4" class="input-checkboxes" /> </form> And here's the javascript I was playing with. Code: function showhidefield(id) { if(document.simplesearch.meta_data_array_search_criteria[custom_profile_type][''].checked) { document.getElementById("profile_fields_wrapper_" + id).style.visibility = "visible"; } else { document.getElementById("profile_fields_wrapper_" + id).style.visibility = "hidden"; } } Problem I'm having is how do i do a check to see if those checkboxes are checked in the javascript with those name arrays? How do i separate them? 'm guessing I have to loop through them or something?Hopefully that make senses - it's late here and I'm losing the plot Any pointers would be gratefully welcomed On custom button images, how do you give them the effect that they're "pushed" when the user clicks them and "unpushed" when the user lets his finger off the mouse button? I'm guessing it's some type of rollover effect, but I'm not sure how it's done.
I have a simple problem that I can't solve. I know that you guys might know how to solve it. I'm using an extension of dreamweaver called Coursebuilder. I'm making an online-examination to improve education especially in a far region of Asia where there's poor quality of education in there. Now, I'm making a multiplication choice type of exam with radio buttons in it and when the "check answer" was clicked, the answer will be explained. It is already done, but the problem is the feedback score. I can't make a feedback score... example the examination is 40/100 score it must appear on the screen at once after a click of a certain button. That's my only problem for now. It will be used in CD format and online. what should i do? All I need is to know how will I put a button that once it was clicked the score in the examination will appear. I'm an amateur web designer, I need your help. Thanks please help me. Hi everyone - I was wondering how it would be possible for me to create a FAQ with drop-down answers when the question is clicked? For example: https://www.facebook.com/help/?page=1145 Facebook has something like that available. Any ideas? Hello, I am just going through my javascript book and looking/learning at examples. I've copied this code and i'm thinking i could really use this in my site, it's something i've been looking for on the internet for a while. I have a few questions regarding certain things and I would like to slightly change the code so it performs an additional task. I have uploaded a live example of the page as it is a lot easier for you guys to help and also easier for myself to explain properly. The file is located he JS test page. As you can see, you click the different tabs and the relative information comes up. 1)How can I change the code so that if one description is currently on-screen, when another tab is clicked, i want to hide the currently displayed information, and show the relative information to that particular tab. 2)As you can see, clicking the tabs just brings up text saying 'Description for Tab' + #. This is added using the DOM, but i want to add a lot of description and obviously do not want to put an awful lot of text into the function. What is the best way to add this content dynamically? Should I create an XML file and access this file using javascript to display the different information? I understand question 2 could be done using ajax and php but I know nothing about either so i was wondering if there was another way to achieve this? Thank you for your time, Regards, LC. Hi, I am currently working on a website with a custom livesearch. The livesearch is a simple <ul> under the input box. I am trying to make it so that if the user click anywhere other than the input box(id=searchInput) or the list(id=searchResults). I tried an onblur on the input box, but when the user clicks on the list it vanishes, which defeats the object! Any help would be much appreciated |