Disable Button Based On Data In A Field

[reneeforest1983]

Hi All,

 

I was wondering if I can disable my custom "Details" button on a tabular report if I have certain value in a calculated field? For example if the value is "0" I want this button to be grayed out.

 

Thank you! 

[Barbara]

Hello,

 

You can try using javascript for that matter.

 

I am using a "Buy this item" button to connect my report with details page. If you have something similar you can add an HTML block to your report and use javascript. In your case it would be something like that:

 

<script type="text/javascript">
var cb_boolean = '[@calcfield:1]';
if (cb_boolean != '0') 
{
document.write("<input type='button' value='Details' Name='mybutton' onclick='myfunction()'> ");
}
else
{
document.write("<input type='button' value='Home Page' Name='mybutton' disabled=true>"); 


}


function myfunction()
{
window.location.href='url&paramToDetailspage';
}
</script>

 

Replace url&paramToDetailspage with your url to Details page.

 

Cheers,

 

Barbara

[Stepford]

Hi Barbara,

 

Your reply to this post seems to address an issue I am having. However, not knowing a thing about JavaScript (nor HTML for that matter): I am not really sure how to apply this to my app.

 

In my case I have a DataPage where my users can see the initial quantity of product (A), the shipped/ reserved quantity (  and then the available quantity: the latter being a calculated field [@calcfield:1] that is equal to (A) - ( .

I then have an HTML block for my "Create Shipment Request" button. The source code for that is as follows (I copied this from another app):

<div style="margin:10px;"><a href=http://eu1.caspio.com/dp.asp?AppKey=cde830001d57b1a237854adab459&Stock_ID=[@field:Stock_ID]&Product_Description=[@field:Product_Description] style="background:rgb(61, 130, 171); padding:7px 20px; border:1px solid rgb(221, 221, 221); border-image:none:color:rgb(255, 255, 255); font-weight:bold;text-decoration:none;white-space:nowrap;">Create Shipment Request</a></div>

Essentially, I would like this button to be greyed out when [@calcfield:1] = 0 so that my users cannot create a shipment request for something that is out of stock.

 

I would greatly appreciate if you could tell me how amend my HTML block to get my desired result if you have the time.

 

Thanking you in advance for your help!

 

Stephen

[Jan]

Hi Stephen,

 

If I understand correctly you and Barbara, you can enter the following code to your HTML Block:

 

If you want to use a link:

<script type="text/javascript">
var cb_boolean = [@calcfield:1];
if (cb_boolean>0)
{
document.write("<div style='margin:10px;'><a href='http://eu1.caspio.com/dp.asp?AppKey=cde830001d57b1a237854adab459&Stock_ID=[@field:Stock_ID]&Product_Description=[@field:Product_Description]' style='background:rgb(61, 130, 171); padding:7px 20px; border:1px solid rgb(221, 221, 221); border-image:none:color:rgb(255, 255, 255); font-weight:bold;text-decoration:none;white-space:nowrap;'>Create Shipment Request</a></div>");
}
else
{
document.write("<div style='margin:10px;'><span style='background:rgb(61, 130, 171); padding:7px 20px; border:1px solid rgb(221, 221, 221); border-image:none:color:rgb(255, 255, 255); font-weight:bold;text-decoration:none;white-space:nowrap;'>Create Shipment Request</span></div>");
}
</script>

If you want to use a button:

<script type="text/javascript">
var cb_boolean = [@calcfield:1];
if (cb_boolean>0) 
{
document.write("<input type='button' value='Details' Name='mybutton' onclick='myfunction()'> ");
}
else
{
document.write("<input type='button' value='Details' Name='mybutton' disabled=true>"); 
}
function myfunction()
{
window.location.href='http://eu1.caspio.com/dp.asp?AppKey=cde830001d57b1a237854adab459&Stock_ID=[@field:Stock_ID]&Product_Description=[@field:Product_Description]';
}
</script>

I hope, it helps )

[Stepford]

Hi Jan,

Many thanks for taking the time to respond to my post. Much appreciated!

The script you provided for the link works just fine: it prevents users form ordering items that are out of stock and it also passes the parameters to the Shipment Request DataPage as required for those items that are in stock.
However, the small issue is that in terms of the greying out of the button this is happening on the wrong ones; i.e. those items that are available. How do I amend the code so that the correct buttons are not only disabled, but also greyed out in appearance?

Thanks again for your help

 

Stephen

[Jan]

Hi Stephen,

 

If I understand correctly, you can use the following code:

<script type="text/javascript">var cb_boolean = [@calcfield:1];
if (cb_boolean>0)
{
document.write("<div style='margin:10px;'><a href='http://eu1.caspio.com/dp.asp?AppKey=cde830001d57b1a237854adab459&Stock_ID=[@field:Stock_ID]&Product_Description=[@field:Product_Description]' style='background:rgb(61, 130, 171); padding:7px 20px; border:1px solid rgb(221, 221, 221); border-image:none:color:rgb(255, 255, 255); font-weight:bold;text-decoration:none;white-space:nowrap;'>Create Shipment Request</a></div>");
}
else
{
document.write("<div style='margin:10px;'><span style='background:rgb(200, 200, 200); padding:7px 20px; border:1px solid rgb(221, 221, 221); border-image:none:color:rgb(255, 255, 255); font-weight:bold;text-decoration:none;white-space:nowrap;'>Create Shipment Request</span></div>");
}
</script>

You can change the color of disabled button in the following part of the code:

style='background:rgb(200, 200, 200);

If you enter (255, 255, 255) the color will be white, if (0,0,0) - the color will be black.

So, you can try different colors to define which is the best.

 

I hope, it helps.

[Stepford]

Hi Jan,

 

Many thanks for the additional information. I now have it working just the way I want it to

Thanks again! Have a great weekend!

 

Stephen

[cheonsa]

Hi all!

I know that I am super late to answer this post, but for other users that may come across this forum post, I will share some of my thoughts here. 

If you are using a custom Details Page, you can have a Calculated field and use a Case When Statement to display the link based on the condition. Then, to properly render the link, use an HTML Block.

 

You can also refer to this forum post to hide the Calculated Field:

However, if you are using the default View Details Page, you can use the solution provided here:

https://howto.caspio.com/tech-tips-and-articles/disabling-inline-edit-option-in-reports-based-on-a-condition/