Thanks for your feedback, we will see what we can do to improve this.

FYI - It fires on page load AND when doing subsequent lookups based on field values changing - not just page load.

EDIT: Nested call-backs don't seem necessary with LF 10.3.x. To see the nesting, review previous versions of this post.

Yes, it's a bit odd. I thought it was seeing that because my code wasn't well implemented. I decided to nest the call-backs:

$(document).ready(function () {
  $(document).on("onloadlookupfinished", function () {
     //page load code here
  });
  $(document).on("lookupstarted", function (event) {
    //start lookup code here. This is where I turn on the loader/spinner/wait/wizzy/hourglass animation
    }
  });
  $(document).on("lookupcomplete", function (event) {
    if (event.triggerId==='lookup1096') {
      //run specific code here
    }
   //turn off the loader animation here.
  });
});

I'm just checking in to see if the issue I mentioned over a year ago has been improved/fixed.

Every time I click save from the "Lookup Rules" screen of a form all of the rules get renumbered with a new ruleId.  This immediately breaks all of my JavaScript based on these rules.

Any luck in getting a method to call a rule based on a consistent value.  Whether we start naming the rules or they have a static rule id (like a field id), we really need to have this stay consistent.  We are deploying this and it just takes 1 time of someone updating the lookup rules and the javascript it broken until we fix it.  Please fix this ASAP or it is not useful for being deployed.

I've started using the "triggerId" instead of "ruleId":

  $(document).on('lookupcomplete', function (event) {
    if (event.triggerId===$('.Job select').attr('id')) {
      //do stuff
    }
  });

Great idea using the class on the trigger ID.  I tried doing something like this but never got it working so I really appreciate you posting the code.  I still hope they provide a better option (since one field can actually trigger multiple lookups) but this will work for the processes I have in place now.  Thanks again.

Where is everyone putting this code in their javascript? No matter where I put the code, I never get anything in the console when the lookup is complete?

    $(document).on("lookupcomplete", function (event) {
  alert (event.triggerId);
});

Edit: the only way it seems to truly know when your lookups are done is to create a table called LookupComplete that holds a single value. Than add a lookup to that table at the end of all your lookups to transfer the single value to a hidden field. Then use the .on('change' method

for example:

$(document).ready(function () {
  var a = '';
  $(document).on("onloadlookupfinished", function () {
    //do stuff or not.
  });
  $(document).on("lookupstarted",function(event) {
    //do something;
  });
  $(document).on("lookupcomplete",function(event) {
    //do something;
  });
});

Anywhere within the .ready function should work but I often put it up the top.

What is the difference between onloadlookupfinished and lookupcomplete?

onloadlookupfinished  is triggered after the form has completed it's initial load.

lookupcomplete is triggered after a lookup rule has completed.

Ok, I have a form that is a table with a lookup rule to populate rows into the table. I am trying to use lookupcomplete but it never seems to fire.

As for running code on initial load, I use $(document).ready. So my code looks like this:

$(document).ready(function () {
  $(document).on("lookupcomplete",function(event) {
    console.log('hello world');
  });
});

Hi Chad,
The onloadlookupfinished goes inside the document.ready block, as in my example.

Ah ok, I just changed lookupcomplete to onloadlookupfinished and it works, executing my code after my lookup rules are complete. The lookupcomplete appears to be ambiguous and no longer working.

Not sure if this has been addressed anywhere else, but I found that lookupcomplete is for outside of the $(document).ready block. Once it's outside of the block it functions only when a lookup is complete. My example is I was changing the date to show times, but when I tried to change the date it didn't display the way I wanted it to. So I took the block out of the document.ready block and changed "onloadlookupfinished" to "lookupcomplete" and it worked.

So to make a short story long, lookupcomplete seems to work best outside the document.ready block and is for running the block underneath it once another lookup is completed. 

I'll be happy to elaborate and give code examples if it's needed by anyone. Just thought I'd add this in case anyone was having a similar issue I was.  

Tanner, I'd be interested in seeing a code sample.  Thanks!

	$(document).on('lookupcomplete', function(event){
      
    	$('.Time_Select option').each(function(){
        	let NameVals = $(this).text().split('|');
        	$(this).text(NameVals[0]);
			$(this).val(NameVals[1]);
          
      if ($(this).val() == 1){
        $(this).attr('disabled', true);
        $(this).addClass('booked');
      }; 
          
		});
      
    });

So the if statement could probably go under the $(document).ready block, but what the $(document).on statement does is take each option in the dropdown menu and split it at the "|". From there it sets the first half as the text for the option and the second half as the value of the option. That's where the if statement comes in.

So my issue was I had the "lookupcomplete" as "onloadlookupfinished" and inside the $(document).ready block. And what would happen is the first time the lookup completed it would work, but on changing the date it would force it back to the standard text.

In this case, I'm using this for a scheduler that allows the user to select a time that isn't already booked based on the date selected. The time would look like this "08:00|1" if it was booked and "09:00|0" if it wasn't. So it would change all of them from that to just the time and the 1 or 0 would be the value.

When I took the $(document).on block out of the $(document).ready and left it as "onloadlookupfinished" it still didn't work. So I finally changed it to "lookupcomplete" and that's what allowed it to change the options after changing the date.

So I guess that "onloadlookupfinished" is for when you only need the event to run after all lookups are complete and that's it. And "lookupcomplete" is every time a lookup is completed. So in this case, "lookupcomplete" worked because when I changed the date it would run another lookup to get the times which required the event to run again.

Sorry for the long-winded post. It took me a couple of days of trial and error on top of other projects to get this to work right. I also have this tied to a database, a workflow, and a shared calendar that creates the appointment for the team it's tied to. Let me know if I didn't make sense somewhere.

I'm not able to get this to work either.

$(document).on('lookupcomplete', function (event) {
  if (event.triggerId===$('.Job select').attr('id')) {
    //do stuff
  }
});

I have a table with 4 fields.  It uses the first 2 fields (ID and DOB) in a lookup to get the last 2 fields (First Name and Last Name).

I've tried the above on each field and with an &&  and || with both fields as an attempt to get some sort of 'recognition' from the system, but I get nothing.

I've tried checking the trigger for the first and/or second fields like...   if(event.triggerId == 'Field2(1)')  {  ...stuff here...   }  individually and with && and || as well.  

I'm currently using the following which works, but seems like the long way around... 

        if (event.triggerId==='lookup2890(1)') 
        {    var sname2 = $('[name = "Field23(1)"]').val();     
// alert(sname2);
            if(sname2  != '')
            { ...stuff here...      }
            else 
            {   ... stuff here...   }
        } 

Always log your Trigger IDs so that you can see what your working with. You can do this by adding this one line to the start of your onlookupcomplete method.

console.log(event.triggerId);

I use the alert, alert(event.triggerId); to display messages.  Does using console.log give better/different results?

Hmm, I haven't seen that - I'll take a look. What do you mean by "after lookup rules are performed"? Do you mean when you send the lookup Ajax requests, or when the responses arrive and the data is finished processing?

The event is triggered after the responses arrive and data is finished processing.

Thanks, will check it out and report back.

I have been looking for something similiar,  could you provide a few more details how this is implemented.   My form has a lookup that uses 2 fields as the inputs to my stored procedure,  so i get a autofill button that must be clicked to fire the lookup.   What element do I bind the listener to..

The "onloadlookupfinished" event will be triggered when lookup rules has finished perform when load the form, so you can add something like following to check whether the lookup rules has been performed completely if you want to do actions after it is completed:

$(document).on("onloadlookupfinished", function () {
 $('#Field1').val("lookup finished");
 });

Hi Xiang,

I added this code to my form:

$(document).on("onloadlookupfinished", function () {
 alert("lookup finished");
 });

What is suppose to trigger it? I have a lookup that triggers to a user input and I have a lookup, in another form, which triggers on parameters passed through the URL. Neither are causing this onloadlookupfinished to trigger.

-Ben

Have you applied Forms 10.1 update 2? The event should be triggered on page load no matter the values that trigger the lookups is from default value or passed through URL or calculated by Forms Calculation.

I see!  It works on page load (and when the page has values in the URL) but not when a user clickes in AutoFill to complete Lookup Rules. Is it suppose to?

-Ben

Yes, it is expected, this event is called "onloadlookupfinished" which is only supposed to work on page load.

I don't follow. Are you saying there will be a new event added or that the current one is supposed to work for both scenarios. In my testing, it only works on pages load and lookups performed on page load but not subsequent lookups.

I mean you can tell from the event name that this event only supposed to work when page load. This is the only one custom event we currently support.

It would be nice to have an event that fires when autofill is clicked or lookup is fired,  not just on page load.    The scenario I needed it for was to populate the address control.   Since you cannot bind the address control to a lookup, you have to do it with javascript.   I added a table with columns for each address element,   so my lookup populated the table,   then I used javascript to populate each field in the address control.    I accomplished what i needed with an onchange event,   but i am taking the gamble that all the table fields have been populated.   An event like this would be very helpful.   Your current implementation has been very helpful in other situations.  Maybe it is something Laserfiche could look into.

There are also cases where the lookup doesn't return any values (due to no match), so onchange doesn't fire. In those situations you have no elegant way of knowing whether the lookup completed.

Support fill address field with lookup result is in our to do list.

There will be lookupstarted and lookupcomplete custom events added in Forms 11 for detecting whether lookup rules has been completed.

Ohhh - I want that functionality - my forms have two-layer lookup, so although this helps me by allowing me to check for completion of the load lookup instead of using a timer, I'm still having to use a timer to wait for completion of the second lookup.

Xiuhong Xiang: this isn't working. Either the implementation is wrong, or there is some miscommunication as to what is needed.

I added timestamps to my code to understand when events are firing. I have the following timestamps:

1. Inside document.ready (first line)

2. Inside an "onloadlookupfinished" event

3. Inside ajaxSuccess events

The ajaxSuccess events fire when an Ajax request completes. It's provided by jQuery.

Results below:

Timestamps are in milliseconds. As you can see, Ajax requests keep firing and finishing waaaay after the onloadlookupfinished event (they last about 10-15 seconds - I can see Ajax requests sent to /lookup?formId=?). So it doesn't look like the event does what it is supposed to, which is to trigger when ALL lookups on the form finish loading when the form first loads so that custom JavaScript code can know when to start executing.

By the way, this whole thing came about because we're trying to find a workaround for that nasty Forms bug where lookups wipe out all dropdown values except the value that comes from the database, preventing users from changing their selection. You can read more about that here. I have probably spent over 20 hours on that issue alone at this point and frankly I'm pretty frustrated that the fix wasn't implemented in the most recent Forms update.

@████████ - the problem is that the event is fired when the lookups that are triggered by the page load are complete, any subsequent lookups that get triggered by code in your Javascript or other similar "subsequent activity" are not included.  So if you have field A populated when the form loads, and then code in your Javascript populates field B and then that triggers another lookup - the event is only called once field A is populated, it doesn't wait for field B.  I'm having the same difficulties.  I don't think a good fix exists yet for this.

Regarding your other issue, about the drop-downs (sorry everyone for getting off the original topic), I have a sort-of workaround:
1. Load the contents of the drop-down list using one page-load lookup (not the selected value, but the list of all possible options).
2. Then using another page-load lookup, load the selected value into a hidden field.
3. In your Javascript set-up a change event function that is triggered when the hidden field is changed.  Set that function to grab the item from the hidden field and select that item in dropdown list.
This code snippet works with a hidden field which has css class selectedValueHidden and a dropdown which has css class selectedValue - where both fields are in a collection:

var s = $(this).closest("ul").find('.selectedValueHidden input').val();
$(this).closest("ul").find('.selectedValue option').filter(function () { return $(this).html() == s; }).prop('selected', true);

This has two problems however:
1. This isn't going to complete before the "onloadlookupfinished" event is fired, so you may have values updating after that code processes.
2. I'm having an issue (which I haven't fixed yet) where about 1% of the time, some of the hidden field change events are not called, so I end up with dropdowns not having a selected value.  That problem is mentioned in this question: http://answers.laserfiche.com/questions/111996/Forms--Multiple-Level-Lookups-occasionally-fail#112014

I don't have any second-level lookups on that form. All lookups fire when the form first loads.

I'm already using a similar workaround for the dropdowns, but it's acting funky now with Update 3. Used to work fine in Update 2. I opened a case with LF support to troubleshoot. Lookups in general are acting a bit strangely for me. I have 7 lookup rules, and each one fires 7 times for some reason.

Oh sorry.  I'm fairly new to forms, and have only worked with Update 3.  I too have felt like lookups are not always working like I would think they should be - and I can definitely understand the frustration with something ceasing to work when it had been before.  Good luck.