PDA

View Full Version : Resolved Hide Submit button & Checkbox until user clicks at least 1 selection

bertembra
05-27-2009, 01:27 PM
Hi everyone,

I basically have a list of 3-10 items in a form to be submitted to my basket script.

And I want the submit button to be hidden untill the user selects at least 1 of those items.

Example Html:

<form action="basket.php?Action=Add&type=1" method="post" id="Form1">
<input type="checkbox" name="Domain1" value="xyz|co.uk|1|Register|NoPrivacy|NoHosting|NoAddons">Register
<br/>
<input type="checkbox" name="Domain2" value="xyz|org.uk|1|Register|NoPrivacy|NoHosting|NoAddons">Register
<br/>
<input type="checkbox" name="Domain3" value="xyz|me.uk|1|Register|NoPrivacy|NoHosting|NoAddons">Register
<br/>
<br/>
<input type="submit" name="Submit" id="Submit" value="Submit">
</form>

Thanks

Bert
mic2100
05-27-2009, 01:37 PM
hi,

i have used something like this b4. I have modded ma code a bit to fits how u wanted to use it.


<script>

var i = 0;

function enable_submit(obj)
{

var sb = document.getElementById("Submit");
if(obj.checked === true){ sb.disabled = false; i++; }
else{

i--;
if(i == 0){ sb.disabled = true; }

}

}

</script>
<form action="basket.php?Action=Add&type=1" method="post" id="Form1">
<input type="checkbox" name="Domain1" value="xyz|co.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="enable_submit(this);">Register
<br/>
<input type="checkbox" name="Domain2" value="xyz|org.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="enable_submit(this);">Register
<br/>
<input type="checkbox" name="Domain3" value="xyz|me.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="enable_submit(this);">Register
<br/>
<br/>
<input type="submit" name="Submit" id="Submit" value="Submit" disabled="disabled">
</form>
bertembra
05-27-2009, 02:01 PM
Sorry mic2100,

I've been a major bellringer as I missed out what javascipts and onclick events that I already had in the page, and also I missed that I would also like to hide the Privacy checkbox until the Registration checkbox opposite is checked.

<script type="text/javascript">
<!--
function AddPrivacy(num)
{

Domain=document.forms[0].elements['Domain' + num];
Privacy=document.forms[0].elements['Privacy' + num];
txt="";
if (Domain.checked)
{
txt=Domain.value;
}
if (Privacy.checked && Domain.checked)
{
txt=Privacy.value;
}

document.forms[0].elements['Item' + num].value="" + txt;
}
//-->
</script>
<head>
<body>
<form action="test.php" method="post" id="Form1">
<input type="checkbox" name="Domain1" value="xyz|co.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="AddPrivacy(1)">Register
<input type="checkbox" name="Privacy1" value="xyz|co.uk|1|Register|Privacy|NoHosting|NoAddons" onclick="AddPrivacy(1)">Privacy
<input name="Item1" type="hidden" id="Item1" value="" />
<br/>
<input type="checkbox" name="Domain2" value="xyz|org.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="AddPrivacy(2)">Register
<input type="checkbox" name="Privacy2" value="xyz|org.uk|1|Register|Privacy|NoHosting|NoAddons" onclick="AddPrivacy(2)">Privacy
<input name="Item2" type="hidden" id="Item2" value="" />
<br/>
<input type="checkbox" name="Domain3" value="xyz|me.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="AddPrivacy(3)">Register
<input type="checkbox" name="Privacy3" value="xyz|me.uk|1|Register|Privacy|NoHosting|NoAddons" onclick="AddPrivacy(3)">Privacy
<input name="Item3" type="hidden" id="Item3" value="" />

<br/>
<br/>
<input type="submit" name="Submit" id="Submit" value="Submit">
</form>

In a nutshell I want to hide the submit button until at least 1 Registration checkbox is selected. If a Registration checkbox is selected show the opposite Privacy checkbox.

Sorry for the last post, like I said...Bellringer or Campanoligist :)

Thanks Again

Bert
mic2100
05-27-2009, 03:57 PM
i had a play around with the idea you was trying to do and i came up with this


<script type="text/javascript">
<!--


var i = 0;

function enable_submit(obj, domain)
{

var sb = document.getElementById("Submit");
var dom = document.getElementById('Domain' + domain);
if(obj.checked === true){

sb.disabled = false;
i++;

}
else{

if(i > 0){ i--; }
if(i == 0){ sb.disabled = true; }

}

}

function display_privacy(domain)
{

var sb = document.getElementById("Submit");
var privacy_label = document.getElementById('privacy_' + domain);
var privacy_cb = document.getElementById('Privacy' + domain);
var dom = document.getElementById('Domain' + domain);

if(dom.checked === true){ privacy_label.style.visibility = 'visible'; }
else{
privacy_cb.checked = false;
privacy_label.style.visibility = 'hidden';
if(i > 0){ i--; }
if(i == 0){ sb.disabled = true; }
}

}

//-->
</script>
<head>
<body>
<form action="test.php" method="post" id="Form1">
<input type="checkbox" id="Domain1" name="Domain1" value="xyz|co.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="display_privacy(1)">Register
<label id="privacy_1" style="visibility:hidden;"><input type="checkbox" id="Privacy1" name="Privacy1" value="xyz|co.uk|1|Register|Privacy|NoHosting|NoAddons" onclick="enable_submit(this, 1)">Privacy</label>
<input name="Item1" type="hidden" id="Item1" value="" />
<br/>
<input type="checkbox" id="Domain2" name="Domain2" value="xyz|org.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="display_privacy(2)">Register
<label id="privacy_2" style="visibility:hidden;"><input type="checkbox" id="Privacy2" name="Privacy2" value="xyz|org.uk|1|Register|Privacy|NoHosting|NoAddons" onclick="enable_submit(this, 2)">Privacy</label>
<input name="Item2" type="hidden" id="Item2" value="" />
<br/>
<input type="checkbox" id="Domain3" name="Domain3" value="xyz|me.uk|1|Register|NoPrivacy|NoHosting|NoAddons" onclick="display_privacy(3)">Register
<label id="privacy_3" style="visibility:hidden;"><input type="checkbox" id="Privacy3" name="Privacy3" value="xyz|me.uk|1|Register|Privacy|NoHosting|NoAddons" onclick="enable_submit(this, 3)">Privacy</label>
<input name="Item3" type="hidden" id="Item3" value="" />

<br/>
<br/>
<input type="submit" name="Submit" id="Submit" value="Submit" disabled>
</form>


let me know if that is any better
bertembra
05-27-2009, 04:59 PM
Thanks for the reply.

I works great for hinding the privacy bit, but the submit button should only become visable from the registration checkboxes not the Privacy checkboxes.

Also I had a bit of script in my last post that set hiddenfield Item1, Item2 => Item10 with data. That part of the script worked fine. The hiddenfields holds the data that is passed to my basket script.

The hiddenfields should be set like below depending on which checkboxes are selected:

If Domain1 checked
(Show Privacy1 checkbox & Submit Button)

Item1 = xyz|co.uk|1|Register|NoPrivacy|NoHosting|NoAddons


If Domain1 & Privacy1 checked
(Show Submit Button)

Item1 = xyz|co.uk|1|Register|Privacy|NoHosting|NoAddons


Thanks again and sorry if my last post wasnt clear!

Bertie Bellringer :)
bertembra
05-27-2009, 06:06 PM
Thanks for the help mic2100 you have been a great help.

I've sorted it now I just merged your 2 functions with mine to set the hiddenfields into 1 function and it works fine.

Thanks again :thumbsup:

Bert