Hide/Disable "Add to Cart" on portal based on Yes/No variable

[Service Manager]

Hi,

I need help to hide/disable "Add to cart" for a specific catalog item. We have a Yes/No variable and if variable is answered as No only then hide "Add to Cart" button.

Thanks

[Ankur Bawiskar]

Refer my previous comment.

Script is working in both native and portal

[Ankur Bawiskar]

@Service Manager 

This worked well for me in native and Portal

Ensure Isolate Script field is set to False

Script:

function onLoad() {
	//Type appropriate comment here, and begin script below

	if(window == null){
		// for portal
		var z = this.document.getElementsByClassName("btn btn-default sc-btn form-control ng-scope");
		z[0].style.display = 'none';
	}
	else{
		// for native
		gel('oi_add_to_cart_button').style.display = 'none';
	}
}

Output: Native:

Output: Portal

Regards
Ankur

[Service Manager]

Yes, It worked but as I said, I wanted to hide it only when variable(Yes/No type) is "NO"

I guess, we have run the onchange script rather than onload. can you see that

[Ankur Bawiskar · Accepted solution]

Hi,

just use it in onchange

function onChange(control, oldValue, newValue, isLoading) {
if (isLoading || newValue == '') {
return;
}
if(g_form.getValue(have_you) == 'No')
{
if(window == null){
        // for portal
        var z = this.document.getElementsByClassName("btn btn-default sc-btn form-control ng-scope");
        z[0].style.display = 'none';
    }
    else{
        // for native
        gel('oi_add_to_cart_button').style.display = 'none';
    }
}

else{
if(window == null){
        // for portal
        var z = this.document.getElementsByClassName("btn btn-default sc-btn form-control ng-scope");
        z[0].style.display = '';
    }
    else{
        // for native
        gel('oi_add_to_cart_button').style.display = '';
    }
}
}

Regards
Ankur

[Mohit Kaushik]

Hi There,

You can do it with help of DOM in onChange catalog client script. Need to make sure isolate checkbox must be unchecked.

if(g_form.getValue(<variable name>) == 'No')
{
document.getElementById("<id of your button>").style.display = 'none'; // hide 
}

//you can get the id of your button by inspecting it.
else{
document.getElementById("<id of your button>").style.display = ''; // show
}

Please mark this correct and helpful if it resolves the query as per the impact.

Thanks,

Mohit Kaushik