How can I use vLookup ListView with vLookupIsLoadedCallback?

Forums vLooup for SharePoint How can I use vLookup ListView with vLookupIsLoadedCallback?

This topic contains 3 replies, has 2 voices, and was last updated by  Alexander Bautz 4 weeks, 1 day ago.

  • Author
    Posts
  • #26735

    Brett
    Participant

    Hi Alexander,

    I have been working on this for days and finally found the vLookupIsLoadedCallback function from your post here: https://spjsblog.com/forums/topic/alternating-row-style-and-pring/

    I’ve got an add-on js (datatables.net) working perfectly within the vLookup on each the Form using the vLookupIsLoadedCallback.
    But for the ListView page, the vLookup displays fine but the custom js is not loading.

    Confirmed with AdamP’s post here: January 24, 2018 https://spjsblog.com/forums/topic/list-view-only-show-parent-rows-with-vlookup-data/
    Unfortunately the vLookupIsLoadedCallback doesn’t work for list views.

    I tried adding the custom javascript to a CEWP above the List, below the list, in the middle of vLookup_ListView.html but it still won’t load.
    No errors in the console, tried both in Chrome and IE.

    Datatables provides column filtering and sorting on tables, so when a vLookup table becomes way huge, this would be a benefit to the UX.
    Image attached showing it working on the form.

    Any ideas on what I can do to get this working in the List-View?

    • This topic was modified 1 month ago by  Brett.
  • #26752

    Alexander Bautz
    Keymaster

    As you already know there is not callback when the vLookup table is loaded in a list view. Basically your only option would be to run your script on an interval to scan for vLookup tables not already styled with this plugin.

    Performance might be an issue if your list view has a lot of items, but you have to try it out.

    Alexander

  • #26779

    Brett
    Participant

    Thanks Alexander,
    I started with the code form the AdamP’s post above.
    At first it worked using setInterval, noerrors.

    
    
    setInterval(function(){ 
    $('.vLookupTable').DataTable(); 
    	}, 3000);

    But for some reason when I added more parameters to the Datatables function (eg: responsive etc), Datatables displays an error loading vLookup_innerTable_vLookup_4__Name.
    So I used SetTimeout instead and it works, no errors.
    This is the code placed in a cewp under vLookup_ListView.html.

    
    
    setTimeout(function(){
     $('.vLookupTable').DataTable({
    	paging: false, 
    	ordering: true, 
    	responsive: true, 
    	autoWidth: true 
    		});
    		},4000);

    Very happy with the end result.

  • #26788

    Alexander Bautz
    Keymaster

    I’m glad you found a workaround, but for this to work with grouped views and paging you must use an interval.

    The reason it fails is most likely because it tries to apply the datatable to the same vLookup multiple times. You must change the snippet something like this:

    setInterval(function(){ 
      jQuery('.vLookupTable').not(".the_class_added_by_datatable").DataTable(); 
    }, 3000);

    You must use the developer tools to inspect the .vLookupTable element to find a class that the datatable has been applied and replace “the_class_added_by_datatable” with it to not process the same table again.

    Alexander

You must be logged in to reply to this topic.