PDA

View Full Version : copy total to textbox then reset form except for copied total



HippieChickie
06-12-2015, 07:06 PM
hello

i have several checkboxes that hold a value. when the checkbox is checked a running total is kept.
when user is done, they click one of 4 buttons. the textbox above the button should now have the total in it.

the user would then hit reset & the form would reset EXCEPT for any of the textboxes that are storing the user saved totals.

i have tried several diff ways with diff codes i have found but nothing will make it copy over & keep it there as hitting reset clears the whole form.


<script type="text/javascript">
<!--
onload = function () {
var e, i = 0;
while (e = document.myform.elements[i++]) {
if (e.type == 'checkbox') e.onclick = function () {
var e, i = 0, total = 0;
while (e = document.myform.elements[i++]) {
if (e.type == 'checkbox' && e.checked) total += Number (e.value) || 0;
document.myform.elements.total.value = total;
}
}
}
}
// -->
</script>

<script type="text/javascript">
function copyOne(cbox)
{
if(document.getElementById('bone').clicked == true) {
document.getElementById("one").value = document.getElementById("total").value;

}

}</script>



<body>



<form name="myform" action="checkboxes.asp" method="post">
&nbsp;


<fieldset>

<div align="center">
<center>
<table border="0" cellpadding="0" cellspacing="0" width="68%" height="135">
<tr>
<td width="11%" align="center" height="43"></td>
<td width="11%" align="center" height="43"></td>
<td width="11%" align="center" height="43"></td>
<td width="11%" align="center" height="43">

</td>
<td width="11%" align="center" height="43"></td>
<td width="11%" align="center" height="43"></td>
<td width="11%" align="center" height="43"></td>
</tr>
<tr>
<td width="11%" align="center" height="23">
<input type="text" name="one" id="one" size="3" readonly="readonly">
</td>
<td width="11%" align="center" height="23">
<input type="text" name="two" id="two" size="3" readonly="readonly">
</td>
<td width="11%" align="center" height="23"></td>
<td width="11%" align="center" height="23"><label>Total: <input type="text" name="total" id="total" class="num" size="3" value="0" readonly="readonly" /></label>


</td>
<td width="11%" align="center" height="23"></td>
<td width="11%" align="center" height="23">
<input type="text" name="three" id="three" size="3" readonly="readonly">
</td>
<td width="11%" align="center" height="23">
<input type="text" name="four" id="four" size="3" readonly="readonly">
</td>
</tr>
<tr>
<td width="11%" align="center" height="21"><input type="button" value="ONE" name="one" id="bone"></td>
<td width="11%" align="center" height="21"><input type="button" value="TWO" name="two" id="btwo"></td>
<td width="11%" align="center" height="21"></td>
<td width="11%" align="center" height="21"></td>
<td width="11%" align="center" height="21"></td>
<td width="11%" align="center" height="21"><input type="button" value="THREE" name="three" id="bthree"></td>
<td width="11%" align="center" height="21"><input type="button" value="FOUR" name="four" id="bfour"></td>
</tr>
<tr>
<td width="11%" align="center" height="27">
</td>
<td width="11%" align="center" height="27">
</td>
<td width="11%" align="center" height="27"></td>
<td width="11%" align="center" height="27">
<input type="reset" value="Reset" name="reset">
</td>
<td width="11%" align="center" height="27"></td>
<td width="11%" align="center" height="27">
</td>
<td width="11%" align="center" height="27">
</td>
</tr>
<tr>
<td width="11%" align="center" height="21"></td>
<td width="11%" align="center" height="21"></td>
<td width="11%" align="center" height="21"></td>
<td width="11%" align="center" height="21"></td>
<td width="11%" align="center" height="21"></td>
<td width="11%" align="center" height="21"></td>
<td width="12%" align="center" height="21"></td>
</tr>
</table>
</center>
</div>
<hr color="#000000">



<div id="placement">

<div align="center">
<center>
<table border="0" width="59%" height="399" cellspacing="1">
<tr>
<td width="5%" align="center" height="32"><label><input type="checkbox" name="check_list" value="41" />41</label> </td>
<td width="5%" align="center" height="32"><label><input type="checkbox" name="check_list" value="42" />42</label> </td>
<td width="5%" align="center" height="32"><label>43<input type="checkbox" name="check_list" value="43" /></label></td>
</tr>
<tr>
<td width="5%" align="center" height="32"><label><input type="checkbox" name="check_list" value="40" />40</label> </td>
<td width="5%" align="center" height="32"></td>
<td width="5%" align="center" height="32"><label>44<input type="checkbox" name="check_list" value="44" /></label></td>
</tr>
<tr>
<td width="5%" align="center" height="32"><label><input type="checkbox" name="check_list" value="39" />39</label>
</td>
<td width="5%" align="center" height="32"></td>
<td width="5%" align="center" height="32"><label>45<input type="checkbox" name="check_list" value="45" /></label></td>
</tr>
<tr>
<td width="5%" align="center" height="32"><label><input type="checkbox" name="check_list" value="38" />38</label>
</td>
<td width="5%" align="center" height="32"></td>
<td width="5%" align="center" height="32"><label>46<input type="checkbox" name="check_list" value="46" /></label></td>
</tr>
</table>



</center>
</div>

</fieldset>

</form>


</body>



any help would be greatly appreciated & thanks in advance for your time.

HippieChickie

coothead
06-13-2015, 08:12 PM
Hi there HippieChickie,


try this...


<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>untitled document</title>

<style media="screen">
#myform {
width:80%;
margin:auto;
}
#myform fieldset:first-of-type {
padding:43px 0 10px;
border-bottom:0;
}
#myform fieldset:last-of-type {
padding:10px 0;
}
#myform table {
width:68%;width:85%;
margin:auto;
}
#myform table td {
width:20%;
text-align:center;
}
#myform fieldset:last-of-type td {
height:95px;
}
#bfive {
margin-top:10px;
}
</style>

<script>
(function() {
'use strict';

function init(){
var e,i=0,d=document,f=d.getElementById('myform'),temp=0,a=[];
f.reset();
while(e=f.elements[i++]) {
if(e.type=='checkbox') {
e.onclick=function () {
var e,i=0,total=0;
while(e=f.elements[i++]) {
if((e.type=='checkbox')&&(e.checked)) {
total+=Number(e.value)||0;
f.elements.total.value=total;
temp=total;
}
}
}
}
}
d.getElementById('bone').onclick=function() {
d.getElementById('one').value=temp;
if(temp!==0){
a[0]=true;
}
}
d.getElementById('btwo').onclick=function() {
d.getElementById('two').value=temp;
if(temp!==0){
a[1]=true;
}
}
d.getElementById('bthree').onclick=function() {
d.getElementById('three').value=temp;
if(temp!==0){
a[2]=true;
}
}
d.getElementById('bfour').onclick=function() {
d.getElementById('four').value=temp;
if(temp!==0){
a[3]=true;
}
}

d.getElementById('bfive').onclick=function() {
f.reset();
if(a[0]==true){
d.getElementById('one').value=temp;
a[0]=false;
}
if(a[1]==true){
d.getElementById('two').value=temp;
a[1]=false;
}
if(a[2]==true){
d.getElementById('three').value=temp;
a[2]=false;
}
if(a[3]==true){
d.getElementById('four').value=temp;
a[3]=false;
}
}
d.getElementById('bsix').onclick=function() {
temp=0;
a=[];
}
}
window.addEventListener?
window.addEventListener('load',init,false):
window.attachEvent('onload',init);
})();
</script>

</head>
<body>

<form id="myform" action="checkboxes.asp" method="post">
<fieldset>
<table><tr>
<td><input type="text" name="one" id="one" size="3" value="0" readonly="readonly"></td>
<td><input type="text" name="two" id="two" size="3" value="0" readonly="readonly"></td>
<td><label>Total: <input type="text" name="total" id="total" class="num" size="3" value="0" readonly="readonly"></label></td>
<td><input type="text" name="three" id="three" size="3" value="0" readonly="readonly"></td>
<td><input type="text" name="four" id="four" size="3" value="0" readonly="readonly"></td>
</tr><tr>
<td><input type="button" value="ONE" name="one" id="bone"></td>
<td><input type="button" value="TWO" name="two" id="btwo"></td>
<td></td>
<td><input type="button" value="THREE" name="three" id="bthree"></td>
<td><input type="button" value="FOUR" name="four" id="bfour"></td>
</tr><tr>
<td></td>
<td><input type="button" value="retain..." id="bfive"></td>
<td></td>
<td><input type="reset" value="...or reset" id="bsix"></td>
<td></td>
</tr></table>
</fieldset><fieldset>
<table><tr>
<td><label><input type="checkbox" name="check_list" value="41">41</label></td>
<td><label><input type="checkbox" name="check_list" value="42">42</label></td>
<td><label>43<input type="checkbox" name="check_list" value="43"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="40">40</label></td>
<td></td>
<td><label>44<input type="checkbox" name="check_list" value="44"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="39">39</label></td>
<td></td>
<td><label>45<input type="checkbox" name="check_list" value="45"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="38">38</label></td>
<td></td>
<td><label>46<input type="checkbox" name="check_list" value="46"></label></td>
</tr></table>
</fieldset>
</form>

</body>
</html>

My javascript is a rather pedantic and could probably be condensed and/or simplified. ;)

The HTML, though, has been cleaned up somewhat. :D



coothead

HippieChickie
06-14-2015, 07:40 PM
hello

thank you for the response.

i looked at the code & i would have never come up with that on my own lol.

it works as i requested but while playing with it i noticed the following behaviors.

A) a value is stored in boxone. user clicks retain to get another value. clicks boxtwo to store that value & clicks retain. value is boxone is now gone.

i need any value to retain in the box until user clicks 'reset'. up to 4 values should be able to be stored independant of eachother.

B) value is stored in boxone. clicking any of the other boxes will also store that same total instead of moving it from box to box.

i need a single value to move from box to box until retain is clicked. if user clicks diff box then old box should return to 0 & new box now stores the value. once user has clicks 'retain' the value is 'locked in' to THAT box & shouldnt be able to move anymore. if another value is stored that value can move from box to box - except to any boxes that are 'locked in'. only reset can 'unlock' the boxes.

C)a stored value can be overrode. even if retain is hit, user can take new total & click a box that already has a stored value.

once user has clicked retain - that box should no longer be accessible for change until 'reset' is clicked.

im sorry if i wasnt more clear in explaining what i was looking to do.

ty for cleaning up the coding & making the styling more appealing to the eye. i should tell you there are 79 checkboxes with values - not just the 9 i posted in the forum. i thought it would be to much code so i shortened it to give an example.

ty for being so helpful & the time you spent on this.

HippieChickie

coothead
06-14-2015, 08:04 PM
Hi there HippieChickie,


I am still not certain what your actual requirements are. :confused:

But for starters remove this highlighted line from the code...


d.getElementById('bfive').onclick=function() {
f.reset();
if(a[0]==true){

...

...
...and then retest and post you requirements again. ;)



coothead

HippieChickie
06-14-2015, 10:15 PM
hello again.

removing that line only prevents the checkboxes from being unchecked. it doesnt change anything else.

ill try to explain it better.

a user is looking to compare 2 to 4 values for the lowest. thats why all values need to stay shown & locked in. a user may pick any box to store the value. just because its the 1st value doesnt mean user will chose the 1st textbox to store that value. any textbox can be chosen in any order.

a user has a total of 41. user clicks buttonfour to store value. the 0 in the boxfour now shows 41. user realized they made a mistake & clicks boxthree. the value of 41 is now in boxthree & boxfour has returned to its default value of 0. user then clicks 'retain' to lock in THAT value to THAT boxthree. That boxthree should now be disabled so the value cant be changed until user either leaves page or clicks 'reset'. clicking 'retain' also clears the checkboxes & total box for the next value.

same user now has a total of 49. user clicks boxone to store that value. the 0 in boxone now shows 49. user clicks retain. now both boxone & boxthree have values that cant be changed or removed.

same user now has a total of 50. only boxtwo & boxfour are currently available to store values. user can click boxtwo & boxfour as many times as they want & the value of 50 or default of 0 will swap between them. once user clicks 'retain' the value will be confined to whatever box it was currently in & disabling it from being clicked again. now only one available option for the last total.

there will eventually be 2 other things. i dont want to leave anything out in case it makes a difference.

i didnt add a button for it yet but there will be one that says "Done". When user clicks it, the box with the lowest value will be colored so it stands out. ill also use labels above the boxes stating 'lowest', 'next lowest', '3rd lowest' or 'highest' that will be visable only when the 'done' button is clicked.

lastly, a user can only click up to 4 checkboxes that have values. i have the code for this already working, just not applied to this page yet.

thanks again for your help
HippieChickie

coothead
06-16-2015, 12:33 AM
Hi there HippieChickie,


I am sorry for the late reply, but being an old fart, I often
find it very difficult to follow a long list of instructions. :eek:

This is what I have come up with...


<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>untitled document</title>

<style media="screen">
body {
background-color:#f0f0f0;
}
#myform {
width:80%;
margin:auto;
background-color:#fff;
}
#myform fieldset:first-of-type {
padding:43px 0 10px;
border-bottom:0;
box-shadow:inset 0 0 20px #999;
}
#myform fieldset:last-of-type {
padding:10px 0;
box-shadow:inset 0 0 20px #999;
}
#myform table {
width:85%;
margin:auto;
}
#myform table td {
width:20%;
padding:5px 0;
text-align:center;
}
#myform fieldset:last-of-type td {
/*height:95px;*/
}
#bfive {
margin-top:10px;
}
.num {
cursor:pointer;
}
.bgcolor {
background-color:#f00;
}
</style>

<script>
(function() {
'use strict';

var b,n,c,k,e,i=0,d=document,f,temp=0,
a=[0,0,0,0],test=[true,true,true,true];

function init(){

b=d.getElementsByClassName('but');
n=d.getElementsByClassName('num');
f=d.getElementById('myform');

f.reset();

while(e=f.elements[i++]) {
if(e.type=='checkbox') {
e.onclick=function () {
var e,i=0,total=0;
while(e=f.elements[i++]) {
if((e.type=='checkbox')&&(e.checked)) {
total+=Number(e.value)||0;
f.elements.total.value=total;
temp=total;
}
}
}
}
}

for(c=0;c<b.length;c++){
b[c].disabled=false;
b[c].addEventListener('click',setNumber(c));
}

d.getElementById('bone').onclick=function() {
for(k=0;k<n.length;k++) {
if((test[k]==false)&&(n[k].value!=0)) {
b[k].disabled=true;
}
}
}

d.getElementById('done').onclick=function() {

a.sort(function numbers(a,b){return a- b});

for(c=0;c<n.length;c++) {
if(n[c].value==a[0]) {
n[c].className+=' bgcolor';
n[c].setAttribute('title','lowest');
}
if(n[c].value==a[1]) {
n[c].setAttribute('title','next lowest');
}
if(n[c].value==a[2]) {
n[c].setAttribute('title','third lowest');
}
if(n[c].value==a[3]) {
n[c].setAttribute('title','highest');
}
}
}

d.getElementById('btwo').onclick=function() {
for(c=0;c<b.length;c++) {
b[c].disabled=false;
n[c].className=n[c].className.replace(' bgcolor','');
n[c].removeAttribute('title');
}
temp=0;
a=[0,0,0,0];
test=[true,true,true,true];
}
}

function setNumber(c) {
b[c].onclick=function() {
n[c].value=temp;

for(k=0;k<n.length;k++) {
if((n[c].value==a[k])&&(b[k].disabled!=true)){
a[k]=0;
}
a[c]=temp;
n[k].value=a[k];
test[k]=true;
test[c]=false;
}
}
}
window.addEventListener?
window.addEventListener('load',init,false):
window.attachEvent('onload',init);
})();
</script>

</head>
<body>

<form id="myform" action="checkboxes.asp" method="post">
<fieldset>
<table><tr>
<td><input type="text" name="one" size="3" value="0" class="num" readonly="readonly"></td>
<td><input type="text" name="two" size="3" value="0" class="num" readonly="readonly"></td>
<td><label>Total: <input type="text" name="total" id="total" size="3" value="0" readonly="readonly"></label></td>
<td><input type="text" name="three" size="3" value="0" class="num" readonly="readonly"></td>
<td><input type="text" name="four" size="3" value="0" class="num" readonly="readonly"></td>
</tr><tr>
<td><input type="button" value="ONE" class="but"></td>
<td><input type="button" value="TWO" class="but"></td>
<td></td>
<td><input type="button" value="THREE" class="but"></td>
<td><input type="button" value="FOUR" class="but"></td>
</tr><tr>
<td></td>
<td><input type="button" value="retain" id="bone"></td>
<td><input type="button" value="done" id="done"></td>
<td><input type="reset" value="reset" id="btwo"></td>
<td></td>
</tr></table>
</fieldset><fieldset>
<table><tr>
<td><label><input type="checkbox" name="check_list" value="41">41</label></td>
<td><label><input type="checkbox" name="check_list" value="42">42</label></td>
<td><label>43<input type="checkbox" name="check_list" value="43"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="40">40</label></td>
<td></td>
<td><label>44<input type="checkbox" name="check_list" value="44"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="39">39</label></td>
<td></td>
<td><label>45<input type="checkbox" name="check_list" value="45"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="38">38</label></td>
<td></td>
<td><label>46<input type="checkbox" name="check_list" value="46"></label></td>
</tr></table>
</fieldset>
</form>

</body>
</html>
...which may, or may not, be closer to what I think that
you might have requested. ;)

Whatever the outcome of my latest attempt we will,
hopefully, get there in the end. :D



coothead

HippieChickie
06-16-2015, 10:09 PM
hello

lol im sorry about being so longwinded. just trying to be detailed.

i tried to apply your code but i immed. got an error:

line 61 char 4
property doesnt support property or method 'getElementsByClassName'
code 0

when i click to continue running scripts i can only check the boxes. values are no longer being added.

please advise.

thanks,
HippieChickie

coothead
06-16-2015, 10:20 PM
Hi there HippieChickie,


are you using IE8 as your test browser?

If so, I will have to adjust the code. ;)

There was nothing wrong with your explanation,
the problem is with my little grey cells. :D

My neural networks just aren't what they used
to be in my prime. :eek:




coothead

coothead
06-16-2015, 11:46 PM
Hi there HippieChickie,


this version is IE8 compatible...



<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>untitled document</title>

<style media="screen">
body {
background-color:#f0f0f0;
}
#myform {
width:80%;
margin:auto;
background-color:#fff;
}
#myform fieldset:first-of-type {
padding:43px 0 10px;
border-bottom:0;
box-shadow:inset 0 0 20px #999;
}
#myform fieldset:last-of-type {
padding:10px 0;
box-shadow:inset 0 0 20px #999;
}
#myform table {
width:85%;
margin:auto;
}
#myform table td {
width:20%;
padding:5px 0;
text-align:center;
}
#myform fieldset:last-of-type td {
/*height:95px;*/
}
#bfive {
margin-top:10px;
}
.num {
cursor:pointer;
}
.bgcolor {
background-color:#f00;
}
</style>

<script>
(function() {
'use strict';

var b,n,s,c,k,e,i=0,d=document,f,temp=0,
a=[0,0,0,0],test=[true,true,true,true];

function init(){

b=d.getElementById('buttons').getElementsByTagName('input');
n=d.getElementById('numbers').getElementsByTagName('input');
s=d.getElementById('hi-lo').getElementsByTagName('span');
f=d.getElementById('myform');

f.reset();

while(e=f.elements[i++]) {
if(e.type=='checkbox') {
e.onclick=function () {
var e,i=0,total=0;
while(e=f.elements[i++]) {
if((e.type=='checkbox')&&(e.checked)) {
total+=Number(e.value)||0;
f.elements.total.value=total;
temp=total;
}
}
}
}
}

for(c=0;c<b.length;c++){
b[c].disabled=false;
b[c].addEventListener('click',setNumber(c));
}

d.getElementById('bone').onclick=function() {
for(k=0;k<n.length;k++) {

if((test[k]==false)&&(n[k].value!=0)) {
b[k].disabled=true;
}
}
}

d.getElementById('done').onclick=function() {

a.sort(function numbers(a,b){return a- b});

for(c=0;c<n.length;c++) {

if(n[c].value==a[0]) {
n[c].className+=' bgcolor';
s[c].innerHTML='lowest';
}
if(n[c].value==a[1]) {
s[c].innerHTML='second lowest';
}
if(n[c].value==a[2]) {
s[c].innerHTML='third lowest';
}
if(n[c].value==a[3]) {
s[c].innerHTML='highest';
}
}
}

d.getElementById('btwo').onclick=function() {
for(c=0;c<b.length;c++) {

b[c].disabled=false;
n[c].className=n[c].className.replace(' bgcolor','');
s[c].innerHTML='';

}
temp=0;
a=[0,0,0,0];
test=[true,true,true,true];
}
}

function setNumber(c) {
b[c].onclick=function() {
n[c].value=temp;

for(k=0;k<n.length;k++) {

if((n[c].value==a[k])&&(b[k].disabled!=true)){
a[k]=0;
}
a[c]=temp;
n[k].value=a[k];
test[k]=true;
test[c]=false;
}
}
}
window.addEventListener?
window.addEventListener('load',init,false):
window.attachEvent('onload',init);
})();
</script>

</head>
<body>

<form id="myform" action="checkboxes.asp" method="post">
<fieldset>
<table><tr id="hi-lo">
<td><span></span></td>
<td><span></span></td>
<td><label>Total: <input type="text" name="total" id="total" size="3" value="0" readonly="readonly"></label></td>
<td><span></span></td>
<td><span></span></td>
</tr><tr id="numbers">
<td><input type="text" name="one" size="3" value="0" readonly="readonly"></td>
<td><input type="text" name="two" size="3" value="0" readonly="readonly"></td>
<td></td>
<td><input type="text" name="three" size="3" value="0" readonly="readonly"></td>
<td><input type="text" name="four" size="3" value="0" readonly="readonly"></td>
</tr><tr id="buttons">
<td><input type="button" value="ONE"></td>
<td><input type="button" value="TWO"></td>
<td></td>
<td><input type="button" value="THREE"></td>
<td><input type="button" value="FOUR"></td>
</tr><tr>
<td></td>
<td><input type="button" value="retain" id="bone"></td>
<td><input type="button" value="done" id="done"></td>
<td><input type="reset" value="reset" id="btwo"></td>
<td></td>
</tr></table>
</fieldset><fieldset>
<table><tr>
<td><label><input type="checkbox" name="check_list" value="41">41</label></td>
<td><label><input type="checkbox" name="check_list" value="42">42</label></td>
<td><label>43<input type="checkbox" name="check_list" value="43"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="40">40</label></td>
<td></td>
<td><label>44<input type="checkbox" name="check_list" value="44"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="39">39</label></td>
<td></td>
<td><label>45<input type="checkbox" name="check_list" value="45"></label></td>
</tr><tr>
<td><label><input type="checkbox" name="check_list" value="38">38</label></td>
<td></td>
<td><label>46<input type="checkbox" name="check_list" value="46"></label></td>
</tr></table>
</fieldset>
</form>

</body>
</html>


coothead

HippieChickie
06-17-2015, 04:02 AM
hello again

im using win 8 & ie 10. however *hangs head* my editor is from 2000. now whos the old coot!

your 2nd code corrected the getElementsByClassName in my editor but now gives me a new error.

line 85 char 5
object doesnt support addEventListener

it does work in IE so i was able to play around with it for a bit. i noticed the following:

- the retain no longer clears the total or the checkboxes.

- the coloring of the textbox should only happen if value is greater than 0. a box with no value shouldnt be considered the lowest.

thanks again for the help
HippieChickie

coothead
06-17-2015, 09:01 AM
Hi there HippieChickie,



...my editor is from 2000...
Are you really telling me that you are testing the code in an old text editor instead of a browser?

That beggars belief.

Your user name, of course, does suggest that you may be over indulging the "Waccy Baccy", somewhat. :D

We always test code in browsers not editors.

That is just plain common sense.

IE10 supports both "getElementsByClassName" and "addEvenListener".



coothead

coothead
06-17-2015, 10:58 PM
Hi there HippieChickie,


check out the attachment, it contains an example that meets your requirements. ;)

The code has been tested successfully using "Windows 7" and these browsers:-


Firefox 38.0.5
IE11
Chrome 43.0
Opera 12.17
Opera 30.0
Safari 5.1.7




coothead

HippieChickie
06-18-2015, 05:18 PM
Hi there HippieChickie,



Are you really telling me that you are testing the code in an old text editor instead of a browser?

That beggars belief.

Your user name, of course, does suggest that you may be over indulging the "Waccy Baccy", somewhat. :D

We always test code in browsers not editors.

That is just plain common sense.

IE10 supports both "getElementsByClassName" and "addEvenListener".



coothead

thats why you are the master & i... am merely a grasshopper.

i am self taught - so forgive my lack of knowledge on the protocol of editing.

with that said, until i started this page i have always found my ancient editor to be realiable whereas my browser is not.

case in point, i ran your code in my browser. looks great & works except for the clearing of the total & the checkboxes when 'retain' is hit. later on, i brought the page up on my phone to play with it & was pleasantly surprised to see the words above the textboxes when 'done' was hit.

those words were NOT visible in my browser when i clicked 'done' - even without the wackybacky lol

now thats beggars belief! (i looked it up lol)

HippieChickie

HippieChickie
06-18-2015, 05:21 PM
Hi there HippieChickie,


check out the attachment, it contains an example that meets your requirements. ;)

The code has been tested successfully using "Windows 7" and these browsers:-


Firefox 38.0.5
IE11
Chrome 43.0
Opera 12.17
Opera 30.0
Safari 5.1.7




coothead

ty. i will download this & play with it.

much appreciated,
HippieChickie

HippieChickie
06-26-2015, 06:45 PM
hello

sorry for late reply but i been sick.

this is great & exactly what i was looking to do. i even learned some CSS :)

thanks for everything you do for people like me. im in awe of how quickly you put the code together.

have a great day!
HippieChickie

coothead
06-26-2015, 07:02 PM
No problem, you're very welcome. ;)

And thanks for the interesting problem. :D


coothead