Multiple inputs enable and disable a button

Ask the community
,
1

I’ve searched all over the forum but can’t find this anywhere…

I want to create a multi step form submission
In every step there is 2 or 3 questions…

i want my “next” button to be disabled on load and only enable if all the inputs in the corrent step is compleated…

i was trying using if or else but i can’t make it work… Please help

im new at coding and i know this is not right, but was thinking something like this

if $w("#checkbox1").checked
   $w("#checkbox2").checked
   $w("#dropdown1").value == "somevalue" {
   
   $w("#button1").enabled
}
else $w("#button1").disabled
2

Hi Mattias,
First thing is to uncheck “enable by default” in the button’s properties panel.
The next step is to create an onchange event function:

function onChange() {
    if ($w("#checkbox1").checked && $w("#checkbox2").checked && $w("#dropdown1").value) {
        $w("#button1").enable()
    }
    else {
        $w("#button1").disable();
    }  
}

Please update in your progress
Roi

3

Hi Roi, thanks for your answer but it doesn’t work for me :confused:
When the first checkbox is checked, the button enables, it shuld only enable when both checkbox and dropdown is filled…

Please help!! I tried everything :smiley:

I made the code like this

$w.onReady(function () {
 	$w('#checkbox2').onChange (()=>{
	if ($w('#checkbox2').checked || 
	$w('#checkbox3').checked || 
	$w('#checkbox4').checked || 
	$w('#checkbox5').checked && 
	$w('#Farve').value)
	
		{ 
		$w('#VidereTrin1Knap').enable();
		}

	else $w('#VidereTrin1Knap').disable();
4

Hi,
In the code you use OR || operator, you should use AND && operator.
For more information:

Roi

5

Thanks a lot for the fast answer!! :slight_smile:

it is on purpose i use the OR || operator

Because the checkboxes is only one of them there need to be seclected (kinda like radio buttons)

so it is one of the checkboxes
and
the dropdown menu there need to be filled

6

Ok, now i get it.
Can you please share a link to your site so we can inspect ?
Roi

7

I had to create a demo site, as my other site is live and can’t be effected :slight_smile:

The demo site i created, it is similar to the live site
https://profiltech.wixsite.com/demosite

8

Hi,
This is my suggestion:

$.onReady(() => {
	$w('#checkbox1').onChange(nextButtonEnableDisable);
	$w('#dropdown1').onChange(nextButtonEnableDisable);
});
function nextButtonEnableDisable() {
	if (($w('#checkbox1').checked || $w('#checkbox2').checked || $w('#checkbox3').checked || $w('#checkbox4').checked) && $w('#dropdown1').value) {

		$w('#button1').enable();
	} else $w('#button1').disable();

}

It works with this example with checkbox1 and dropdown1
Roi

9

Thanks a lot Roi, i will try this out, and get back to you with the result or if i need any further help :slight_smile:

10

Hmm… it works, but not 100%…

If i check the checkbox first and then the dropdown, it works perfect,
but if i change the dropdown first and then check the checkbox it doesn’t enable the next button…

11

I works on the demo site if i say ( && dropdown1.value ) after every checkbox see the code below,

but it does not work on my real site? No errors in the console log.

Link to demo site https://profiltech.wixsite.com/demosite

$w.onReady(function () {
$w("#checkbox1").onChange(nextButtonEnableDisable);
$w("#dropdown1").onChange(nextButtonEnableDisable);

});

function nextButtonEnableDisable() {
	if (($w('#checkbox1').checked && $w('#dropdown1').value || 
	$w("#checkbox2").checked && $w('#dropdown1').value || 
	$w("#checkbox3").checked && $w('#dropdown1').value || 
	$w("#checkbox4").checked && $w('#dropdown1').value)) {

		$w('#button1').enable();
	} else $w('#button1').disable();

}
12

I am trying to write a code that goes through a dataset and disable the addition of any entry that is identical to an entry already existing in the dataset by disabling the add button.
I am really new to coding so I would really appreciate your help

function filter ( class1 , title ) {
let new filter = wixData . filter ();
if ( class1 ) {
new filter = new filter . contains ( “Class1” , class1 )
}
if ( title ) {
new filter = new filter . contains ( “First Name” , title )
}
$w ( “#dataset1” ). setFilter ( newfilter );

$w ( “#button1” ). disable ()

else {
$w ( “#button1” ). enable ();
}
}