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. (Last updated on : Nov 16th 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Multiples dropdown cascading problems

Thread ID:

Created:

Updated:

Platform:

Replies:

130272 May 3,2017 03:15 PM UTC May 12,2017 05:22 AM UTC ASP.NET MVC 5
loading
Tags: DropDownList
Manolo
Asked On May 3, 2017 03:15 PM UTC

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 03:41 PM UTC

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 05:38 PM UTC

Ok, I thank you for an example

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

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 11:09 AM UTC

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

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

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.

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

;