Integer Bind Value

[Dominik]

Hello,

If I try to compile my code, I get following error:
Can't convert from "Microsoft.AspNetCore.Components.EventCallback<int>" to "string".

I suspect the problem is that I have an integer value as the binding value.

My Code:

<EjsDropDownList Placeholder="select..." @bind-Value="@Field.FieldTypeId" DataSource="@FieldTypes">

          <DropDownListFieldSettings Value="FieldTypeId" Text="Caption"></DropDownListFieldSettings>

</EjsDropDownList>

@code

{

    protected Field Field { get; set; } = new Field();

    public List<FieldType> FieldTypes { get; set; }

}

Any ideas?

Thanks

Dominik

[Gopi Govindasamy]

Hi Dominik, 

  

Greetings from Syncfusion support. 

  

We've checked the snippet and error log of your shared code. The cause of the issue is that the Value property and the datasource mapping property is not matching the data types. So this issue has happened and we suggest that you bind the Value data type in the DropDownListFieldSettings to the Value field as mentioned In the below code example to get rid of the reported issue. 

 

<p>@Fields.FieldTypeId</p> 

 

<EjsDropDownList Placeholder="select..." @bind-Value="@Fields.FieldTypeId" DataSource="@FieldTypes"> 

    <DropDownListFieldSettings Text="Caption" Value="FieldTypeId"></DropDownListFieldSettings> 

</EjsDropDownList> 

 

@code 

{ 

    protected Field Fields { get; set; } = new Field(); 

 

    public class Field 

    { 

        public int FieldTypeId { get; set; } = 2; 

    } 

    public class FieldType 

    { 

        public string Caption { get; set; } 

 

        public int FieldTypeId { get; set; } 

    } 

    public List<FieldType> FieldTypes { get; set; } = new List<FieldType> 

    { 

        new FieldType() { Caption = "Australia", FieldTypeId = 1 }, 

        new FieldType() { Caption = "Bermuda", FieldTypeId = 2 }, 

        new FieldType() { Caption = "Canada", FieldTypeId = 3 }, 

        new FieldType() { Caption = "Cameroon", FieldTypeId = 4 } 

    }; 

} 

 

Sample Link: https://www.syncfusion.com/downloads/support/forum/146638/ze/WebApplication1-1775401935  

  

Note: If you are not binding the value on initial loading to dropdownlist component, please mention the datatype in TValue property.  

 

To know more about DropDownList component, please refer the below documentation link. 

 

UG Link: https://ej2.syncfusion.com/blazor/documentation/dropdownlist/data-binding/#two-way-data-binding  

  

Regards, 

Gopi G. 

[Dominik]

Hi Gopi,

I've upgraded to Version 17.2.0.40-beta and now it works fine.
I just get the error "System.InvalidCastException: Null object cannot be converted to a value type at System.Convert.ChangeType (System.Object value, System.Type conversionType, System.IFormatProvider provider)" in the console but all funtions works well.

Regards,

Dominik

[Gopi Govindasamy]

Hi Dominik,  

We were able to reproduce the reported issue at our end and confirmed your reported problem as bug at our end. We will fix and included the solution on our upcoming release, which is expected to schedule on end of August 2019. You can track the status of this issue using below feedback portal link. 

https://www.syncfusion.com/feedback/8205/null-exception-throwing-the-method-changetype-while-dynamically-setting-null-value  

Regards, 

Gopi G. 

[NKOUAMBIA CHIMENE]

Hello,

I Have a problem with Integer binding value with dropdownlist in blazor serveer side app, I Have update to the last syncfusion for blazor, below is my code.

Even if I use Value or bind-value it doesn.t give, if I doesn't specified the TValue it give Error but when specified to integer then it just bugs, the simple <select> work fine but dropdownlist doesn't.

Thank,

Chimène Nk.

  <link rel='nofollow' href="https://cdn.syncfusion.com/ej2/17.2.50/material.css" rel="stylesheet" />

    <script src="https://cdn.syncfusion.com/ej2/17.2.50/dist/ej2.min.js"></script>

    <script src="https://cdn.syncfusion.com/ej2/17.2.50/dist/ejs.interop.min.js"></script>

<div class="col-sm-7">

                     @{ int salle =(context as TemplateArgs).IdSalleExamenSys; 

                        }

                    <select id="IdSalleExamenSysv" class="form-control @(@validateur.ChampsValide("IdSalleExamenSys") ? "valid" : "invalid" )" @bind="@((context as TemplateArgs).IdSalleExamenSys)" >

                        <option value="">-- Select Salle --</option>

                        @foreach (var salleexamen in salleExamenList)

                        {

                            <option value="@salleexamen.IdSalleExamenSys">@salleexamen.NomSalle</option>

                        }

                    </select>     

                   <EjsDropDownList TValue="int" Value="@salle" ID="IdSalleExamenSys" DataSource="@salleExamenList" Placeholder="Sélectionner la salle" CssClass="e-field"> 

                        <DropDownListFieldSettings Value="IdSalleExamenSys" Text="NomSalle"></DropDownListFieldSettings> 

                    </EjsDropDownList>                          

                </div>

public class TemplateArgs

    {

        public string Subject { get; set; }

        public string EventType { get; set; }

        public DateTime? StartTime { get; set; }

        public DateTime? EndTime { get; set; }

        public string Description { get; set; }

        public int IdSalleExamenSys { get; set; }

        public int IdTypeConsultation { get; set; }       

    }

    public TemplateArgs Model = new TemplateArgs();

    

    public List<SalleExamenSys> salleExamenList = new List<SalleExamenSys>();

    public class SalleExamenSys{

        public int IdSalleExamenSys { get; set; }

        public string NomSalle { get; set; }

     }

[Gopi Govindasamy]

Hi Dominik,  

Thanks for your update. 

We have validated your issue with code snippet and you missed to bind the “@salle” value into dropdowlist, so the value not selected in dropdownlist. By default <select> element is first option is selected. If you need to select first item on initial loading means, we have provided Index property, you can set 0^th index into component automatically first item is selected. We have prepared sample based on your requirement. Please find the code snippet for value select both Value and Index property and sample for your reference.  

@using Syncfusion.EJ2.Blazor.DropDowns; 

 

<div class="col-sm-7"> 

    <EjsDropDownList @bind-Value="@salle" ID="IdSalleExamenSys" DataSource="@salleExamenList" Placeholder="Sélectionner la salle" CssClass="e-field"> 

        <DropDownListFieldSettings Value="IdSalleExamenSys" Text="NomSalle"></DropDownListFieldSettings> 

    </EjsDropDownList> 

</div> 

 

@code{ 

 

    public int salle { get; set; } = 2; 

 

    public TemplateArgs Model = new TemplateArgs(); 

 

    public List<SalleExamenSys> salleExamenList = new List<SalleExamenSys>(); 

 

    public class SalleExamenSys 

    { 

        public int IdSalleExamenSys { get; set; } 

        public string NomSalle { get; set; } 

    } 

 

    protected override void OnInitialized() 

    { 

        salleExamenList = new List<SalleExamenSys>() 

    { 

            new SalleExamenSys() { IdSalleExamenSys = 1, NomSalle="Salle1" }, 

            new SalleExamenSys() { IdSalleExamenSys = 2, NomSalle="Salle2" } 

        }; 

    } 

} 

 

(Or) 

 

 

<div class="col-sm-7"> 

    <EjsDropDownList TValue="int?" ID="IdSalleExamenSys11" Index=0 DataSource="@salleExamenList" Placeholder="Sélectionner la salle" CssClass="e-field"> 

        <DropDownListFieldSettings Value="IdSalleExamenSys" Text="NomSalle"></DropDownListFieldSettings> 

    </EjsDropDownList> 

</div> 

 

 

Note: If you have used @bind-Value property means, no need to define datatype in TValue property.  

 

Sample Link: https://www.syncfusion.com/downloads/support/directtrac/146638/ze/BlazorApp1530769286  

 

To know more about DropDownList component, please refer the below documentation link.  

  

UG Link: https://ej2.syncfusion.com/blazor/documentation/dropdownlist/data-binding/#two-way-data-binding  

Regards,
Gopi G. 

[NKOUAMBIA CHIMENE]

Hello Gopi thanks for answer,

It works for me

Chimène Nk.

[Gopi Govindasamy]

Hi Dominik,  

 

Thanks for your update.  

 

We are happy to hear that your issue has been resolved. Please feel free to contact us if you need any further assistance on Syncfusion components. 

 

Regards, 

Gopi G.