MikeyKs1 09-22-2011, 10:27 PM I need a pop-up window when the second child button is checked. I am having problems. Can you please help? Thank You!!
<script type="text/javascript">
function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block"
} else {
e.style.display="none"
}
return true;
}
</script>
<script type="text/javascript">
$('input[type=checkbox]').change(function() {
// get id of the current clicked element
var id = $(this).attr('id');
// find elements with classname 'parent-<id>' and (un)check them
var children = $('.parent-' + id).attr('checked', $(this).attr('checked'));
});
</script>
<script type="text/javascript">
function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block";
} else {
elms=e.getElementsByTagName("INPUT");
for(var i=elms.length;i--;){
if(elms[i].name=="cb1" || elms[i].name=="cb2")
elms[i].checked=false;
}
e.style.display="none";
}
return true;
}
</script>
</head>
<body>
<form name='f1' action='#'>
<h2 align="center">Request Form</h2><br>
<br>
<br>
<br>
Please check what you want.<br><br>
<input id="s1" type="checkbox" onclick="return toggleMe('para1')" value="1">1
<br>
<div id="para1" style="display:none">
<input id="b1"class="parent-s1" type="checkbox" name="cb1"/>
<label for="cb1">ABC</label><br>
<input type = "checkbox" class="parent-s1" name ="cb1" id ="b1" onclick ="newPage('http://www.your-url.com/your-page.htm')"> DEF
<script type = "text/javascript">
function newPage(page) {
if (document.getElementById("cb1").checked) {
OpenWin = this.open(page,"CtrlWindow","top=80,left=100,screenX=100,screenY=80,width=550,height=460,toolbar=no,menubar=no,location=no, scrollbars=no,resizable=yes");
return false;
}
}
function closepop() {if (OpenWin != null) OpenWin.close() }
window.onunload = closepop;
</script>
<br>
</div>
<input type="checkbox" onclick="return toggleMe('para2')" value="2">2
<br>
<div id="para2" style="display:none">
<input id="b2" class="parent-s2" type="checkbox" name="cb2"/>
<label for="cb2">GHI</label><br>
<input type = "checkbox" class="parent-s1" name ="cb2" id ="b2" onclick ="newPage('http://www.your-url.com/your-page.htm')"> JKL
<script type = "text/javascript">
function newPage(page) {
if (document.getElementById("cb2").checked) {
OpenWin = this.open(page,"CtrlWindow","top=80,left=100,screenX=100,screenY=80,width=550,height=460,toolbar=no,menubar=no,location=no, scrollbars=no,resizable=yes");
return false;
}
}
function closepop() {if (OpenWin != null) OpenWin.close() }
window.onunload = closepop;
</script>
<br>
</div>
<script type='text/javascript'>
function Cb2Rb( setRef )
{
this.boxGroup = setRef;
for( var i=0, len=setRef.length; i<len; i++ )
setRef[ i ].onclick=( function(inst, idx){return function(){inst.scan(idx)}} )(this, i);
this.scan=function(index)
{
if( this.boxGroup[ index ].checked )
for(var i=0, g=this.boxGroup, len=g.length; i<len; i++)
if( i != index )
g[i].checked = false;
}
}
new Cb2Rb( document.forms.f1.cb1 );
new Cb2Rb( document.forms.f1.cb2 );
</script>
<script type='text/javascript'>
function sub_delete{
if (typeof document.checks.cb.length === 'undefined') {
/*then there is just one checkbox with the name 'cb' no array*/
if (document.checks.cb.checked == true )
{
document.checks.submit();
return 0;
}
}else{
/*then there is several checkboxs with the name 'cb' making an array*/
for(var i = 0, max = document.checks.cb.length; i < max; i++){
if (document.checks.cb[i].checked == true )
{
document.checks.submit();
return 0;
}
}
}
}//sub_delete end
</script>
<script type='text/javascript'>
$('input[class*="parent"]').change(function(){
var cls = '.' + $(this).attr('class') + ':checked';
var len = $(cls).length;
var parent_id = '#' + $(this).attr('class').split('-')[1];
// 3. Check parent if at least one child is checked
if(len) {
$(parent_id).attr('checked', true);
} else {
// 2. Uncheck parent if all childs are unchecked.
$(parent_id).attr('checked', false);
}
});
</script>
DaveyErwin 09-23-2011, 02:12 PM [QUOTE=MikeyKs1;1138995]I need a pop-up window when the second child button is checked. I am having problems. Can you please help? Thank You!!
First thing, you have the functions toggleMe
and closepop defined twice, this is not good.
Second thing, $ is not defined in your code.
Put all your code in the head betwween
a single set of
<script type="text/javascript">
</script>
tags then post your new code
and we will try again to help you.
MikeyKs1 09-23-2011, 02:40 PM If I move "all" the code to the top between the
<script type="text/javascript">
</script>
tags the Parent checkboxes no longer expand and contract.
I am new at this and assumed that I needed the function closepop() under each parent checkbox given that the bottom child checkbox would popup it's own window. I changed the code to reflect that. If I'm still wrong please correct me.
<script type="text/javascript">
$('input[type=checkbox]').change(function() {
// get id of the current clicked element
var id = $(this).attr('id');
// find elements with classname 'parent-<id>' and (un)check them
var children = $('.parent-' + id).attr('checked', $(this).attr('checked'));
});
function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block";
} else {
elms=e.getElementsByTagName("INPUT");
for(var i=elms.length;i--;){
if(elms[i].name=="cb1" || elms[i].name=="cb2")
elms[i].checked=false;
}
e.style.display="none";
}
return true;
}
</script>
</head>
<body>
<form name='f1' action='#'>
<h2 align="center">Request Form</h2><br>
<br>
<br>
<br>
Please check what you want.<br><br>
<input id="s1" type="checkbox" onclick="return toggleMe('para1')" value="1">1
<br>
<div id="para1" style="display:none">
<input id="b1" class="parent-s1" type="checkbox" name="cb1"/>
<label for="cb1">ABC</label><br>
<input id="b1" class="parent-s1" type="checkbox" name="cb1" onclick="newPage('http://www.your-url.com/DEF instructions.htm')"> DEF
<script type = "text/javascript">
function newPage(page) {
if (document.getElementById("cb1").checked) {
OpenWin = this.open(page,"CtrlWindow","top=80,left=100,screenX=100,screenY=80,width=550,height=460,toolbar=no,menubar=no,location=no, scrollbars=no,resizable=yes");
return false;
}
}
</script>
<br>
</div>
<input type="checkbox" onclick="return toggleMe('para2')" value="2">2
<br>
<div id="para2" style="display:none">
<input id="b2" class="parent-s2" type="checkbox" name="cb2"/>
<label for="cb2">GHI</label><br>
<input id="b2" class="parent-s1" type="checkbox" name="cb2" onclick="newPage('http://www.your-url.com/JKL instructions.htm')"> JKL
<script type = "text/javascript">
function newPage(page) {
if (document.getElementById("cb2").checked) {
OpenWin = this.open(page,"CtrlWindow","top=80,left=100,screenX=100,screenY=80,width=550,height=460,toolbar=no,menubar=no,location=no, scrollbars=no,resizable=yes");
return false;
}
}
function closepop() {if (OpenWin != null) OpenWin.close() }
window.onunload = closepop;
</script>
<br>
</div>
<script type='text/javascript'>
function Cb2Rb( setRef )
{
this.boxGroup = setRef;
for( var i=0, len=setRef.length; i<len; i++ )
setRef[ i ].onclick=( function(inst, idx){return function(){inst.scan(idx)}} )(this, i);
this.scan=function(index)
{
if( this.boxGroup[ index ].checked )
for(var i=0, g=this.boxGroup, len=g.length; i<len; i++)
if( i != index )
g[i].checked = false;
}
}
new Cb2Rb( document.forms.f1.cb1 );
new Cb2Rb( document.forms.f1.cb2 );
</script>
<script type='text/javascript'>
function sub_delete{
if (typeof document.checks.cb.length === 'undefined') {
/*then there is just one checkbox with the name 'cb' no array*/
if (document.checks.cb.checked == true )
{
document.checks.submit();
return 0;
}
}else{
/*then there is several checkboxs with the name 'cb' making an array*/
for(var i = 0, max = document.checks.cb.length; i < max; i++){
if (document.checks.cb[i].checked == true )
{
document.checks.submit();
return 0;
}
}
}
}//sub_delete end
</script>
<script type='text/javascript'>
$('input[class*="parent"]').change(function(){
var cls = '.' + $(this).attr('class') + ':checked';
var len = $(cls).length;
var parent_id = '#' + $(this).attr('class').split('-')[1];
// 3. Check parent if at least one child is checked
if(len) {
$(parent_id).attr('checked', true);
} else {
// 2. Uncheck parent if all childs are unchecked.
$(parent_id).attr('checked', false);
}
});
</script>
MikeyKs1 09-28-2011, 03:40 PM Obliviously I don’t know what I’m doing so I ask for help. I still don’t see what I have done wrong. Would you please help me?
Sujay Shinoda 09-28-2011, 05:33 PM something like this! http://rainbow.arch.scriptmania.com/scripts/age_redirect.html:thumbsup:
MikeyKs1 09-28-2011, 05:56 PM something like this! http://rainbow.arch.scriptmania.com/scripts/age_redirect.html:thumbsup:
Not even close but thanks for trying to find something.
This is what I have so far but something is still wrong!
<script type="text/javascript">
$('input[type=checkbox]').change(function() {
// get id of the current clicked element
var id = $(this).attr('id');
// find elements with classname 'parent-<id>' and (un)check them
var children = $('.parent-' + id).attr('checked', $(this).attr('checked'));
});
function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block";
} else {
elms=e.getElementsByTagName("INPUT");
for(var i=elms.length;i--;){
if(elms[i].name=="chk1" || elms[i].name=="chk2")
elms[i].checked=false;
}
e.style.display="none";
}
return true;
}
</script>
</head>
<body>
<form name='f1' action='#'>
<h2 align="center">Request Form</h2><br>
<br>
<br>
<br>
Please check what you want.<br><br>
<input id="s1" type="checkbox" onclick="return toggleMe('para1')" value="1">1
<br>
<div id="para1" style="display:none">
<input id="chk1" type="checkbox" class="parent-s1" name="chk1"/>
<label for="chk1">ABC</label><br>
<input id="chk1" type="checkbox" class="parent-s1" name="chk1" onclick="newPage('http://www.yourPopUppageDEF.com')"> DEF
</script>
<br>
</div>
<input id="s2" type="checkbox" onclick="return toggleMe('para2')" value="2">2
<br>
<div id="para2" style="display:none">
<input id="chk2" type="checkbox" class="parent-s2" name="chk2"/>
<label for="chk2">GHI</label><br>
<input id="chk2" type="checkbox" class="parent-s2" name="chk2" onclick="newPage('http://www.yourPopUppageJKL.com')"> JKL
</div>
<script type = "text/javascript">
function newPage(page) {
if (document.getElementById("chk1","chk2").checked) {
OpenWin = this.open(page,"CtrlWindow","top=80,left=100,screenX=100,screenY=80,width=550,height=460,toolbar=no,menubar=no,location=no, scrollbars=no,resizable=yes");
return false;
}
}
</script>
<script type = "text/javascript">
function Cb2Rb( setRef )
{
this.boxGroup = setRef;
for( var i=0, len=setRef.length; i<len; i++ )
setRef[ i ].onclick=( function(inst, namex){return function(){inst.scan(namex)}} )(this, i);
this.scan=function(index)
{
if( this.boxGroup[ index ].checked )
for(var i=0, g=this.boxGroup, len=g.length; i<len; i++)
if( i != index )
g[i].checked = false;
}
}
new Cb2Rb( document.forms.f1.chk1 );
new Cb2Rb( document.forms.f1.chk2 );
</script>
<script type='text/javascript'>
function sub_delete{
if (typeof document.checks.chk.length === 'undefined') {
/*then there is just one checkbox with the name 'chk' no array*/
if (document.checks.chk.checked == true )
{
document.checks.submit();
return 0;
}
}else{
/*then there is several checkboxs with the name 'chk' making an array*/
for(var i = 0, max = document.checks.chk.length; i < max; i++){
if (document.checks.chk[i].checked == true )
{
document.checks.submit();
return 0;
}
}
}
}//sub_delete end
</script>
<script type='text/javascript'>
$('input[class*="parent"]').change(function(){
var cls = '.' + $(this).attr('class') + ':checked';
var len = $(cls).length;
var parent_id = '#' + $(this).attr('class').split('-')[1];
// 3. Check parent if at least one child is checked
if(len) {
$(parent_id).attr('checked', true);
} else {
// 2. Uncheck parent if all childs are unchecked.
$(parent_id).attr('checked', false);
}
});
</script>
MikeyKs1 09-29-2011, 05:33 PM It all works correctly now except that checkbox JKL pop-up only works if checkbox DEF is checked and when you uncheck checkbox JKL the pop-up pops up a second time.
<script type="text/javascript">
$('input[type=checkbox]').change(function() {
// get id of the current clicked element
var id = $(this).attr('id');
// find elements with classname 'parent-<id>' and (un)check them
var children = $('.parent-' + id).attr('checked', $(this).attr('checked'));
});
function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block";
} else {
elms=e.getElementsByTagName("INPUT");
for(var i=elms.length;i--;){
if(elms[i].name=="chk1" || elms[i].name=="chk2" || elms[i].name=="chk3" || elms[i].name=="chk4")
elms[i].checked=false;
}
e.style.display="none";
}
return true;
}
</script>
</head>
<body>
<form name='f1' action='#'>
<h2 align="center">Request Form</h2><br>
<br>
<br>
<br>
Please check what you want.<br><br>
<input id="s1" type="checkbox" onclick="return toggleMe('para1')" value="1">1
<br>
<div id="para1" style="display:none">
<input id="chk1" type="checkbox" class="parent-s1" name="chk1"/>
<label for="chk1">ABC</label><br>
<input id="chk2" type="checkbox" class="parent-s1" name="chk2" onclick="newPage('http://www.yourPopUppageDEF.com')"> DEF
</script>
<br>
</div>
<input id="s2" type="checkbox" onclick="return toggleMe('para2')" value="2">2
<br>
<div id="para2" style="display:none">
<input id="chk3" type="checkbox" class="parent-s2" name="chk3"/>
<label for="chk2">GHI</label><br>
<input id="chk4" type="checkbox" class="parent-s2" name="chk4" onclick="newPage('http://www.yourPopUppageJKL.com')"> JKL
</div>
<script type = "text/javascript">
function newPage(page) {
if (document.getElementById("chk2","chk4").checked) {
OpenWin = this.open(page,"CtrlWindow","top=80,left=100,screenX=100,screenY=80,width=550,height=460,toolbar=no,menubar=no,location=no, scrollbars=no,resizable=yes");
return false;
}
}
</script>
<script type = "text/javascript">
function Cb2Rb( setRef )
{
this.boxGroup = setRef;
for( var i=0, len=setRef.length; i<len; i++ )
setRef[ i ].onclick=( function(inst, namex){return function(){inst.scan(namex)}} )(this, i);
this.scan=function(index)
{
if( this.boxGroup[ index ].checked )
for(var i=0, g=this.boxGroup, len=g.length; i<len; i++)
if( i != index )
g[i].checked = false;
}
}
new Cb2Rb( document.forms.f1.chk2 ),( document.forms.f1.chk4 );
</script>
<script type='text/javascript'>
function sub_delete{
if (typeof document.checks.chk.length === 'undefined') {
/*then there is just one checkbox with the name 'chk' no array*/
if (document.checks.chk.checked == true )
{
document.checks.submit();
return 0;
}
}else{
/*then there is several checkboxs with the name 'chk' making an array*/
for(var i = 0, max = document.checks.chk.length; i < max; i++){
if (document.checks.chk[i].checked == true )
{
document.checks.submit();
return 0;
}
}
}
}//sub_delete end
</script>
<script type='text/javascript'>
$('input[class*="parent"]').change(function(){
var cls = '.' + $(this).attr('class') + ':checked';
var len = $(cls).length;
var parent_id = '#' + $(this).attr('class').split('-')[1];
// 3. Check parent if at least one child is checked
if(len) {
$(parent_id).attr('checked', true);
} else {
// 2. Uncheck parent if all childs are unchecked.
$(parent_id).attr('checked', false);
}
});
</script>
MikeyKs1 10-11-2011, 09:33 PM Well from the activity on this board I'm going to assume that this cannot be accomplished using JavaScript .
speE67ight 10-12-2011, 09:51 AM <script type="text/javascript">
$('input[type=checkbox]').change(function() {
// get id of the current clicked element
var id = $(this).attr('id');
// find elements with classname 'parent-<id>' and (un)check them
var children = $('.parent-' + id).attr('checked', $(this).attr('checked'));
});
function toggleMe(a){
var e=document.getElementById(a);
if(!e)return true;
if(e.style.display=="none"){
e.style.display="block";
} else {
elms=e.getElementsByTagName("INPUT");
for(var i=elms.length;i--;){
if(elms[i].name=="cb1" || elms[i].name=="cb2")
elms[i].checked=false;
}
e.style.display="none";
}
return true;
}
</script>
</head>
<body>
<form name='f1' action='#'>
<h2 align="center">Request Form</h2><br>
<br>
<br>
<br>
Please check what you want.<br><br>
<input id="s1" type="checkbox" onclick="return toggleMe('para1')" value="1">1
<br>
<div id="para1" style="display:none">
<input id="b1" class="parent-s1" type="checkbox" name="cb1"/>
<label for="cb1">ABC</label><br>
<input id="b1" class="parent-s1" type="checkbox" name="cb1" onclick="newPage
speE67ight 10-12-2011, 09:54 AM I'm going to assume that this cannot be accomplished using JavaScript
MikeyKs1 10-18-2011, 04:32 PM You need to put inside code tags by hiting the # button above the message box and placing your code between the created brackets
|
|