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.

Multiples dropdown cascading problems

Thread ID:

Created:

Updated:

Platform:

Replies:

130272 May 3,2017 11:15 AM May 12,2017 01:22 AM ASP.NET MVC 5
loading
Tags: DropDownList
Manolo
Asked On May 3, 2017 11:15 AM

Hi,

I've a problem in this scenario:

I've 3 dropdowns, the first and the second drop down cascade both to the third dropdown. The first drop down has multiples values, the second is a standard cascading.

In javascript, in cascade event, I've defined the behaviour for the cascading:

function communityCascade(args)
    {
        args.requiresDefaultFilter = false; // restrict the inbuilt mapping for cascading dropdown
        var predicates = [];
        for (var i = 0; i < args.cascadeValue.length; i++) {
            predicates.push(new ej.Predicate("Code", ej.FilterOperators.equal, args.cascadeValue[i]));
        }
        args.cascadeQuery = ej.Query().where(ej.Predicate["or"](predicates))
    }

When I click on first drop down, and the second, the cascading works fine, but if I unselect an item of second drop down, it doesn't cascade correctly.

This is my problem, but I attach an example for reproduce the error. At first instance, it works fine, but when I uncheck a country, cascading doesn't work fine

Attachment: DropDownProblem_b2dbc0f4.zip

Karthikeyan Viswanathan [Syncfusion]
Replied On May 7, 2017 11:41 AM

Hi Manolo, 

   Thanks for contacting Syncfusion support. 

Currently, Multiple cascading is not supported for multi selection dropdown list. If you need this functionality means we will provide a workaround sample for your requirement. 


Regards, 
Karthikeyan V. 


Manolo
Replied On May 7, 2017 01:38 PM

Ok, I thank you for an example

Karthikeyan Viswanathan [Syncfusion]
Replied On May 8, 2017 07:48 AM

Hi Manolo, 

As per your request, We have prepared a workaround sample for multiple cascading dropdown list.  
Please find the code example:  

<code> 
<script> 
    var communityData; 
    var countryData; 
    function communityCascade(args) { 
        args.requiresDefaultFilter = false; // restrict the inbuilt mapping for cascading dropdown 
        var predicates = []; 
        var casVal = args.cascadeValue.split(";"); 
        for (var i = 0; i < casVal.length; i++) { 
            predicates.push(new ej.Predicate("Code", ej.FilterOperators.equal, casVal[i])); 
        } 
        args.cascadeQuery = ej.Query().where(ej.Predicate["or"](predicates)); 
        var CountryInst = $("#Country").ejDropDownList("instance"); 
        if (ej.isNullOrUndefined(this["City"]) && !ej.isNullOrUndefined(CountryInst["City"])) { 
            this["City"] = CountryInst["City"]; 
        } 
        else if (ej.isNullOrUndefined(this["City"])) this["City"] = this.selectDropObj.model.dataSource; 
        var changedSource = ej.DataManager(this["City"]).executeLocal(args.cascadeQuery); 
 
        var communityData = []; 
        if (CountryInst._changedSource && CountryInst._changedSource.length > 0) communityData = communityData.concat(CountryInst._changedSource); 
        if (this.checkedStatus) { 
            if (this._changedSource && this._changedSource.length > 0) communityData = this._changedSource.concat(changedSource); 
            else communityData = communityData.concat(changedSource); 
            communityData = removeduplicate(communityData); 
        } 
        else { 
            communityData = removeduplicate(communityData); 
            for (var i = 0; i < changedSource.length; i++) { 
                for (var j = 0; j < this._changedSource.length; j++) { 
                    if (JSON.stringify(this._changedSource[j]) == JSON.stringify(changedSource[i])) 
                        this._changedSource.splice(j, 1); 
                } 
                for (var j = 0; j < CountryInst._changedSource.length; j++) { 
                    if (JSON.stringify(CountryInst._changedSource[j]) == JSON.stringify(changedSource[i])) 
                        CountryInst._changedSource.splice(j, 1); 
                } 
            } 
            communityData = this._changedSource; 
            communityData = communityData.concat(CountryInst._changedSource); 
        } 
        communityData = removeduplicate(communityData); 
        args.setCascadeModel = { "dataSource": communityData ,"enabled":true}; 
 
    } 
 
    function countryCascade(args) { 
        args.requiresDefaultFilter = false; 
        args.cascadeQuery = ej.Query().where("IdCountry", "equal", args.cascadeValue); 
        var ComunityInst = $("#Comunity").ejDropDownList("instance"); 
        if (ej.isNullOrUndefined(this["City"]) && !ej.isNullOrUndefined(ComunityInst["City"])) { 
            this["City"] = ComunityInst["City"]; 
        } 
        else if (ej.isNullOrUndefined(this["City"])) this["City"] = this.selectDropObj.model.dataSource; 
        var changedSource = ej.DataManager(this["City"]).executeLocal(ej.Query().where("IdCountry", "equal", args.cascadeValue)); 
        var countryData = []; 
        if (ComunityInst._changedSource && ComunityInst._changedSource.length > 0) countryData = countryData.concat(ComunityInst._changedSource); 
        if (this.checkedStatus) { 
            if (this._changedSource && this._changedSource.length > 0) countryData = this._changedSource.concat(changedSource); 
            else countryData = countryData.concat(changedSource); 
            countryData = removeduplicate(countryData); 
        } 
        else { 
            countryData = removeduplicate(countryData); 
            for (var i = 0; i < changedSource.length; i++) { 
                for (var j = 0; j < this._changedSource.length; j++) { 
                    if (JSON.stringify(this._changedSource[j]) == JSON.stringify(changedSource[i])) 
                        this._changedSource.splice(j, 1); 
                } 
                for (var j = 0; j < ComunityInst._changedSource.length; j++) { 
                    if (JSON.stringify(ComunityInst._changedSource[j]) == JSON.stringify(changedSource[i])) 
                        ComunityInst._changedSource.splice(j, 1); 
                } 
            } 
            countryData = this._changedSource; 
            countryData =  countryData.concat(ComunityInst._changedSource); 
        } 
        countryData = removeduplicate(countryData); 
        args.setCascadeModel = { "dataSource": countryData, "enabled": true }; 
    } 
    function removeduplicate(communityData) { 
        var uniqueNames = []; 
        $.each(communityData, function (i, el) { 
            if ($.inArray(el, uniqueNames) === -1) uniqueNames.push(el); 
        }); 
        return uniqueNames; 
    } 
</script> 
</code> 


Regards, 
Karthikeyan V. 


Manolo
Replied On May 11, 2017 07:09 AM

Buff.. it's complex.... thanks!

Prince Oliver [Syncfusion]
Replied On May 12, 2017 01:22 AM

Hi Manolo, 

Most Welcome. 
Please let us know if you require any further assistance. 

Regards, 
Prince 


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.

;