How To Configure the Cascading DropDownLis in ASP.NET Core - EJ 2 with Sql Server Database using Entity Framework Core?

[luis]

I need an example of how to configure the Cascading DropDownLis with fields from a sql server database using Entity Framework Core.
I can't make the implementation I had in asp.net mvc EJ1.


I need example to  Configure the above anexo in ASP.NET
Core - EJ 2.

Attachment: anexo_6deb9a74.rar

[Sevvandhi Nagulan]

Hi luis,

Greetings from Syncfusion Support.

We have configured the three dropdown lists for cascading operation and get the data from the SQL server. Also, we have created the individual table for data and stored the value in table using SQL. Using services we get the data from the SQL database and bound to the control. Kindly refer the below sample 

 

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Cascading_52c90395_(2)911212590_(1)-1736194950 

Regards, 

Sevvandhi N

[luis]

Thanks for the example, it doesn't work for me, this is what I have done to make it work... 


In the view

 

//Eventos de _DialogEditPartial3

 

    function clientechange3() {

 

        var clienteObj = document.getElementById('Ccliente1').ej2_instances[0];

        var frenteObj = document.getElementById('Cfrente1').ej2_instances[0];

        var puntoObj = document.getElementById('Cpunto1').ej2_instances[0];

        var servicioObj = document.getElementById('Cservicio1').ej2_instances[0];

 

        var tempQuery = new ej.data.Query().where('ClienteId', 'equal', clienteObj.value);

        frenteObj.query = tempQuery;

        frenteObj.text = null;

        frenteObj.dataBind();

 

        puntoObj.text = null;

        puntoObj.dataBind();

 

        servicioObj.text = null;

        servicioObj.dataBind();

    }

 

    function frentechange3() {

       

        var clienteObj = document.getElementById('Ccliente1').ej2_instances[0];

        var sedeObj = dataSelecionadoSede;

        var frenteObj = document.getElementById('Cfrente1').ej2_instances[0];

        var puntoObj = document.getElementById('Cpunto1').ej2_instances[0];

        var servicioObj = document.getElementById('Cservicio1').ej2_instances[0];

 

        var predicate = new ej.data.Predicate('ClienteId', 'equal', clienteObj.value);

        var predicate1 = new ej.data.Predicate('FrenteId', 'equal', frenteObj.value);

        var predicate2 = new ej.data.Predicate('SedeId', 'equal', sedeObj );

 

        var r = new ej.data.Predicate.and([predicate, predicate1, predicate2]);

 

        var tempQuery = new ej.data.Query().where(r);

        puntoObj.query = tempQuery;

        puntoObj.text = null;

        puntoObj.dataBind();

 

        servicioObj.text = null;

        servicioObj.dataBind();

    }

 

    function puntochange3() {

 

        var clienteObj = document.getElementById('Ccliente1').ej2_instances[0];

        var sedeObj = dataSelecionadoSede;

        var frenteObj = document.getElementById('Cfrente1').ej2_instances[0];

        var puntoObj = document.getElementById('Cpunto1').ej2_instances[0];

        var servicioObj = document.getElementById('Cservicio1').ej2_instances[0];

 

        var predicate = new ej.data.Predicate('ClienteId', 'equal', clienteObj.value);

        var predicate1 = new ej.data.Predicate('SedeId', 'equal', sedeObj);

        var predicate2 = new ej.data.Predicate('FrenteId', 'equal', frenteObj.value);

        var predicate3 = new ej.data.Predicate('PuntoId', 'equal', puntoObj.value);

 

        var r = new ej.data.Predicate.and([predicate, predicate1, predicate2, predicate3]);

 

        var tempQuery = new ej.data.Query().where(r);

        servicioObj.query = tempQuery;

        servicioObj.text = null;

        servicioObj.dataBind();

    }

In controller

 

// Obtener Clientes

        public JsonResult GetClientesList([FromBody]Data dm)

        {

            var val = _context.ClienteSet.Where(c => c.Suscriptor == Globals.gSuscriptor).Select(x => new { Value = x.Ccliente, Text = x.Nombre }).ToList();

            var Data = val.ToList();

            var count = val.Count();

 

            if (dm.Take != 0)

                Data = Data.Take(dm.Take).ToList();

            return Json(new { result = Data });

        }

 

 

        // Obtener Frentes

        public JsonResult GetFrentesList([FromBody]Data dm)

        {

            var val = _context.ServFrenteSet.Where(c => c.Suscriptor == Globals.gSuscriptor).Select(x => new { Value = x.Cfrente, Text = x.Nomfrente, ClienteId = x.Ccliente, SedeId = x.Csede }).ToList();

            var Data = val.ToList();

            var count = val.Count();

 

            if (dm.where != null)

            {

                Data = (from cust in Data

                        where cust.ClienteId.Equals(dm.@where[0].value)

                        select cust).ToList();

            }

 

            if (dm.Take != 0)

                Data = Data.Take(dm.Take).ToList();

            return Json(new { result = Data });

        }

 

// Obtener Puntos

        public JsonResult GetPuntosList([FromBody]Data dm)

        {

            var val = _context.ServPuntoSet.Where(c => c.Suscriptor == Globals.gSuscriptor).Select(x => new { Value = x.Cpunto, Text = x.Nompunto, ClienteId = x.Ccliente, FrenteId = x.Cfrente, SedeId = x.Csede }).ToList();

            var Data = val.ToList();

            var count = val.Count();

 

            if (dm.where != null && dm.where.Count > 0 && dm.where[0].predicates != null)

            {

                //Codes to Perform Filtering

                for (var i = 0; i < dm.where[0].predicates.Count; i++)

                {

                    switch (dm.where[0].predicates[i].field)

                    {

                        case "ClienteId":

                            Data = (from cust in Data

                                    where cust.ClienteId.ToString() == dm.@where[0].predicates[i].value

                                    select cust).ToList();

                        break;

                        case "FrenteId":

                            Data = (from cust in Data

                                    where cust.FrenteId.ToString() == dm.@where[0].predicates[i].value

                                    select cust).ToList();

                        break;

                        case "SedeId":

                            Data = (from cust in Data

                                    where cust.FrenteId.ToString() == dm.@where[0].predicates[i].value

                                    select cust).ToList();

                        break;

 

                    }

                    count = Data.Count;

                }

            }

 

            if (dm.Take != 0)

                Data = Data.Take(dm.Take).ToList();

            return Json(new { result = Data });

        }

       ....



Can it be improved?

[Sureshkumar P]

Hi luis, 

 

We have checked the shared code snippet. From the shared code snippet, we suspect that you are using URL adaptor and filtering happens in the server-side. So, we have prepared the modified the provided sample with urlAdaptor and server-side filtering. Kindly refer the below code, 

 

[Controller] 

 

public ActionResult UrlDatasource([FromBody]Data dm) 

{ 

var val = _jobService.DepartmentList(); 

var Data = val.ToList(); 

var count = val.Count(); 

if (dm.where != null) 

{ 

Data = (from cust in Data 

where cust.Id.Equals(dm.@where[0].value.ToString()) 

select cust).ToList(); 

} 

if (dm.take != 0) 

Data = Data.Take(dm.take).ToList(); 

return Json(Data); 

} 

 

    public ActionResult UrlDatasource1([FromBody]Data dm) 

    { 

        var val = _jobService.JobLevelList(); 

        var Data = val.ToList(); 

        var count = val.Count(); 

        if (dm.where != null && dm.@where[0].value != null) 

        { 

 

            Data = (from cust in Data 

                    where cust.Id.ToString().Equals(dm.@where[0].value.ToString()) 

                    select cust).ToList(); 

        } 

        if (dm.take != 0) 

            Data = Data.Take(dm.take).ToList(); 

        return Json(Data); 

    } 

 

    public ActionResult UrlDatasource2([FromBody]Data dm) 

    { 

        var val = _jobService.JobList(); 

        var Data = val.ToList(); 

        var count = val.Count(); 

        if (dm.where != null && dm.@where[0].value != null) 

        { 

            Data = (from cust in Data 

                    where cust.Id.ToString().Equals(dm.@where[0].value.ToString()) 

                    select cust).ToList(); 

        } 

        if (dm.take != 0) 

            Data = Data.Take(dm.take).ToList(); 

        return Json(Data); 

    } 

 

 

[html] 

 

<div class="padding-top"> 

    <ejs-dropdownlist id="Department" placeholder="Select a Department" change="departmentChange"> 

        <e-dropdownlist-fields text="DepartmentName" value="Id"></e-dropdownlist-fields> 

        <e-data-manager adaptor="UrlAdaptor" url="/Home/UrlDatasource/" crossDomain="true"></e-data-manager> 

    </ejs-dropdownlist> 

 

</div> 

 

 

And you must map the appropriate URL to the adaptor. 

 

Modified sample: https://www.syncfusion.com/downloads/support/directtrac/general/ze/Cascading_52c90395_(2)911212590_(1)-1736194950-836741702  

 

Regards, 

Sureshkumar P