Jump to content

Check a checkbox when another checkbox is checked


Recommended Posts

Just now, Mylene said:

Hey, everyone!

I need help again :)

I'd like to check a checkbox when another checkbox is checked and vice versa.

I have a submission form with virtual field. And if that field is checked I need to check the "Subscribed" checkbox field on the same datapage.

Thanks!

Hi Mylene,

I have a solution for you. Use the following script in the footer of the form:

<script>

document.getElementById("cbParamVirtual1").onchange= function()

{

if (document.getElementById("cbParamVirtual1").checked==true)
{
document.getElementById("InsertRecordPublished").checked=true;
}

else if (document.getElementById("cbParamVirtual1").checked==false)
{
document.getElementById("InsertRecordSubscribed").checked=false;
}
}
</script>

In my script the virtual field  has index "1", because my virtual field id the first one on the datapage. You may find more info about referencing virtual fields here

Also replace "Subscribed" with your fieldname.

Link to comment
Share on other sites

  • 7 months later...

Hi Mylene,

You can also try this script:

<script>
var checkboxesToCheck = [
    // TODO: Add here the HTML IDs of checkboxes to check -->
    'InsertRecordPublished',
    'InsertRecordSubscribed',
    'cbParamVirtual2',
    'cbParamVirtual3',
];

var vfield = document.getElementById('cbParamVirtual1');
vfield.onchange = function ()
{
    checkboxesToCheck.forEach(
        function (id, index)
        {
            document.getElementById(id).checked = vfield.checked;
        }
    );
}
</script>

 

Link to comment
Share on other sites

  • 3 years later...
On 2/20/2017 at 3:46 AM, Mathilda said:

Hi Mylene,

I have a solution for you. Use the following script in the footer of the form:


<script>

document.getElementById("cbParamVirtual1").onchange= function()

{

if (document.getElementById("cbParamVirtual1").checked==true)
{
document.getElementById("InsertRecordPublished").checked=true;
}

else if (document.getElementById("cbParamVirtual1").checked==false)
{
document.getElementById("InsertRecordSubscribed").checked=false;
}
}
</script>

In my script the virtual field  has index "1", because my virtual field id the first one on the datapage. You may find more info about referencing virtual fields here

Also replace "Subscribed" with your fieldname.

Hi! I just want to update this code, so, users can use this with Responsive Enabled. Re: https://howto.caspio.com/datapages/ajax-loading/

<script type="text/javascript">
document.getElementById("cbParamVirtual1").addEventListener('change', function(event) {
	
	if (document.getElementById("cbParamVirtual1").checked==true){
			document.getElementById("InsertRecordPublished").checked=true;
	}

	else if (document.getElementById("cbParamVirtual1").checked==false){
			document.getElementById("InsertRecordSubscribed").checked=false;
	}
  
});
</script>

 

 

 

Link to comment
Share on other sites

  • 1 year later...

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...