JavaScript - Retrieve Checkbox Data
Hello,
I'm very new to JavaScript as well as this forum, so apologies if I mess up somewhere. Okay, so I have a HTML doc with a JavaScript attached to it, and in the HTML I have a checkbox. All I want to do is to pass the checkbox data to Javascript as a true/false. Okay, so below is my HTML: Code: <head> <script type="text/javascript" src="java.js"></script> </head> <body> <input id="toggle" type="checkbox" value=""> </body> And this is my JS: Code: var toggleData = false; Now where do I go from here? I tried using getElementByld('toggle'); But no result. I sure would appetite some help here. Thanks Similar TutorialsHi there I am trying to retrieve xml data using the prototype Ajax.Request. I think I am getting the xml though I am unsure as to how to retrieve the text from the nodes here is the function I am using to try and populate a text field Code: function makeMarkerXml() { new Ajax.Request('coords.xml', { method:'post', onSuccess: function(transport){ ////this will not work///////// var coord = transport.responseXML.childNodes(0).childNodes(0).firstChild.text; /////////////////////////////// }, onFailu function(){ alert('Call failed') } }); } can anyone help? First of all Thank you for looking at my issues. Just so you know, I am not a coder I have a new set of problems I'm hoping someone can help me with. Please read all three problems listed below as they are all intertwined. Thank you for any assistance you have with these issues. First, here is the url to my test form http://www.rocpinions.com/test-main-form.html Next, Here is the code I am using. The code is set up on dog cat other and none. The test check 1 etc are all individual check box groups Code: <script type="text/javascript"> function checkI() { var other=0; var checkL = document.getElementsByName('form[PetsInHouse][]'); for (var i=0;i<checkL.length-1;i++){ if(document.getElementById('PetsInHouse3').checked){ document.getElementById('PetsInHouse'+i).disabled = true; document.getElementById('PetsInHouse'+i).checked = false; } else { document.getElementById('PetsInHouse'+i).disabled = false; } if(document.getElementById('PetsInHouse'+i).checked){ other++ } } document.getElementById('PetsInHouse3').disabled=other>0?true:false; } </script> And here is the call I am using onclick="checkI();" Problem 1 This code works fine as is is set up and does what it should. The problem is i am also using this on longer sets of check boxes and I would like to instead of disabling I would like to have it set up so if someone clicks dog cat and other then if they choose the check box "None" it would empty all other check boxes and check the check box "None" and visa versa if none was checked and they checked dog, it would empty the None check. Problem 2 I am using Joomla cms and a form constructor called RS Form Pro. It stores the data submitted in the form to a data base. As it is now, all the info in the check box group is submitted to ONE column. I need to submit it to individual columns for each choice. I can accomplish this by using individual check box groups for EACH item. This will put it in separate columns in the data base but I still need to have it set up so if someone clicks dog cat and other then if they choose the check box "None" it would empty all other check boxes and check the check box "None" and visa versa if none was checked and they checked dog, it would empty the None check. Problem 3 How it submits data to the data base Right now, it submits the data from the check boxes by the name of the check box. What I would like to have is a 1 if it IS checked and a 0 if IS NOT checked. Again, Thank you for any assistance DeZiner hellow, i try to make a script that gets data from my mysql-database and displays it in a form with check boxes. if i select one or more check boxes the data with its checkbox should move to another column in the table in this form. all the other data and there checkboxes not selected should stay at its own place. in the future i want to work with 150 checkboxes. the part for getting it out off the database and display it in the form with the checkboxes is completed in PHP. but i'm stuck changing its place with the onclick handler from javascript. here you can see it working (but it's written when you click auto1 an click submit all the checkboxes change place and are selected) http://silent.comxa.com/m.php the code i have so far is: PHP Code: <? $ch11 = ''; $ch11 = $_POST['auto1']; $checked = isset($_POST['submit1']) && $_POST['auto1'] == 'on' ? 'checked="checked"' : ''; ?> </head> <body> <? @$cat=$_GET['cat']; if(strlen($cat) > 0 and !is_numeric($cat)){ echo "Data Error"; exit; } ///////// Getting the data from Mysql table ////////// $quer2=mysql_query("SELECT DISTINCT category,cat_id FROM category order by category"); ?> <form method="post" name="f2" action="m.php"><table width="828" border="1"> <?php while($noticia2 = mysql_fetch_array($quer2)) { if ($ch11 =='on'){ echo '<tr><td width="200" > </td><td width="300" > </td> <td width="200" > <input name="'.$noticia2[category].'" type="checkbox"'.$checked.'/> '.$noticia2[category].' </td><td width="100">'.$noticia2[cat_id].'</td></tr>'; } else { echo '<tr><td width="200" > <input name="'.$noticia2[category].'" type="checkbox"'.$checked.'/> '.$noticia2[category].' </td><td width="300" >'.$noticia2[cat_id].'</td><td width="200" > </td><td width="100" > </td></tr>';} } ?> </table> <?php echo '<input type="submit" name = "submit1" value="Submit"/>'; echo '</form>'; ?> 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 ! 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 Hi guys can help me are very little versed in javascript ... I explain my problem! I have a table where they passed the results of a query ... The table field is called Article and consists of about 500 characters, but the substring in the table with a step the first 40 characters, and now the question arises ... I would click on the text of the article and see the page the entire article ... Code: query="SELECT * FROM Articolo ORDER BY titolo DESC"; ResultSet r = stmt.executeQuery(query); %> <table border="1"> <tr><td> titolo </td> <td> articolo </td> <td> data inser </td></tr> <% while(r.next()) { Tot = r.getString("titolo"); Art = r.getString("articolo"); dat = r.getString("data_inserimento"); String meta = ""; String metadata = ""; meta = Art.substring(0,40); metadata = dat.substring(0, 10); StringBuffer sb = new StringBuffer(meta); sb.replace(37,40, "..."); String s2 = sb.toString(); %> <tr> <td> <%= Tot %> </td> <td> <a href="#" onClick="this.innerText = '<%= Art %>';"><%= s2 %></a> </td> <td> <%= metadata %> </td> </tr> <% } %> </table> hi all, as i am very stupid in javascript.... supposing i had a select box on a page with an id of "select1" and name of "select1" as well... using javascript how would i access the select box's selected value and how would i print it out on the screen.... thanks in advance.... cheers sanjeev I have been able to use javascript to place the last modified date in the bottom left corner of my document however I do not need the time with it. How do I use the substring() method on the lastModified property? Here is what it looks like. Code: <script type="text/javascript"> <!--Hide from old browsers var today = new Date() var dayofweek = today.toLocaleString() dayLocate = dayofweek.indexOf(",") weekDay = dayofweek.substring(0, dayLocate) newDay = dayofweek.substring() dateLocate= newDay.indexOf(",") monthDate = newDay.substring(0, dateLocate+1) yearLocate = dayofweek.indexOf("2011") year = dayofweek.substr(yearLocate, 4) document.write("<p style='font-family:bold, Arial, Helvetica, sans-serif; font-size:xx-small; color:#000000'>") document.write("Copyright the Huysken Performing Arts Center. ") document.write("<br />This document was last modified "+document.lastModified+"</p>") The text book says to use a substring() method on the lastModified property, but I am uncertain on how to do that. Any help is greatly appreciated, Thank you. Hi guys, i need to retrieve the url created in the following script and embed it in the player below. Here is what i have. You can see how it works (and doesn't) here http://www.brittv.co.uk/template.php...ws.stream_360p Code: <html> <head> <title>...</title> <?php $URL_GETKEY="http://www.uktvlive.com/tvc/key.php"; function doCurl($url) { $ch = curl_init($url); curl_setopt($ch, CURLOPT_HEADER, 0); curl_setopt($ch, CURLOPT_POST, 1); curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); $output = curl_exec($ch); curl_close($ch); return $output; } $a=doCurl($URL_GETKEY); $split=explode("<split>",$a); ?> <script type="text/javascript"> // parse the querystring and create a dictionary of terms for later use: var qs = [ ]; // where the dictionary goes if ( location.search.length > 1 ) { var pairs = location.search.substring(1).split("&"); for ( var p = 0; p < pairs.length; ++p ) { var pair = pairs[p].split("="); qs[pair[0]] = unescape( pair[1] ); } } // do the replacements *after* page is loaded, for simplicity: function doReplacements( ) { var link = document.getElementById("link1"); link.href = "rtsp://81.104.67.230/"+ qs["host"] + "/" + qs["stream"] + "?userID=" + "<?php echo $split[5];?>" + "&accessKey=" + "<?php echo $split[6];?>" + "&sdp=alt&device=mobile"; link.innerHTML = qs["page"]; // and of course you could do any other replacements, too. } window.onload = doReplacements; </script> </head> The following part produces the url Code: <body> <br/><br/> <a id="link1">Generic Link</a> <br/><br/> Lastly we have the player embed code, this is where im stuck im afraid Code: <script type="text/javascript"> var url = qs["link1"]; // or whatever name it was passed by document.write('<OBJECT CLASSID="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B" ' + ' WIDTH="300" HEIGHT="160" ' + ' CODEBASE="http://www.apple.com/qtactivex/qtplugin.cab">\n' + '<PARAM name="SRC" VALUE = "http://www.tvpc.com/images/image1.gif" >\n' + '<PARAM name="QTSRC" VALUE = "' + url +'" >\n' + '<PARAM name="HREF" VALUE = "' + url + '" >\n' + '<PARAM name="AUTOPLAY" VALUE = "true" >\n' + '<PARAM name="CONTROLLER" VALUE = "true" >\n' + '<PARAM name="TYPE" VALUE = "video/quicktime" >\n' + '<PARAM name="TARGET" VALUE = "myself" >\n' + '<EMBED \n' + ' SRC = "#" \n' + ' QTSRC = "' + url + '" \n' + ' HREF = "' + url + '" \n' + ' TARGET = "myself"\n' + ' CONTROLLER = "true"\n' + ' WIDTH = "300" \n' + ' HEIGHT = "160" \n' + ' LOOP = "false" \n' + ' AUTOPLAY = "true" \n' + ' PLUGIN = "quicktimeplugin" \n' + ' TYPE = "video/quicktime" \n' + ' CACHE = "false" \n' + ' PLUGINSPAGE= "http://www.apple.com/quicktime/download/" >\n' + '</EMBED>\n' + '</OBJECT>\n' ); </script> </body> </head> Thanks in advance guys Hi, I know there are several ways to do this- but which way is best practice? I can access a variable from one function by making it a global variable, but I read that this isn't the most ideal way, and is a last resort. So for example if I have this: Code: function num1(){ var firstNum = 35; return firstNum; } function num2(){ var secNum = 52; return secNum; } function addNums(x,y){ var f = num1(x); var s = num2(y); var total = f + s; alert(total); } Then I call this function with a button. Now, I know this works, but it doesn't seem like a very good way to do what I'm after. Or is it? Any help/ tips would be great. edit: The idea is that the functions won't just return a single value and that's it. They will return a users choice in a given scenario, so they might return the user's age from the first function, then their location in the next etc etc, then I want to use this information in a separate function. Hello I am trying to iterate out the values of an xml file. I have got the file to load though I have not yet been able to extract the values. Considering that theXml is an xml file and 'coords' are tags containing a coordinate how would I extract the value. Here is the code I am using Code: var coordTags = theXml.getElementsByTagName( 'coords' ); var len =coordTags.length;///this works var coord =coordTags[0].value;///this doesn't work var coord =coordTags[0].text;///this doesn't work var coord =coordTags[0].innerText;///this doesn't work parent.document.receiver.theres.value = coord; I am sure for some of you this is a really simple question so please someone help!! Hi, I have several input text boxes in a <FIELDSET> tag. I would like to load id attributes of the <FIELDSET> tag into an array and then process the array. My code example is below my signature. Thank You in Advance for Your Help, Lou 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" xml:lang="en" lang="en"> <HEAD> <SCRIPT LANGUAGE="JavaScript"> function DisplayDetails(obj_id) { alert("DisplayDetails(" + obj_id + ")"); var form_object = new Array(document.getElementById(obj_id)); var form_elements = form_object.elements; alert(form_object[0]); } </SCRIPT> </HEAD> <BODY> <font size="4" face="Arial" color='Black'> Hi Barney <form> <fieldset id="Person1"> <legend>Person 1:</legend> Name: <input type="text" id="name1" size="30" /><br /> Email: <input type="text" id="email1" size="30" /><br /> Date of birth: <input type="text" id="dob1" size="10" /> </fieldset> </form> </font> <button type="button" onclick="DisplayDetails('name1')">Click Me!</button> </html> HI I'm using this form in my site, but I want to amend it so the form updates based on the option ID, not the option Value. This will make it easier for me to save the correct data in the value field.. Any ideas ? PHP Code: <html> <head> <script type="text/javascript"> function setOptions(chosen) { var selbox = document.myform.opttwo; selbox.options.length = 0; if (chosen == " ") { selbox.options[selbox.options.length] = new Option('Please select one of the options above first',' '); } if (chosen == "1") { selbox.options[selbox.options.length] = new Option('first choice - option one','oneone'); selbox.options[selbox.options.length] = new Option('first choice - option two','onetwo'); } if (chosen == "2") { selbox.options[selbox.options.length] = new Option('second choice - option one','twoone'); selbox.options[selbox.options.length] = new Option('second choice - option two','twotwo'); } if (chosen == "3") { selbox.options[selbox.options.length] = new Option('third choice - option one','threeone'); selbox.options[selbox.options.length] = new Option('third choice - option two','threetwo'); } } </script> </head> <body> <form name="myform"><div class="centre"> <select name="optone" size="1" onchange="setOptions(document.myform.optone.options[document.myform.optone.selectedIndex].value);"> <option id="0" value=" " selected="selected"> </option> <option id="1" value="1">First Option</option> <option id="2" value="2">Second Choice</option> <option id="3" value="3">Third Choice</option> </select><br /> <br /> <select name="opttwo" size="1"> <option value=" " selected="selected">Please select one of the options above first</option> </select> <input type="button" name="go" value="Value Selected" onclick="alert(document.myform.opttwo.options[document.myform.opttwo.selectedIndex].value);"> </div></form> </body> </html> So how do I get CHOSEN to equal the ID not the value ? Thanks Hi guys, I'm new to the forum, and new to JavaScipt. Here's my problem. I create a form dynamically with Java Script dependin on certail actions a user choose. The end result is a form asking the user to confirm sending one or more SMS message via a mesage gateway outside of my system. Confirmation will then trigger a funtion with one or more statements like this: [CODE] document.frmSMS.action ="http://www.infobip.com/Addon/SMSService/SendSMS.aspx?user=User&password=Password&sender=Sender&SMSText=Friendly Reminder from Joe Bloggs Pty Ltd: You have an outstanding amount of R 4,534.00 that is 135 days ovedue. Please settle to as soon possible.&IsFlash=0&GSM=27826555959"; document.frmSMS.submit(); [ICODE] The target site then responds with either an error code (i.e. -10) or a reference number. The question is - How do I retrieve the error code?? Your assistance will be appreciated. NicOos So, this is my last problem. If I can nail this, then the website will be completely AJAX driven, and will be spectacular. It took me a while to figure out just how to ask the question. lol Now it is really simple. 1) When I hit the button, in the simplified example below, the website sends a code to the server. 2) The server then re-writes the "xyz.js" JavaScript file with a new array of values. Is there any way to re-retrieve that JavaScript file, from the server to make it the current "xyz.js" rather than the old one that loaded on the client originally. I can get a new XML data file and re-submit that to the website, but how do I re-retrieve the new JavaScript code? Code: <html> <head> <script src="xyz.js" type="text/javascript"></script> </head> <body> <button onclick="onload();">Change</button> </body> </html> Good morning! I am Brazilian, sorry if there is a clerical error because I used the Google translator. I'm having trouble recovering in JS content of the columns of a <TABLE>. I did many searches but found nothing that could help me. I appreciate any help. Thank you! Manoel Zancheta Hello Everyone!!! I have a question, and any advise or help would be greatly appreciated. I know that ANCHORS situated on a page may be retrieved from another page using the method [a href="faq.html#here"]. How would I retrieve an ANCHOR within an IFRAME from another page. Below are my codes. Thank you all in advance, mbay -- [Help Page] <html><body><head><title>Help</title></head><table><tr><td>Below I will show an example of html. For those of you who don't know what HTML is, click <a href="faq_iframe.html#whatis"> here</a></td></tr><tr><td>Below I will show an example of tables. For those of you who don't know what tables are, click <a href="faq_iframe.html#table"> here</a></td></tr><tr><td>Below I will show an example of a hyperlink. For those of you who don't know what HYPERLINK is, click <a href="faq_iframe.html#hyper"> here</a></td></tr></table></body></html> -- [FAQ] <html><body><head><title>FAQ</title> <script language="javascript"> <!-- Hide the script from old browsers -- function surfto(form) { var myindex=form.dest.selectedIndex var passed = form.dest.options[myindex].value var acomma = passed.indexOf(",") var chars = passed.length var filename = passed.substring(0,acomma) var where = passed.substring(acomma+1,chars) if(filename != "") {window.open(filename, rel="nofollow" target=where)}; } //--> </script> </head><table><tr><td><form name="myform"><select class="pulldown" name="dest" size="1"><option>Select An Option</option><option value="faq_iframe.html#whatis,FAQ">What is HTML</option><option value="faq_iframe.html#table,FAQ">What are tables?</option><option value="faq_iframe.html#hyper,FAQ">What are hyperlinks?</option></select> <input type="button" value="GO!" onclick="surfto(this.form)"></form></td></tr><tr><td><IFRAME SRC="faq_iframe.html" Title="FAQ" SCROLLING="auto" NAME="FAQ" WIDTH="200" HEIGHT="200" ALIGN="center" FRAMEBORDER="no" style="border:15px ridge #0066FF"></IFRAME></td></tr></table></body></html> -- [FAQ IFRAME] <html><body><head><title>FAQ IFRAME</title></head><table><tr><td><font size="7">Welcome to the FAQ SECTION</font></td></tr><tr><td><a name="whatis"><b>What is Html?</b></a></td></tr><tr><td>HTML ( H yper T ext M arkup L anguage) is the language used to write Web pages. You are looking at a Web page right now. </td></tr><tr><td><a name="table"><b>What are tables?</b></a></td></tr><tr><td>Think of your tabular information in light of the coding explained below. A table has heads where you explain what the columns/rows include, rows for information, cells for each item. In the following table, the first column contains the header information, each row explains an HTML table tag, and each cell contains a paired tag or an explanation of the tag's function. </td></tr><tr><td><a name="hyper"><b>What are hyperlinks?</b></a></td></tr><tr><td>Hyperlinks are what connect the world wide web, without them we would get nowhere without knowing the exact URL (Universal Resource Locater) of the document we are looking for. Hyperlinks or more commonly just called "links" can do many things, but they always call for an action. A link could open your email client, it can move you to different pages or it can move you to different spots within the same document. </td></tr></table></body></html> Currently, this is my code: PHP Code: function createRow(){ $.post("php/qaRowEntry.php", { }, function(data){ $("#qaresultrowentry").text(data); test(); }); } It grabs visible data and $_SESSION data, that I know of it. However, I need to be able to retrieve or create variables based on the response. It would look like this: I run a code similar to the one above, and when I get the php script's response, javascript now has 3 filled variables that I can use. Is it possible? I saw one suggestion of setting async to false, but that it can cause the browser to hang. That's not an acceptable reaction. Thanks for your suggestions! |