Typeahead doesn't work with very large lists #354

Closed
whitemx opened this Issue Aug 11, 2015 · 12 comments

Comments

Projects
None yet
3 participants
@whitemx
Owner

whitemx commented Aug 11, 2015

Reported by Ady Makombo

If the view that contains the lookup list for typeahead results is very large then no results are returned.

@whitemx whitemx added the bug label Aug 11, 2015

@whitemx whitemx self-assigned this Aug 11, 2015

@AdyMakombo

This comment has been minimized.

Show comment
Hide comment
@AdyMakombo

AdyMakombo Sep 2, 2015

Hi Matt,

Will you have the time to look at this issue for the next release of the XControls?

Ady

Hi Matt,

Will you have the time to look at this issue for the next release of the XControls?

Ady

@whitemx

This comment has been minimized.

Show comment
Hide comment
@whitemx

whitemx Sep 2, 2015

Owner

Hi Ady

As things stand I'm not actually sure when the next release of XControls
will be, I have a call with Steve booked for 15th September. I'll make sure
it's included in the list that we discuss.

Matt

Owner

whitemx commented Sep 2, 2015

Hi Ady

As things stand I'm not actually sure when the next release of XControls
will be, I have a call with Steve booked for 15th September. I'll make sure
it's included in the list that we discuss.

Matt

whitemx added a commit that referenced this issue Sep 7, 2015

whitemx added a commit that referenced this issue Sep 7, 2015

@whitemx

This comment has been minimized.

Show comment
Hide comment
@whitemx

whitemx Sep 7, 2015

Owner

Ady,

I've committed a change which seems to work OK for me in testing. I am concerned that there may well be performance issues on large data sets however when using Unplugged. Unplugged doesn't support FTSearch nor some of the more advanced view navigation utilities (such as NotesViewNavigator and ViewEntryCollection.getEntry) so I have to manually loop through the view to find entries matching the query.

Have a test of the latest version and see what you think.

Matt

Owner

whitemx commented Sep 7, 2015

Ady,

I've committed a change which seems to work OK for me in testing. I am concerned that there may well be performance issues on large data sets however when using Unplugged. Unplugged doesn't support FTSearch nor some of the more advanced view navigation utilities (such as NotesViewNavigator and ViewEntryCollection.getEntry) so I have to manually loop through the view to find entries matching the query.

Have a test of the latest version and see what you think.

Matt

@AdyMakombo

This comment has been minimized.

Show comment
Hide comment
@AdyMakombo

AdyMakombo Sep 10, 2015

Hi Matt,

I have tested the new version by replacing the code of the UnpSearchAhead XPage. For now, I don’t see any difference with the previous version.

However, the customer reported that when she was trying to display 232+ records, the typeahead selection list was empty. In my case, with 400+ records, using both the old and the new versions, the typeahead selection list is displayed BUT I can only select one of the first 8 records of the list. There is no way to scroll down the list and select the for example 9th or 10th item.

Ady

typeahead

PS: BTW, in this test, I removed the @unique to be able to return multiple records even if the job # is exactly the same.

Hi Matt,

I have tested the new version by replacing the code of the UnpSearchAhead XPage. For now, I don’t see any difference with the previous version.

However, the customer reported that when she was trying to display 232+ records, the typeahead selection list was empty. In my case, with 400+ records, using both the old and the new versions, the typeahead selection list is displayed BUT I can only select one of the first 8 records of the list. There is no way to scroll down the list and select the for example 9th or 10th item.

Ady

typeahead

PS: BTW, in this test, I removed the @unique to be able to return multiple records even if the job # is exactly the same.

@whitemx

This comment has been minimized.

Show comment
Hide comment
@whitemx

whitemx Sep 10, 2015

Owner

Ady,

Just to confirm, where did you test the code from?

Matt

Owner

whitemx commented Sep 10, 2015

Ady,

Just to confirm, where did you test the code from?

Matt

@AdyMakombo

This comment has been minimized.

Show comment
Hide comment
@AdyMakombo

AdyMakombo Sep 10, 2015

Hi Matt,

I tested it from my iPad and from Chrome.

Ady

Hi Matt,

I tested it from my iPad and from Chrome.

Ady

@whitemx

This comment has been minimized.

Show comment
Hide comment
@whitemx

whitemx Sep 11, 2015

Owner

It sounds like I need to see the customer's database, as it's working fine for me with thousands of documents in a view.

With regards to not being able to scroll, the typeahead is not a combo box, it only offers options to save typing, it doesn't display all possible options. As you type the options should refine themselves to become more relevant.

Owner

whitemx commented Sep 11, 2015

It sounds like I need to see the customer's database, as it's working fine for me with thousands of documents in a view.

With regards to not being able to scroll, the typeahead is not a combo box, it only offers options to save typing, it doesn't display all possible options. As you type the options should refine themselves to become more relevant.

@RichSharpe

This comment has been minimized.

Show comment
Hide comment
@RichSharpe

RichSharpe Sep 15, 2015

Is the lookup DB in the same DB as the XControls? I have an issue (which may need another ticket) if the lookup is in a different DB the search and type-ahead does not work. The UnpSearchAhead XPage (line 9) uses a DbClomun with @DbName whaich assumes the same DB. Most of the time I use the XControls I use an MVC approach and the data is in a separatet nsf. So really the UnpSearchAhead needs to see if dbName is a URL parameter and also UnpFlatViewList XPage needs to check for this as it uses the global database obj (current DB) on line 21.

Is the lookup DB in the same DB as the XControls? I have an issue (which may need another ticket) if the lookup is in a different DB the search and type-ahead does not work. The UnpSearchAhead XPage (line 9) uses a DbClomun with @DbName whaich assumes the same DB. Most of the time I use the XControls I use an MVC approach and the data is in a separatet nsf. So really the UnpSearchAhead needs to see if dbName is a URL parameter and also UnpFlatViewList XPage needs to check for this as it uses the global database obj (current DB) on line 21.

@whitemx

This comment has been minimized.

Show comment
Hide comment
@whitemx

whitemx Sep 15, 2015

Owner

I had changed this while updating the code that I recently checked in.

Owner

whitemx commented Sep 15, 2015

I had changed this while updating the code that I recently checked in.

@AdyMakombo

This comment has been minimized.

Show comment
Hide comment
@AdyMakombo

AdyMakombo Oct 19, 2015

I have copied the database on our FTP server in the \NEFS folder. You can also find the database here: \Dev01\Development\External\NEFS\PhoneAppTEST.nsf.

This version of the application contains 862 job codes and it works well. It starts failing as soon as I copy and paste 1 job code in the same application. (You can copy and paste an existing document).

So, with 862 job codes the app works well but with 863 job codes it starts crashing.

I have copied the database on our FTP server in the \NEFS folder. You can also find the database here: \Dev01\Development\External\NEFS\PhoneAppTEST.nsf.

This version of the application contains 862 job codes and it works well. It starts failing as soon as I copy and paste 1 job code in the same application. (You can copy and paste an existing document).

So, with 862 job codes the app works well but with 863 job codes it starts crashing.

@whitemx

This comment has been minimized.

Show comment
Hide comment
@whitemx

whitemx Oct 21, 2015

Owner

Right, I had completely got the wrong end of the stick with this, I'm going to commit a small change to unplugged.js that will allow you to choose whether you use a local lookup list (to avoid using AJAX requests), or a typeahead list using Ajax for large data sets.

In the latter case, the markup for the autocomplete field will be something like this:

<xp:inputText id="JobNumField" value="#{docedit.Job}"
    styleClass="required form-control typeahead JobNum" autocomplete="off">
  <xp:this.attrs>
    <xp:attr name="searchahead" value="UnpSearchAhead.xsp?chosenView=UnpJobSearch"></xp:attr>                   
  </xp:this.attrs>
</xp:inputText>     
Owner

whitemx commented Oct 21, 2015

Right, I had completely got the wrong end of the stick with this, I'm going to commit a small change to unplugged.js that will allow you to choose whether you use a local lookup list (to avoid using AJAX requests), or a typeahead list using Ajax for large data sets.

In the latter case, the markup for the autocomplete field will be something like this:

<xp:inputText id="JobNumField" value="#{docedit.Job}"
    styleClass="required form-control typeahead JobNum" autocomplete="off">
  <xp:this.attrs>
    <xp:attr name="searchahead" value="UnpSearchAhead.xsp?chosenView=UnpJobSearch"></xp:attr>                   
  </xp:this.attrs>
</xp:inputText>     

whitemx added a commit that referenced this issue Oct 21, 2015

whitemx added a commit that referenced this issue Oct 21, 2015

@whitemx whitemx modified the milestone: 1.5.2 Oct 21, 2015

@whitemx whitemx closed this Oct 21, 2015

@AdyMakombo

This comment has been minimized.

Show comment
Hide comment
@AdyMakombo

AdyMakombo Oct 27, 2015

Hi Matt,

I have made the recommended changes a) in the typeahead field and b) in
Unplugged.js. Unfortunately, I can't see any difference. Did I miss
something?

Typeahead field

<xp:inputText id="EPTL_Job" value="#{docedit.EPTL_Job}"
styleClass="required form-control typeahead JobNum" autocomplete="off">
xp:this.attrs
<xp:attr name="onChange" value="setLocation();">/xp:attr
<xp:attr name="searchahead" value="UnpSearchAhead.xsp?chosenView=UnpJobSearch">
/xp:attr
/xp:this.attrs
/xp:inputText

Unplugged.js

unp.initAutoComplete = function() {
$(".typeahead").each( function() {
var jslist = $(this).attr('jslist');
if (typeof jslist !== typeof undefined && jslist !== false){
$(this).typeahead({source: eval($(this).attr('jslist')), autoSelect: false});
}else{
//We must be looking for a remote list
var viewid = $(this).attr('searchahead');
$(this).typeahead({
source: function(query, process) {
return $.ajax({
url: viewid + "&query=" + query,
dataType: 'json',
success: function (data) {
return typeof data == 'undefined' ? false : process(data);
}
});
}
})
}
});
}

Regards,

Ady

Hi Matt,

I have made the recommended changes a) in the typeahead field and b) in
Unplugged.js. Unfortunately, I can't see any difference. Did I miss
something?

Typeahead field

<xp:inputText id="EPTL_Job" value="#{docedit.EPTL_Job}"
styleClass="required form-control typeahead JobNum" autocomplete="off">
xp:this.attrs
<xp:attr name="onChange" value="setLocation();">/xp:attr
<xp:attr name="searchahead" value="UnpSearchAhead.xsp?chosenView=UnpJobSearch">
/xp:attr
/xp:this.attrs
/xp:inputText

Unplugged.js

unp.initAutoComplete = function() {
$(".typeahead").each( function() {
var jslist = $(this).attr('jslist');
if (typeof jslist !== typeof undefined && jslist !== false){
$(this).typeahead({source: eval($(this).attr('jslist')), autoSelect: false});
}else{
//We must be looking for a remote list
var viewid = $(this).attr('searchahead');
$(this).typeahead({
source: function(query, process) {
return $.ajax({
url: viewid + "&query=" + query,
dataType: 'json',
success: function (data) {
return typeof data == 'undefined' ? false : process(data);
}
});
}
})
}
});
}

Regards,

Ady

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment