We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.

ejDropDownList with Angular - Remote Data with Remote Filtering

Thread ID:

Created:

Updated:

Platform:

Replies:

121736 Jan 20,2016 12:03 PM Feb 22,2016 07:13 AM JavaScript 11
loading
Tags: ejDropDownList
Yann Bruneau
Asked On January 20, 2016 12:03 PM

Hello,

I am trying to use the ejDropDownList with remote Data :

<select ej-dropdownlist e-fields-text="XXX" e-fields-value="ID" e-datasource="data" e-enableFilterSearch="true" e-filterType="contains" e-allowVirtualScrolling="true" e-virtualScrollMode="ej.VirtualScrollMode.Normal" e-itemsCount="20" e-value="data.XXX" e-watermarkText=""> </select>

$scope.data= ej.DataManager({ url: "XXXX", adaptor: new ej.UrlAdaptor() });

public object XXX([FromBody] DataManager dm)

I do get the initial 20 records, but when I try to search, the query is never send back to the server.

What did I miss? I cannot load all the record in the dropdownlist and make the filtering on the client side because I have 100 000 records.

Thank you,

Yann



Ezhil S [Syncfusion]
Replied On January 21, 2016 07:42 AM

Hi Yann,

Thank you for contacting Syncfusion support.

Query #1: I do get the initial 20 records
                Based on the code sample shared, it looks like that VirtualScrolling is not implemented with the DropDownList and only 20 items loaded based on e-itemCount value given. To overcome this issue, we suggest you to pass the e-virtualScrollMode value as string “normal” or “continuous” directly.
Sample link: http://jsplayground.syncfusion.com/ttx2xlzz

Query #2: when I try to search, the query is never send back to the server
                Search will be applied only on the list items loaded in the page and it will not send request back to the server. In virtual scrolling initially items are loaded based on itemsCount value and on every scroll items will be fetched from the server, where on enabling search filtering is applied only for the items available at that time in the pop up. So there will be no request back to server on filter search.
                However we can achieve this scenario using continuous scroll mode and handling the request processing to server manually in search event. We can get the search key and send request to server from search event to fetch items based on search key programatically to update the pop up items. If this is the scenario you need to obtain with virtual scrolling and search, we can consider this as a custom sample and provide you further details. Or else explain us your requirement, so that we can provide you an alternative solution.

Please let us know if you have any other queries.

Regards,
Ezhil S

Yann Bruneau
Replied On January 21, 2016 10:12 AM

Hello Ezhil,

Thank you for your answer.

"If this is the scenario you need to obtain with virtual scrolling and search, we can consider this as a custom sample and provide you further details." -> Yes, this is exactly what I need

I would love to see a sample of that.

Thank you,

Yann

Yann Bruneau
Replied On January 26, 2016 05:04 AM

Hello,

Do you have any timing for the sample?
"If this is the scenario you need to obtain with virtual scrolling and search, we can consider this as a custom sample and provide you further details."

Thank you,

Yann

Arun Palaniyandi [Syncfusion]
Replied On January 27, 2016 08:20 AM

Hi Yann,

Thanks for the patience.

We have prepared a sample based on your requirement. So please kindly find the attached sample below.

http://www.syncfusion.com/downloads/support/directtrac/149250/ze/RemoteSearch-1765161988


Please let us know if you have any other queries.

Regards,
Arun P


Yann Bruneau
Replied On January 28, 2016 08:47 AM

Hi Arun,

Thank you for your sample. It is exactly what I needed.
I still need to make some adaptation to make it works on my piece of code.

Do you plan to include this feature in the February service pack? I do think that this feature should be a candidate to be part of the included feature of the dropdownList.

Thank you for your time,

Yann

Arun Palaniyandi [Syncfusion]
Replied On January 29, 2016 07:04 AM

Hi Yann,

Thanks for the suggestion.

Query :”Do you plan to include this feature in the February service pack? I do think that this feature should be a candidate to be part of the included feature of the dropdownList.”

In the given sample, we have overridden some of existing functionalities to achieve the required scenario. If we are merging with source level, it will leads to multi selection maintenance issue when do searching in DropDownList control, so we have provided as custom sample to avoid those issues in users end.

Please let us know if you have any other concerns.

Regards,
Arun P


Yann Bruneau
Replied On February 12, 2016 09:46 AM

Hello,

I am using the sample you sent me and I have a issue.
When you type at the regular speed, you get a "No suggestion" but when you type very slowly, then you find what you are looking for...
Is there is timeout somewhere I could increase?

Please see the 2 attached screenshots.

Thank you,

Yann


Attachment: Timeout_4f428953.zip

Yann Bruneau
Replied On February 12, 2016 10:32 AM

Sorry, Second point: What is the best way to set the Value and Text of the dropdownbox with a value that is not in the current page?
I still need to be two way angular binded.

Thank you

Arun Palaniyandi [Syncfusion]
Replied On February 15, 2016 08:28 AM

Hi Yann,

Thanks for the update,

Query 1 : “When you type at the regular speed, you get a "No suggestion" but when you type very slowly, then you find what you are looking for...Is there is timeout somewhere I could increase?”

No need to extend any time interval in code execution. This is because, time taken to fetch the date from remote have extended, so that “No Suggestion” will be shown on DropDownlist Items. So we suggest you include the following highlighted line in Search event method

<code>
function onSearch(args) {
                window.search = args;
               
                if (!window.searchFlag) {
                                …..
                }
                else {
                    args.cancel = true;
                    console.log("continuous search have restricted");
                }
            }
</code>

Please find the modified sample for your reference below:
http://www.syncfusion.com/downloads/support/forum/121736/ze/RemoteSearch1502254616

Query 2: “What is the best way to set the Value and Text of the dropdownbox with a value that is not in the current page?

We can select the items through value property but the given value must be available on list items which have already loaded in DropDownlist otherwise it won’t select that particular items.  This is because, we will compare the given value with loaded items values and then select the particular items.

Please let us know if you have any queries,

Regards,
Arun P


Yann Bruneau
Replied On February 17, 2016 01:12 PM

Hello,

Query #1: Thank you!

Query #2: Should I add the value to the datamanager or directly to the dropdownList? Maybe there is a simple way to add this data to the datamanager after it get the data from the server?

Thank you,

Yann

Arun Palaniyandi [Syncfusion]
Replied On February 22, 2016 07:13 AM

Hi Yann,

Thanks for the patience,

Query:  Should I add the value to the datamanager or directly to the dropdownList? Maybe there is a simple way to add this data to the datamanager after it get the data from the server?”

We have an option to preselect the items while fetching the data from server, This can be done by using ‘Selected’ property under fields in Dropdownlist control. it will select the items which is mentioned with selected property while scrolling on popup for virtual items.  

Please find the below API Link:
http://help.syncfusion.com/aspnet/dropdownlist/databinding

Please find the sample for the scenario :
http://jsplayground.syncfusion.com/3fyh5isy

Please let us know if you have any concerns.
Regards,
Arun P



CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.

;