|
JavaScript - Change Checkbox With Checkbox
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 Similar TutorialsHi Guys, How could I change Code: <a onclick="processForm();">Continue</a> to Code: <input type="checkbox" name="agree" value="1" onclick="if(this.checked).processForm();" /><label for="agree">Continue</label> or to Code: <input type="checkbox" name="agree" value="1" checked="checked" onchange="if(this.checked).processForm();" /><label for="agree">Continue</label> Code: <script type="text/javascript">
function processForm() {
$.ajax( {
type: 'POST',
url: '<?php echo $submit); ?>',
data: '<?php $data); ?>',
success: function(data) {
$('#message').html(data);
}
} );
}
</script>
when i Using <a onclick="processForm();">Continue</a> then work fine, but i needed the checkbox. Anyone could help me? im trying to figure out a script that when someone clicks my checkbox (or onchange/onclick events the span tag that wraps it) it changes the color of the font in the span tag... but then if they click again...for the color to return to normal heres my checkboxes as of the moment... disregard the sloppy multiple classes....i wanted to pad the elements evenly lol Code: <div id="selectform">
<span onclick="id='colorchange'" class="webspace"><input type="checkbox" value="website"> Website Design
</span>
<span class="reverbspace"> <input type="checkbox" value="reverb"> Reverb Nation </span>
<span class="twitspace"><input type="checkbox" value="twitter"> Twitter </span>
<span class="logospace"> <input type="checkbox" value="logo"> Logo/Branding </span>
<span class="soundclickspace"> <input type="checkbox" value="ning"> SoundClick </span>
<span class="photospace"> <input type="checkbox" value="photo"> Photo Retouch </span>
<span class="albumspace"><input type="checkbox" value="Album/Mixtape/DVD"> Mixtape/ DVD Cover</span>
<span class="ningspace"> <input type="checkbox" value="ning"> Ning WebSite </span>
<span class="flyerspace"> <input type="checkbox" value="flyer"> Flyers </span>
<span class="businessspace"> <input type="checkbox" value="Business card"> Business Card </span>
<span class="brochurespace"> <input type="checkbox" value="Brochure"> Brochure </span>
<span class="otherspace"> <input type="checkbox" > Other </span>
</div>
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 ! 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. 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> 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>
i have a checkbox: Code: <input type="checkbox" id="my_checkbox" name="option2" value="Check" checked>Check i want to add an event to it so that i do something to a dom element when it is checked and when it is not checked.What is the event and how can i get its status? 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 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 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 can someone help me on my code on javascript sory im a newbie can you check this and help me what i need to do to add all the radio botton and check box. i already finish the add formula on the checkbox but i do not know how to add the two selected radio buttons to my checkbox buttons help please... for example: O selected is 80 O 60 O 60 O selected is 15 O 15 O 25 chkbox 22 chkbox 30 chkbox 8 Code: function Compute(form)
{
if(form.radio1[0].checked)
form.text1.value=form.radio1[0].value; <---- the value of this is 80
else if(form.radio1[1].checked)
form.text1.value=form.radio1[1].value; <---- 60
else if(form.radio1[2].checked)
form.text1.value=form.radio1[2].value; <---- 60
else if(form.radio1[0].checked)
form.text1.value=form.radio1[0].value; <---- 15
else if(form.radio2[1].checked)
form.text1.value=form.radio2[1].value; <---- 15
else if(form.radio2[2].checked)
form.text1.value=form.radio2[2].value; <---- 25
var a=0;
if(form.chk1.checked) <----22
a = a + eval(form.chk1.value);
if(form.chk2.checked) <----30
a = a + eval(form.chk2.value);
if(form.chk3.checked) <----8
a = a + eval(form.chk3.value);
if(form.chk1.checked && form.chk2.checked)
a = eval(form.chk1.value) + eval(form.chk2.value);
if(form.chk1.checked && form.chk3.checked)
a = eval(form.chk1.value) + eval(form.chk3.value);
if(form.chk2.checked && form.chk1.checked)
a = eval(form.chk2.value) + eval(form.chk1.value);
if(form.chk2.checked && form.chk3.checked)
a = eval(form.chk2.value) + eval(form.chk3.value);
if(form.chk3.checked && form.chk1.checked)
a = eval(form.chk3.value) + eval(form.chk1.value);
if(form.chk3.checked && form.chk2.checked)
a = eval(form.chk3.value) + eval(form.chk2.value);
if(form.chk1.checked && form.chk2.checked && form.chk3.checked)
a = eval(form.chk1.value) + eval(form.chk2.value) + eval(form.chk3.value);
form.text1.value=a;
}
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 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!');
}
}
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");
}
}
}
Sorted. Close thread please. New problem in post below VVV All, I have the following code: Code: var poststr = "statusupdate=" + encodeURI( document.getElementById("statusupdate").value ) +
"&user_name=" + encodeURI( document.getElementById("user_name").value ) +
"&twitteryes=" + encodeURI ( document.getElementById("twitteryes").checked ) +
"¤tstatus=" + encodeURI( document.getElementById("currentstatus").value );
It seems to be failing on the Code: "&twitteryes=" + encodeURI (document.getElementById("twitteryes").checked )
If I remove the part I just showed it works fine. This is the HTML code: Code: <input type="checkbox" name="twitteryes" value="yesplease" /> Thanks in advance. |
|||||||