Question

Clearing Lookup Value from Collection

Forms

Updated June 1, 2020

asked on May 30, 2020 • Show version history

I have a collection that is populated by lookup values. This collection also includes a checkbox that, when checked, should clear one of the values in the collection.

For the purposes of this question, let's say it's a name field and an e-mail field, with a checkbox to clear out the e-mail.

I have some code that works, but it also re-triggers the lookup, so the e-mail value is briefly cleared but then it's immediately populated again:

$(document).ready(function()
        {
            $('.cf-collection').click( function ()
                {
                    $('.cf-collection > div').each(function ()
                        {
                            $(this).find('#q1').click(function()
                                {
                                    $(this).closest("div").find('#q2 input').val("");
                                });
                        });
                });
        });

I tried adding a second field for e-mail that's not populated by the lookup, defaulting it to the e-mail value using the following calculation, and then clearing it when the box is checked instead of clearing the original e-mail field. The value was cleared, but it was repopulated if another value was added to the collection. It also then contained every e-mail in the collection, not just the one from the same row. Calculation used:

=my_collection.email_field

Ideally, I can figure out how to stop the lookup from re-triggering when JS runs to clear the value. Can anyone assist?

Thank you!

collection_question.JPG (18.63 KB)

| Download

0 0

Answer

SELECTED ANSWER

replied on June 1, 2020

Give this a try:

const ID_Email = 4;
const ID_EmailCB = 5;
const ID_EmailRef = 6;

$(document).on("change", "#q"+ID_EmailRef, updateEmail);
$(document).on("click", "#q"+ID_EmailCB, updateEmail);

function updateEmail() {
  var id = $(this).find("input").prop("id");
  var row = id.substring(id.indexOf("(")+1, id.indexOf(")"));
  
  var val = $('[id="Field' + ID_EmailRef + '(' + row + ')"]').val();
  var checked = $('[id="Field' + ID_EmailCB + '(' + row + ')-0"]').prop("checked");
  
  if (checked && this.id == "q"+ID_EmailCB)
    $('[id="Field' + ID_Email + '(' + row + ')"]').val("").change();
  else if (!checked)
    $('[id="Field' + ID_Email + '(' + row + ')"]').val(val).change();
};

Replace the numbers in the first three lines with the ID numbers of the email field, the checkbox field, and the hidden email reference field respectively.

This will clear the email field when the checkbox is initially clicked, and when a lookup rule is run after it is already checked, it will not copy it over (and will leave whatever was already in the email field, in case you have the user changing these).

My test form, for reference:

0 0

Replies

replied on June 1, 2020

What is your end goal here, to allow the user to enter a different email for that row of the collection or leave that email field blank? If you just want to ignore the email address for that row, you could use the same lookup, but instead use a field rule for the ignore part. Set up your lookup rule to fill name and associated email address, and use a field rule to Hide email address and ignore the data if checkbox is selected. If the checkbox is selected, the email field will be hidden and discarded on submission.

Technically, you could also have the field rule show a new Email_Manual field if you wanted the user to enter in a different email in that empty input box.

2 0

replied on June 1, 2020

We're passing these values to Workflow and using them in a Stored Procedure. I'll need to think through if this would work in our specific scenario. Thank you for the suggestion!

0 0

replied on June 1, 2020

If you're just sending the values to WF and need the checkbox to make certain fields blank, I think this field rule method will work and won't require any custom JS.

1 0

replied on June 1, 2020

Hi Jennifer,

Try adding a .change() when the value is cleared:

$(this).closest("div").find('#q2 input').val("").change();

1 0

View 5 previous replies

replied on June 1, 2020

That didn't work - it's the same thing.

(I should note that if I check and uncheck the box, eventually the change will "stick" - and sometimes it does work the first time, but not usually)

0 0

replied on June 1, 2020

How is the lookup rule re-running? Do you have other fields on the form that trigger it?

0 0

replied on June 1, 2020

Yes, the "Name" field is populated by the lookup so users can select a name from the list (they see a dropdown of available names to select from the lookup).

The "Email" field then does a lookup based on what's in the "Name" field.

0 0

replied on June 1, 2020

I assume the problem is related to the fields being part of a collection. When one field changes within the collection, that triggers the lookups for that collection to re-run. Just a guess, though.

0 0

replied on June 1, 2020

Then in that case, you can add another field into the collection set which is hidden. Then in the lookup rule, fill this hidden field with the email instead of the email field. You can then use JavaScript to copy the value to the email field if the checkbox is not checked.

1 0

replied on June 1, 2020

That's basically what I was trying to do with the field calculation I mentioned above, but it was problematic. I'll see what I can piece together with Javascript.

0 0

SELECTED ANSWER

replied on June 1, 2020

Give this a try:

const ID_Email = 4;
const ID_EmailCB = 5;
const ID_EmailRef = 6;

$(document).on("change", "#q"+ID_EmailRef, updateEmail);
$(document).on("click", "#q"+ID_EmailCB, updateEmail);

function updateEmail() {
  var id = $(this).find("input").prop("id");
  var row = id.substring(id.indexOf("(")+1, id.indexOf(")"));
  
  var val = $('[id="Field' + ID_EmailRef + '(' + row + ')"]').val();
  var checked = $('[id="Field' + ID_EmailCB + '(' + row + ')-0"]').prop("checked");
  
  if (checked && this.id == "q"+ID_EmailCB)
    $('[id="Field' + ID_Email + '(' + row + ')"]').val("").change();
  else if (!checked)
    $('[id="Field' + ID_Email + '(' + row + ')"]').val(val).change();
};

Replace the numbers in the first three lines with the ID numbers of the email field, the checkbox field, and the hidden email reference field respectively.

My test form, for reference:

0 0

replied on June 1, 2020

This is exactly what I needed. THANK YOU so much!!! I appreciate your help!

1 0

You are not allowed to follow up in this post.

Question

Question

Clearing Lookup Value from Collection

Answer

Replies

Sign in to reply to this post.