|
JavaScript - Undefined Checkbox
I am using a checkbox to turn on and off some labels on a line on a google map, which is working fine if the line is already drawn, using this function:
Code: function distboxclick(labelsbox) {
if (labelsbox.checked) {
for (var i=0; i<distmarkers.length; i++) {
if (distmarkers[i].mLabel != null) distmarkers[i].mLabel.show();
}
} else {
for (var i=0; i<distmarkers.length; i++) {
if (distmarkers[i].mLabel != null) distmarkers[i].mLabel.hide();
}
}
}
but the thing is that I want the labels to be turned off to begin with and switched on if the box is checked. Which is also fine, using this snippet: Code: if (prevMarker){
var dist = getSegmentDistance(prevMarker.mMarker, distmarker);
var label = new ELabel(point, dist, "labelstyle", new GSize(10,-15));
distmarkers[numMarkers-1].mLabel = label;
distlabels.push(label);
map.addOverlay(label);
label.hide();
drawOverlay();
}
but what I am trying to do now is make sure that if the box is checked before the line starts to be drawn then the labels will come up straight away. So I figured all I had to do was add in the following to the above: Code: if (labelsbox.checked){
label.show(); }
else {
label.hide(); }
and pass the labelsbox variable to the function where that is all happening. But instead I get a "labelsbox is undefined" error... If I take that if statement out I see that labelsbox is defined, but that doesn't really help. I guess I'm putting things in the wrong order or something, but I'm kind of baffled. You can see my test page here. Thanks in advance for any suggestions. Similar TutorialsHi.. I have checkbox and I need to get his value. I create function for checkbox if checkbox is clicked it is true then the checkbox value is H else W. Code: function chk(){
if(document.getElementById('H').checked==true){
var H = document.getElementById('H'). value = H;
}
else if(document.getElementById('H').checked==false){
var H = document.getElementById('H'). value = W;
}
}
and I have function for save : Code: function ApproveLeaveOP(){
var H = document.getElementById('H').value;
document.sampleform.action="AddLeave.php?H="+H;
document.sampleform.submit();
}
<input type="checkbox" name="H" id="H" value="" onclick="chk()">
I don't know how can I add value to the checkbox if I click the value will be H if not the value is W. I am new in using checkbox. Thank you so much.. Hello guys, The following excerpt is part of a very huge project(in terms of code involved). Pardon me if it lacks a bit of context. But I assume I have posted adequate information for understanding the problem. Code: var sztitlebar_specific= "<table cellpadding='0px' cellspacing='0px' width='100%'><tr>" +"<td class='tiletitle'>" "<img src='../images/alert.gif' onclick='toggleAlerts(\"#ID#\")' alt='Toggle Alerts' title='Toggle Alerts' style='cursor: hand'>" + "<input type='checkbox' name='pricesonlycb' onclick='parent.applyFilterPricesOnly(\"#ID#\",pricesonlycb.checked,mypricesonlycb.checked,\"#NAME#\")'>" + "<input type='checkbox' name='mypricesonlycb' onclick='parent.applyFilterPricesOnly(\"#ID#\",pricesonlycb.checked,mypricesonlycb.checked,\"#NAME#\")'>" + "<td class='tiletitle' style='text-align: center'>#NAME#</td>" + </tr></table>"; The onclick event fires without any trouble, and the following function is called. Code: function applyFilterPricesOnly(filterid, pricesonly, mypricesonly,filtername){
alert("applyFilterPricesOnly called: filterid =" + filterid + "filtername =" + filtername + "mypricesonly =" + mypricesonly + " pricesonly=" + pricesonly);
}
But when I alert the status of the checkboxes they show up as "undefined". As you can see, the first piece of code defines a titlebar with a button and a couple of checkboxes and the name of the titlebar. And it is these checkboxes that remain undefined even though I can see them and check and uncheck them. But the name of the titlebar gets passed to the function correctly when the onclick event fires and it gets alerted. Where am I going wrong? 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 Looking for a simple method to Toggle textbox yes/no using CheckBox This example does not work! But I hope this will help explain what I am trying to do Code: <SCRIPT LANGUAGE="JavaScript">
function YesOrNo() {
if(document.formname.checkboxname.checked)
{
document.formname.textname.disabled='Yes';
}
else
{
document.formname.textname.disabled='No';
}}
</SCRIPT>
<form name="formname">
<input type="text" size="10" name="textname">
<input type="checkbox" onclick="YesOrNo()" name="checkboxname" value="Yes">
</form>
Hi, I have a checkbox and when I "check" I want to add a <p> inside of an <div> and when I "uncheck" I want to remove the <p> from <div>. I've tried this but it's not working Code: $('#checkbox').change(function(){
$('div').html('<p>Some Text</p>');
}, function() {
$('div').remove('<p>Some Text</p>');
});
I hope you can help.. Regards I am making a google CSE for a client site and I need to concatenate checkbox values together on the end of another form value. So I have a text box and the checkboxes: Code: <input name="q" cid="q" size="25" maxlength="50" value"off road tires"> <input type="checkbox" name="q" id="q" value="cooper|hankook" /> <input type="checkbox" name="q" id="q" value="Mickey Thompson|Bfgoodrich|GBC" /> <input type="checkbox" name="q" id="q" value="Hoosier|Nitto" /> For Google the URL string needs to be like this: Code: results.html?q=off road tires AND inurl:cooper|hankook|Mickey Thompson|Bfgoodrich|GBC this string says the person did not check the last box. I am having a hard time trying to do this. If you guys know a better way to accomplish the same thing I am all ears but I thought I would bring it to the experts and see what they had to say. Thanks for the help! I was trying to get total amount from these all checkbox, when I submit, but I don't know somewhere wrong. Please help me out. Here is my code: <html xmlns = "http://www.w3.org/1999/xhtml"> <head> <title> Form </title> <script language = "JavaScript"> // The event handler functions for the check boxes function appleHandler() { var number = document.orderForm.apples.value; total = total + number * 0.59; } function orangeHandler() { var number = document.orderForm.oranges.value; total = total + number * 0.49; } function bananaHandler() { var number = document.orderForm.bananas.value; total = total + number * 0.39; } // The event handler function to produce the total cost message // when "submit" is clicked function finish() { total = total * 1.05; alert("Thank you for your order \n" + "Your total cost is: $" + total + "\n"); } </script> </head> <body> <h3> Order Form </h3> <form name = "orderForm" onSubmit = "finish()"> <p> <input type = "checkbox" name = "apples" size = "3" onClick = "appleHandler()" /> Apples </p><p> <input type = "checkbox" name = "oranges" size = "3" onClick = "orangeHandler()" /> Oranges </p><p> <input type = "checkbox" name = "bananas" size = "3" onClick = "bananaHandler()" /> Bananas </p><p> <input type = "reset" name = "reset" /> <input type = "submit" name = "submit" /> </p> </form> </body> </html> I was playing around with JavaScript today, just seeing if I could make image rollovers. I successfully switched out the first image, but I couldn't get it switched out with the original. My code: Code: window.onload = initAll;
function initAll()
{
// var nav = document.getElementById("navigation");
var patt = /^http:\/\/www\.[a-z\/\.-]+\.jpe?g$/i;
for (var i = 0; i < document.images.length; i++)
{
if (patt.test(document.images[i].src))
{
document.images[i].onmouseover = switchy;
var newbySrc = document.images[i].src;
document.images[i].onmouseout = function() { UNswitchy(newbySrc); }
}
}
}
function switchy()
{
var newbert = new Image();
// the image below is the same one for every image, as I'm just testing
newbert.src = "http://www.hogwarts-rpg.net/images/buttons/home.jpg";
this.src = newbert.src;
}
function UNswitchy(myImgSrc)
{
var newBern = new Image();
newBern.src = myImgSrc;
this.src = newBern.src;
}
Since taking the mouse off the image wouldn't switch it back, I guessed that the UNswitchy() function was messing up. So, I commented out the code in there and added alert(), and alert() told me that this.src (in UNswitchy()) was undefined. Why would it be, since it worked fine in switchy()? I have two google maps loading on my page. The first loads with a body onload call the second when a button is clicked. After the button is clicked I get the error message "map is not defined". I have reviewed my code and I can not see where I have forgotten to define a var (if I am understanding the error messaage correctly - I assume that is the problem)". My code is: Code:
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
<style type="text/css">
html {height:250px}
body {height:250px}
#map_canvas {width:30%; height:250px;}
#placemap_canvas {width:100%; height:250px;}
</style>
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=true" />
</script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng (
<?php
include("dbconnect.php");
$result = mysql_query("SELECT * FROM countries
WHERE Country='{$_SESSION['Country']}'");
while($row = mysql_fetch_array($result)){
echo $row['Map'];
}
mysql_close($con);
?>);
var myOptions = {
zoom: 4,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
}
</script>
//Here starts the code for the second map called by a button click
<script type="text/javascript">
var geocoder;
var submap;
function createGMapFromAddress(){
geocoder = new google.maps.Geocoder();
var sublatlng = new google.maps.LatLng(0,0);
var map_options = {
zoom: 4,
center: sublatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var submap = new google.maps.Map(document.getElementById("placemap_canvas"), map_options);
}
function codeAddress(location){
alert(location);
var address = location;
alert(address);
geocoder.geocode({address: address}, function(results, status){
if (status == google.maps.GeocoderStatus.OK && results.length){
if (status != google.maps.GeocoderStatus.ZERO_RESULTS){
map.set_center(results[0].geometry.location);
}
} else {
alert("Geocode was unsuccessful due to: " + status);
}
});
}
</script>
Hi everyone; I have created a JavaScript function to show either a enabled or a disabled text input field depending on whether a checkbox has been clicked or not. It works great for that purpose. However, when I use it for more than one text input field and I submit the form, it goes back to its disabled form. This is a problem if you by mistake submit the form without filling all the fields. As I said, the submit button makes the form go disabled. Is there a way to either not have the form go disabled after submission or to have a "Oncheck" function so I can use $_SESSION to keep the checked attribute? Thanks in advance for all your help Code: <html>
<head>
<style type="text/css">
#Active {
display:none;
}
</style>
<script type="text/javascript">
function toggle() {
if (document.getElementById) {
if (document.getElementById("checkbox").checked == true) {
document.getElementById("Active").style.display = "block";
document.getElementById("Inactive").style.display = "none";
} else {
document.getElementById("Inactive").style.display = "block";
document.getElementById("Active").style.display = "none";
}
}
}
</script>
</head>
<body>
<?php
echo "Add Field";
echo "<input type=\"checkbox\" name=\"check\" id=\"checkbox\" onClick=\"toggle();\" value=\"v\"/>";
echo "<form method=\"post\">";
echo "<div id=Active>";
if(isset($_SESSION['test']) && $_SESSION['test']!="")
{
echo "<input name=\"test\" value=\"". $_SESSION['test']."\" type=\"text\" />";
}
elseif(isset($_POST['test']) && $_POST['test']!="")
{
echo "<input name=\"test\" value=\"". $_POST['test']."\" type=\"text\"/>";
}
else
{
echo "<input name=\"test\" type=\"text\"/>";
}
echo "<input type=\"text\" name=\"test2\" >";
echo "</div>";
echo "<div id=Inactive>";
echo "<input type=\"text\" disabled>";
echo "<input type=\"text\" disabled>";
echo "</div>";
echo "<input type=\"submit\">";
echo "</form>";
$test = $_POST['test'];
$_SESSION = $_POST['test'];
$test2 = $_POST['test2'];
$_SESSION = $_POST['test2'];
echo $test;
?>
</body>
</html>
Hi, I want to check all checkboxes using one main checkbox. Then, the checkboxes will be disabled. But then, when the user unchecks the main checkbox, it must revert all the checkboxes to be enabled. How do I do so? 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">
<head>
<title>TSPL Admin</title>
<script type='text/javascript'>
function checkUncheckAll(checkAllState, chkbxGroup)
{
// Check that the group has more than one element
if(chkbxGroup.length > 0)
{
// Loop through the array
for (i = 0; i < chkbxGroup.length; i++)
{
chkbxGroup[i].checked = checkAllState.checked;
}
document.getElementById("Checkbox7").disabled = true;
document.getElementById("Checkbox8").disabled = true;
document.getElementById("Checkbox9").disabled = true;
document.getElementById("Checkbox10").disabled = true;
document.getElementById("Checkbox11").disabled = true;
document.getElementById("Checkbox12").disabled = true;
document.getElementById("Checkbox13").disabled = true;
document.getElementById("Checkbox14").disabled = true;
}
else
{
// Single element so not an array
chkbxGroup.checked = checkAllState.checked;
}
}
</script>
<style type ="text/css">
.style42
{
border-style: solid;
border-width: 1px;
margin-left: 10px;
width: 135px;
border-color: #8181F7;
text-align: left;
float:left;
}
.style45
{
float: left;
}
</style>
</head>
<body>
<form id="form1" method="post" action="default.aspx">
<br />
<div class="style19">
<tr>
<td align="left">
<div class="style45">
<input id="Checkbox6" name="checkall" onclick="checkUncheckAll(this, grp1);" type="checkbox" />All
</div>
<div class="style42">
<input name="grp1" id="Checkbox7" type="checkbox" />Account Admin<br />
<input name="grp1" id="Checkbox8" type="checkbox" />Network Admin<br />
<input name="grp1" id="Checkbox9" type="checkbox" />Organization Admin<br />
<input name="grp1" id="Checkbox10" type="checkbox" />Super Admin<br />
</div>
<div class="style42">
<input name="grp1" id="Checkbox11" type="checkbox" />Schema Admin<br />
<input name="grp1" id="Checkbox12" type="checkbox" />Troubleshooting Admin<br />
<input name="grp1" id="Checkbox13" type="checkbox" />Helpdesk Admin<br />
<input name="grp1" id="Checkbox14" type="checkbox" />Online Admin<br />
</div>
</td>
</tr>
</div>
</form>
</body>
</html>
Hi thier, I am using PHP to generate a page with a list of checkbox's on it. Then I am using JavaScript to validate that the user has selected at lest 1 of the given box's before I do a post back. But I cannot get my Javascript to see my CheckBox Array. Any help you can offer would be very useful thank you all in advance. Here is my PHP code used to build to Checkbox list. Code: while ($row = mysql_fetch_array($data, MYSQL_ASSOC))
{
if(is_null($row['Team_Number']))
{
$str1 = sprintf('<input type="checkbox" name=\'People\' value="%s">',$row['Member_ID']);
}
else if($row['Team_Number'] == $_REQUEST['T'])
{
str1 = sprintf('<input type="checkbox" name=\'People\' value="%s" checked>',$row['Member_ID']);
}
else
{
$str1 = sprintf('<input type="checkbox" name=\'People\' value="%s">',$row['Member_ID']);
}
$str = sprintf('%s,%s (%s)',$row['First'],$row['Last'],$row['Nick_Name']);
echo('<tr><td width ="10%" align="center">');
echo($str1);
echo('</td><td width="90%" align="Left">');
echo($str);
echo('</td >');
echo('</tr></td>');
}
And here is my Javascript, I've added the whole function incase it's not clear just from a code segment. Code: function TeamSetup()
{
var required = document.form1.BowlersPerTeam.value;
var total = document.form1.People.length;
var Tm = document.form1.TeamName.value;
var cnt = 0;
var peopleIDs = "";
var test = document.getElementsByName('People');
if(isArray(document.form1.People))
{
for(var i=0; i < total; i++)
{
if(document.form1.People[i].checked)
{
if(peopleIDs.length > 0)
{
peopleIDs = peopleIDs +",";
}
peopleIDs = peopleIDs + document.form1.People[i].value.toString();
cnt++;
}
}
}
else
{
if(document.form1.People.checked)
{
cnt=1;
peopleIDs = peopleIDs + document.form1.People.value.toString();
}
}
if(Tm.length > 0)
{
if(cnt == required || cnt > 0)
{
//Hand off to next step for completeing Processing.
var myForm = document.createElement("form");
myForm.action=window.location;
myForm.method="Post";
myForm.appendChild(createformInput("Process","PP"));
myForm.appendChild(createformInput("people",peopleIDs));
myForm.appendChild(createformInput("Team",GetQueryString("T")));
myForm.appendChild(createformInput("League",GetQueryString("L")));
myForm.appendChild(createformInput("TeamName",Tm));
document.body.appendChild(myForm);
myForm.submit();
}
else
{
alert('You need to Select at least 1 player');
}
}
else
{
alert('You need to enter the team name!');
}
}
Sorted. Close thread please. New problem in post below VVV Hi, I have the following codes but my checkbox is not appearing. The values of the checkbox do print out in the alert. Can anyone tell me what is wrong with it? Thank you! Code: var table = document.getElementById('maintable');
var i; // iterator
var item; // pointer to item in received list
for(i = 0;
(item = contacts.ReturnValue.getNext()) != undefined;
++i) {
table.insertRow(i + 1);
var result = "<td>";
if(item.FirstName != undefined) {
result += item.FirstName.Value;
}
result += "</td><td>";
if(item.LastName != undefined) {
result += item.LastName.Value;
}
result += "</td><td>";
if(item.MobilePhoneGen != undefined) {
result += item.MobilePhoneGen.Value;
}
result += "</td><td>";
if(item.EmailGen != undefined) {
result += item.EmailGen.Value;
}
var td1 = document.createElement("td");
var chkbox = document.createElement('input');
chkbox.type='Checkbox';
table.rows[i + 1].innerHTML = result;
chkbox.value=item.MobilePhoneGen.Value;
td1.appendChild(chkbox);
alert(chkbox.value);
}
Firebug returns an error saying msg.elements is undefined. I'm trying to make a function that will enabled a delete button if any of the check boxes in a list are checked. Code: function selectone () {
var msg = document.getElementsByName('pm');
var i = 0;
for(i; i < msg.elements.length; i++)
{
if(msg.elements[i].checked == true)
{
document.getElementById('multiple_action').disabled = false;
document.getElementById('drop_button').setAttribute("class", "drop_button");
}
else
{
document.getElementById('multiple_action').disabled = true;
document.getElementById('drop_button').setAttribute("class", "drop_button disabled");
}
}
}
Hi all, Can anyone point me in the right direction for some sample code that when the selection on a checkbox changes, either writes or removes some content? In this instance, when the checkbox is unchecked, I want more table rows and columns written with the relevant data within them. Then when checked, I want this data removed. Many thanks Hello I have a site of classifieds ads.... user is choosing what he want to see/search and then a table is printed on the screen(with all the requested results) My question is... Is there a way to add a "CHECK BOX" to each of the ads and the user is checking what he wants to see later on. after he will have a button "see my checked ads" and a page will open with ONLY the ads that he checked before Any suggestions? Thanks a lot Danny Hey guys, I am having a bit of an issue here. I have a form which has 3 checkboxes in it: (sorry, ignore the asp) Code: <input name="certs" id="certs" type="checkbox" <% If certs="on" Then Response.Write("checked=""checked""") %> />
<input name="nocerts" id="nocerts" type="checkbox" <% If nocerts="on" Then Response.Write("checked=""checked""") %> />
<input name="certsna" id="certsna" type="checkbox" <% If certsna="on" Then Response.Write("checked=""checked""") %> />
Anyways, I want to enforce the following: - Only one checkbox can be checked from these 3, no more - At least one checkbox must be checked before submission I have found a couple small scripts to validate that at least one is pressed, but I do not know how to make sure no more than one is pressed, and how to combine scripts is beyond me. Can anyone offer any assistance? Is this difficult to do? Hello all, I usually try and solve my problems by reading all post but i i'm having problem trying to find a solution my problem. I have a simple form in html which presents to the user 2 checkbox's named cash or cheque depending on which answer he gives will present to him 2 different textbox. My problem is i only want the user to be able to select one of the two checkboxes and also i would like the resulting checkbox selected to be placed on the same row. Hope this makes sense!!! I'm only a beginner in javascript and i've found some of the following code on the net but i don't know how to ammend it so that it does what i need it to do. Here is the code: Code: <HTML>
<HEAD>
<TITLE>Document Title</TITLE>
<script>
<!--
function c(){}
function getresultPay(){
if(document["schDetails"]["chkCash"].checked){
document.getElementById("shwCash").style.visibility="visible"
}
else{
document.getElementById("shwCash").style.visibility="hidden"
}
}
function d(){}
function getresultChex(){
if(document["schDetails"]["chkcheque"].checked){
document.getElementById("shwcheque").style.visibility="visible"
}
else{
document.getElementById("shwcheque").style.visibility="hidden"
}
}
//-->
</script>
</HEAD>
<BODY>
<FORM NAME="schDetails">
<table border="1" width="457">
<tr>
<td width="447" align="left" colspan="5" height="12"></td>
</tr>
<tr>
<td width="187" align="left" height="22">Amount to Pay</td>
<td width="26" align="center" height="22">:</td>
<td width="221" height="22" colspan="3">
<input type = text name ="txtPurCode" tabindex= 25 size="20"></td>
</tr>
<tr>
<td width="187" align="left" height="20">How would you like to pay</td>
<td width="26" height="20" align="center"><input type="checkbox" name="chkCash" value="ON" onclick = "c() ; getresultPay()"></td></td>
<td width="66" height="20" align="center">Cash</td>
<td width="35" height="20" align="center"><input type="checkbox" name="chkcheque" value="ON" onclick = "d() ; getresultChex()"></td></td>
<td width="108" height="20" align="center">Cheque</td>
</tr>
<tr id="shwCash" style="visibility:hidden">
<td width="187">Cash to Pay</td>
<td width="26" align="center" height="22">:</td>
<td width="221" colspan="3">
<input type = text name ='txtGRTNo' tabindex = 19 size="20"></td>
</tr>
<tr id="shwcheque" style="visibility:hidden">
<td width="187">Cheque to Pay</td>
<td width="26" align="center" height="22">:</td>
<td width="221" colspan="3">
<input type = text name ='txtGRTNo' tabindex = 19 size="20"></td>
</tr>
<tr>
<td width="447" align="left" colspan="5" height="12"></td>
</tr>
</table>
</FORM>
</BODY>
</HTML>
I would really appricate if someone could solve this for me. Regards |
|||||||