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. Image for the cookie policy date
  1. Home
  2. Forum
  3. Blazor
  4. Integer Bind Value

Integer Bind Value

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

7 Replies
GG Gopi Govindasamy Syncfusion Team August 13, 2019 06:03 AM UTC

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 } 
    }; 
} 
 
  
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. 
 
  
Regards, 
Gopi G. 



DO Dominik August 14, 2019 04:11 AM UTC

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

GG Gopi Govindasamy Syncfusion Team August 14, 2019 10:37 AM UTC

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. 


Regards, 
Gopi G. 


NC NKOUAMBIA CHIMENE September 13, 2019 02:17 PM UTC

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; }
     }





GG Gopi Govindasamy Syncfusion Team September 16, 2019 06:18 AM UTC

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 0th 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.  
 
 
To know more about DropDownList component, please refer the below documentation link.  
  

Regards,
Gopi G. 



NC NKOUAMBIA CHIMENE September 16, 2019 02:57 PM UTC

Hello Gopi thanks for answer,

It works for me

Chimène Nk.

GG Gopi Govindasamy Syncfusion Team September 17, 2019 08:45 AM UTC

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. 


Loader.
Up arrow icon