I have been implementing the Snipcart in my website and I want to prompt the user with checkbox, and depending on whether the user checked it or not to increase a price of a product. Here is my code:
<button
class="snipcart-add-item btn btn-primary"
[attr.data-item-id]="selectedService._id"
[attr.data-item-price]="mainPrice"
data-item-url="http://localhost:4200/"
[attr.data-item-description]="selectedService.jsonData.description.en"
[attr.data-item-name]="selectedService.name"
data-item-custom1-name="Number of additional employees"
data-item-custom1-options="0|1[+25.00]|2[+50.00]|3[+75.00]|4[+100.00]|5[+125.00]|6[+150.00]|7[+175.00]|8[+200.00]|9[+225.00]|10[+250.00]"
data-item-custom2-name="Procure employment pass for USD 1,650.00 to allow a foreigner to serve as the local director."
data-item-custom2-options="false|true[+1650.00]"
>
In your Docs, it says that if the values of "data-item-options" are "true|false", then it will be displayed as a checkbox, but it is displayed as a dropdown list with values "true" and "'false". Am I doing something wrong and is there some other way to implement this? Also I have tried to use "data-item-custom-type"="checkbox", but then I don't have the option to increase the value of product price (or maybe I just didn't find how to do that).
Checkboxes don't support price modifiers yet, this is something our team will implement in the future though.
For now, we suggest you use a dropdown for this:
data-item-custom2-options="No|Yes[+1650.00]"