I am using the following code to make changes to a previous multiple choice question with a second multiple choice. However, when you deselect an option in the middle of the second multiple choice question, it deselects the next option in line as it is moved to the location the cursor is currently on. Is there a way to fix this bug?
function matchSummary() {
var newselection=fd.field('toselected').value;
fd.field('toselected').options=newselection;
fd.field('toselected').value=newselection;
fd.field('toalltests').value=newselection;
/*
var str1 = fd.field('toselected').value;
var str2 = fd.field('toalltests').value;
var res = str1.concat(str2);
fd.field('memo').value=res;
*/
}
fd.field('toselected').$on('change', matchSummary);
Essentially, I want to make an editable shopping cart with two multiple choice checkbox fields. The first field contains all options you can add to the shopping cart, and the second field is the shopping cart. I want to be able to remove items from the shopping cart by unchecking the the checkbox for an option.
The re-population of to selected in the above code was an attempt to get rid of the bug that unchecks items in the shopping cart other than the one I unchecked.
Thank you for the quick reply. I have set up this code in two places, one for the first question, and one for the second question so that they mirror each other's changes. However, when you deselect an option from the second question, the next value in line (that gets moved over when deselection occurs) becomes unchecked, though the .value of the second question still has that option included in it.
In the above screen shot I shared, you can see in 'MultilineText1' a print out of the .value of the first question, followed by the second. As you can see, both selections are printed in 'MultilineText1' twice, meaning that the .value for both questions should be correct. However, as you can see in the screenshot, the 'Creatine Transport Deficiency' has been unchecked, even though it is still included in the .value of the second question. I have added notes to the screenshot so this is easier to see.
This screenshot was made after a deselection of the option preceding 'Creatine Transport Deficiency', and when deselected, 'Creatine Transport Deficiency' was deselected, too, though it is still included in .value as it should be. Why is the check box not checked if it is still included in the .value?
//Show all selected Tests in the second multiple checkbox field
function summarize() {
var testList = fd.field('toalltests').value;
fd.field('toselected').options = testList;
fd.field('toselected').value = testList;
}
fd.field('toalltests').$on('change', summarize);
summarize();
//Change the First multiple checkbox field to match changes to the summary
function matchSummary() {
var newselection=fd.field('toselected').value;
fd.field('toselected').options=fd.field('toselected').value;
fd.field('toalltests').value=newselection;
var str1 = fd.field('toselected').value;
var str2 = fd.field('toalltests').value;
var res = str1.concat(str2);
fd.field('memo').value=res;
}
fd.field('toselected').$on('change', matchSummary);
As I understand, one choice field is primary - stores all possible options, and the other one is the shopping cart that you need to update. Thus, you need to update options and call the function that updates selection on form load only for the shopping cart choice field.
Please see the code.
function updateShoppingCart() {
//change options
fd.field('ShoppingCart').options = fd.field('AllOptions').value;
//set the field value
fd.field('ShoppingCart').value = fd.field('AllOptions').value;
}
function updateAllOptions() {
fd.field('AllOptions').value = fd.field('ShoppingCart').value;
}
//update shopping cart when the field is changed
fd.field('AllOptions').$on('change', updateShoppingCart)
//update shopping cart on form load
updateShoppingCart()
//update all options field
fd.field('ShoppingCart').$on('change', updateAllOptions)
//update test selections (All options)
function matchSummary() {
fd.field('toalltests').value=fd.field('toselected').value;
}
fd.field('toalltests').$on('change', summarize);
summarize();
fd.field('toselected').$on('change', matchSummary);
However, I am still getting the bug I described in the screenshot above. I have included this screenshot again to show what happens when deselecting an option in the middle of the shopping cart list.
I've added the line to the code that checks all inputs, please try it out:
fd.rendered(function () {
function updateShoppingCart() {
console.log('updateShoppingCart');
//change options
fd.field('toselected').options = fd.field('toalltests').value;
//set the field value
fd.field('toselected').value = fd.field('toalltests').value;
}
function updateAllOptions() {
console.log('updateAllOptions');
fd.field('toalltests').value = fd.field('toselected').value;
$(fd.field('toselected').$el).find('input').prop('checked', true);
}
//update shopping cart when the field is changed
fd.field('toalltests').$on('change', updateShoppingCart)
//update shopping cart on form load
updateShoppingCart()
//update all options field
fd.field('toselected').$on('change', updateAllOptions)
});
I ran the above code and the functions seem to be running and changing their options as written; were you able to reproduce the issue with the form I exported?