data dont show in dropdownlist,combobox,autocoplete ,..

[ebi torabi]

in hosted core blazor data is taken from(using web api) the database but in the dropdownlist,combobox,autocoplete ,..

[Gopi Govindasamy]

Hi Ebi,   

 

Greetings from Syncfusion Support. 

 

We have prepared the sample for AutoComplete, ComBobox and DropDownlist in the hosted core blazor using web API services and data is fetched from the services in our end. Please find the code snippet below, 

 

[Index.razor] 

 

        <EjsAutoComplete placeholder="Select a Employee" query="@Query"> 

            <EjsDataManager Url="/api/SampleData" Adaptor=@Syncfusion.EJ2.Blazor.Adaptors.WebApiAdaptor CrossDomain="true"></EjsDataManager> 

            <AutoCompleteFieldSettings Value="FirstName"></AutoCompleteFieldSettings> 

        </EjsAutoComplete> 

 

    <EjsComboBox PlaceHolder="Select a Employee" Query="@Query"> 

        <EjsDataManager Url="/api/SampleData" Adaptor="@Syncfusion.EJ2.Blazor.Adaptors.WebApiAdaptor" CrossDomain="true"></EjsDataManager> 

        <ComboBoxFieldSettings Value="FirstName"></ComboBoxFieldSettings> 

    </EjsComboBox> 

 

 

    <EjsDropDownList ID="Employees" PlaceHolder="Select a Employee" Query="@Query"> 

        <EjsDataManager Url="/api/SampleData" Adaptor="@Syncfusion.EJ2.Blazor.Adaptors.WebApiAdaptor" CrossDomain="true"></EjsDataManager> 

        <DropDownListFieldSettings Value="FirstName"></DropDownListFieldSettings> 

    </EjsDropDownList> 

 

 

@code{ 

    public string Query { get; set; } = "new ej.data.Query().select(['FirstName']).take(7).requiresCount()"; 

} 

 

WebApplication3.Server -> Controller 

public class SampleDataController : Controller 

    { 

        public List<Employees> result = new List<Employees>(); 

        // GET api/Employees  

        [HttpGet] 

        public object Get() 

        { 

            var queryString = Request.Query; 

            var data = Employees.GetAllRecords().ToList(); 

            if (queryString.Keys.Count != 0) 

            { 

                StringValues Skip; 

                StringValues Take; 

                int skip = (queryString.TryGetValue("$skip", out Skip)) ? Convert.ToInt32(Skip[0]) : 0; 

                int top = (queryString.TryGetValue("$top", out Take)) ? Convert.ToInt32(Take[0]) : Employees.GetAllRecords().Count(); 

                return new { result = data.Skip(skip).Take(top), count = Employees.GetAllRecords().Count() }; 

            } 

            else 

            { 

                return data; 

            } 

        } 

 

        // GET api/values/5 

        public string Get(int id) 

        { 

            return "value"; 

        } 

        

      ….. 

 

    } 

 

Note: For complete code, kindly refer to the server side application controller page 

 

Please find the sample below  

 

Sample Link: https://www.syncfusion.com/downloads/support/forum/145881/ze/WebApplication3965331558 

 

Regards, 

Gopi G. 

 

[ebi torabi]

Thanks for the great sample project .This code worked well for web api. But the data is not displayed in the list binding

[Gopi Govindasamy]

Hi Ebi, 

Thanks for your updating. 

We have checked your scenario, we suspect that the cause of the problem is that ASP.NET Core 1.0 + has camel casing problems while serializing the JSON Object. Please add the ContractResolver options to your application side under the Startup.cs file to avoid camel conversion during the serialization process. This relates to the specifics of ASP.NET Core and we recommend that you refer to the following article describing how to solve a comparable problem.  

  

Reference Link: https://dotnetcoretutorials.com/2017/01/02/pascalcase-vs-camelcase-asp-net-core/  

 

please follow code snippet for your reference.  

 

[WebApplication3.Server -> StartUp.cs] 

      public void ConfigureServices(IServiceCollection services) 

        { 

 

            services.AddMvc().AddNewtonsoftJson(options => { 

                options.SerializerSettings.ContractResolver = new DefaultContractResolver(); 

            }); 

 

 

            ...        

                   } 

Regards, 

Gopi G.