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. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Selecting Items by Fields array not working checkItem(), selectItem(), selectMuiltipleItems()

Thread ID:

Created:

Updated:

Platform:

Replies:

141950 Jan 11,2019 04:07 PM UTC Jan 14,2019 09:41 AM UTC Angular - EJ 2 1
loading
Tags: ListView
Michael Snuffer
Asked On January 11, 2019 04:43 PM UTC

I have an array (loaded by DataManager, WebAPI). I bind to the DataManager/Array. Everything works great. But when I try to programatically select items in typeScript using any of the following functions: checkItem(), selectItem(), selectMuiltipleItems(), nothing.

Let say in our DataManager returns an array of 
Widgets = [{ keyId: 1, name: "Xinger"}, { keyId: 2, name: "Wranger"}, { keyId: 3, name: "Singer"}];

After the data is loaded (dataManager.ready.then()), I try to pre-select 2 items from the list:
this.listView.selectMultipleItems([{ id: 1}, {id: 3}]);

This does not work.

I don't have time to totally debug your code, but I think I have narrowed it down to the following:  I think the bolded "fields" should be probably be changed to "fieldData"?  My fix may or may not be correct or complete, but the code you have ends up resolving to fields["keyId"], which will never return anything since be definition the fields variable will only have the Fields structure { id: , text: }

    ListView.prototype.findItemFromDS = function (dataSource, fields, parent) {
        var _this = this;
        var resultJSON;
        if (dataSource && dataSource.length && fields) {
            dataSource.some(function (data) {
                var fieldData = getFieldValues(data, _this.listBaseOption.fields);
                //(!(fid) || id === fid) && (!(ftext) || text === ftext) && (!!fid || !!ftext)
                if ((fields[_this.fields.id] || fields[_this.fields.text]) &&
                    (!fields[_this.fields.id] || (!isNullOrUndefined(fieldData[_this.fields.id]) &&
                        fieldData[_this.fields.id].toString()) === fields[_this.fields.id].toString()) &&
                    (!fields[_this.fields.text] || fieldData[_this.fields.text] === fields[_this.fields.text])) {
                    resultJSON = (parent ? dataSource : data);
                }
                else if (typeof data !== 'object' && dataSource.indexOf(data) !== -1) {
                    resultJSON = (parent ? dataSource : data);
                }
                else if (!isNullOrUndefined(fields[_this.fields.id]) && isNullOrUndefined(fieldData[_this.fields.id])) {
                    var li = _this.element.querySelector('[data-uid="'
                        + fields[_this.fields.id] + '"]');
                    if (li && li.innerText.trim() === fieldData[_this.fields.text]) {
                        resultJSON = data;
                    }
                }
                else if (fieldData.hasOwnProperty(_this.fields.child) && fieldData[_this.fields.child].length) {
                    resultJSON = _this.findItemFromDS(fieldData[_this.fields.child], fields, parent);
                }
                return !!resultJSON;
            });
        }
        else {
            resultJSON = dataSource;
        }
        return resultJSON;
    };

Again, regardless of whether my fix is correct, the control is not working. I've spent hours trying to figure out why my code is incorrect. I may be wrong, but I do no longer believe the problem is on my end. 

Thanks for looking into this. Please let me know if I have done something wrong or when this is corrected.

FYI: I tried with a straight array (instead of a DataManager) with identical results. I am working with "@syncfusion/ej2-angular-lists": "^16.4.44". Thank you.

Christopher Issac Sunder K [Syncfusion]
Replied On January 14, 2019 09:41 AM UTC

Hi Michael Snuffer, 

Thanks for contacting Syncfusion support. 

In ListView component, we can programmatically select ListView item using methods like selectItem, selectMultipleItems, checkItem, checkAllItems with proper Id mapping. 

In your case, you are pre-selecting some of the list items. This can be done by two ways. 
  • Using isChecked Property.

By setting isChecked property to your JSON data, you can pre-select list items. Refer the below snippet. 

public data = [ 
        { text: 'Hennessey Venom', id: 'list-01' }, 
        { text: 'Bugatti Chiron', id: 'list-02', isChecked: true }, 
        { text: 'Bugatti Veyron Super Sport', id: 'list-03' } 
] 

In the above snippet, Second list item will be pre-selected on rendering. 
  • Using Listview selection methods

If you don’t have isChecked property in your dataSource, you can utilize actionComplete event for programmatically pre-selecting items like the below snippet. 

private onActionComplete(): void { 
    this.listViewInstance.selectMultipleItems([{ ProductID: 2 }, { ProductID: 3 }]); 
  } 
In your sample, we suspect that you may missed to map id field which is a mandatory one. 
If you are still facing the problem, Please revert us with a simple reproducible sample which helps us to provide you a prompt solution at the earliest. 

Thanks, 
Christo 


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.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon 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.Close Icon

Live Chat Icon For mobile
Live Chat Icon