Javascript for Outputting "N/A" in a text field based on a choice
I want to have a single line text field to populate with N/A if a certain choice (multi-choice) is selected.
For example:
Choices:
Apple
Oranges
Pear
Apple Stock: In Stock
Orange Stock: In Stock
Pear Stock: In Stock
-----------------------------------------------
If apple is selected, N/A should appear for Apple Stock: N/A. If both apple and orange are selected, N/A should appear for both Apple Stock and Orange Stock.
Currently, I have this for Javascript, and nothing happened upon the choice selection (still a newbie). I have assigned the Javascript variables - one to the choice control (varFruits), another to the line section (varApple):
i have a question, do you need to edit this text when it has been populated? If not then a calculated value field will serve you much better here without using any JavaScript, you can just use a formula.
if you do need to edit the text, for classic forms designer sadly JavaScript is the only option,
Anyways,
I think in your script the issue comes with the if statement looking at checked and then assessing the value of the check to set the status of each fruit, I don’t think it works this way.
The val() function used on the checkbox input gets the value of the first checked box only. When working with multi-choice checkboxes, it’s possible to have multiple options selected so a single level if statement will almost always be incorrect.
To fix your script, you should iterate through each checked option and then take action accordingly.
NWF.FormFiller.Events.RegisterAfterReady(function () { NWF$('#'+varFruits).change(function(){ // Reset all values to 'In Stock' first NWF$('#'+varApple).val('In Stock'); NWF$('#'+varOrange).val('In Stock'); NWF$('#'+varPear).val('In Stock');
// Then go through each checked option NWF$('#'+varFruits + ' input:checked').each(function(){ if (this.value == 'Apple') { NWF$('#'+varApple).val('N/A'); } else if (this.value == 'Oranges') { NWF$('#'+varOrange).val('N/A'); } else if (this.value == 'Pear') { NWF$('#'+varPear).val('N/A'); } }); }); });
Hi Jake,
Thanks for responding! In regards to this query: “do you need to edit this text when it has been populated? “ Unfortunately, yes, the current formatting of the form is shown below, in which to standardize user entries, they can either enter stock #, or if out of stock is checked - it’ll fill out with N/A automatically:
Thank you for correcting my script and proposing/amending the script. Still a Javascript newbie - greatly appreciated for the insights!
Just tested the script and unfortunately it did not output correctly:
For this part: “// Reset all values to 'In Stock' first NWF$('#'+varApple).val('In Stock');” ← in this case if there’s no “In stock” option, would it be better to default the value to be an empty string value?
I did a calculated value to see the output of the multi choice control, would I need to change what the value == to include the brackets, ]?
Thank you for your time!
Ah, I misunderstood the requirement, let me validate it and get back to you.
Hi @vities
I have reviewed and tested the code and I made some spelling mistakes with the variables, I have also added in an initial setting of the fields to ‘In Stock’.
Now all fields are set to In Stock and as items are checked the change to N/A.
// Then go through each checked option NWF$('#' + varFruits + ' input:checked').each(function () { if (this.value == 'Apples') { NWF$('#' + varApple).val('N/A'); } else if (this.value == 'Oranges') { NWF$('#' + varOrange).val('N/A'); } else if (this.value == 'Pears') { NWF$('#' + varPear).val('N/A'); } }); });
On form load this is the view:
As items are checked they are set to N/A
And unchecked they are set back to in stock.
Does this match your requirement?
Hi Jake,
Thank you so much again for your help/reformatting! Is it possible to leave the initial setting of the fields to be blank, or do they need to be defined with a value?
If the item is not out of stock, they’ll enter a numeric value (i.e. stock quantity). Otherwise, when they checkmark the boxes, it’s to denote that “Hey, it’s out of stock!” therefore the stock quantity is N/A.
Also, even when I test the script, I’m not able to get it to output in the same format as yours:
Copied the code into Settings - Form (Custom Javascript):
Selected the multi-choice field, and assigned the variable to be:
Selected the text field for Apples Stock, and assigned the variable to be: