1. Home
  2. Forum
  3. Blazor
  4. No Change Event with generated class

No Change Event with generated class

Hi Syncfusion,

it is not possible to select an element from a list with my generated class and I have not received a change event. I use Syncfusion.EJ2.Blazor in Version 17.4.0.40.

My example has two drop-down lists. The first one uses the generated class and does not work, the second dropdown list uses a simpler class and works. My example:

@page "/testpage"

@using Syncfusion.EJ2.Blazor.DropDowns
@page "/testpage"

@using Syncfusion.EJ2.Blazor.DropDowns

 

TestPage


 

DropDownList1 value is:@DropVal1

 
   
   
 

 

DropDownList2 value is:@DropVal2

 
   
   
 

@code {
  public string DropVal1;
  public string DropVal2;

  // NSwagStudio generated class, not working
  public class Filter1
  {
    /// Name of a filter expression
    [Newtonsoft.Json.JsonProperty("name", Required = Newtonsoft.Json.Required.DisallowNull, NullValueHandling = Newtonsoft.Json.NullValueHandling.Ignore)]
    public string Name { get; set; }

    /// Caption of a filter expression
    [Newtonsoft.Json.JsonProperty("caption", Required = Newtonsoft.Json.Required.DisallowNull, NullValueHandling = Newtonsoft.Json.NullValueHandling.Ignore)]
    public string Caption { get; set; }
  }

  // modified class, working
  public class Filter2
  {
    public string Name { get; set; }

    public string Caption { get; set; }
  }

  // List of items
  public List filterList1 = new List{
    new Filter1 { Caption="All Mailpieces", Name="all" },
    new Filter1 { Caption="abc Mailpieces", Name="abc" },
    new Filter1 { Caption="dde Mailpieces", Name="dde" }
  };
  public List filterList2 = new List {
    new Filter2 { Caption="All Mailpieces", Name="all" },
    new Filter2 { Caption="abc Mailpieces", Name="abc" },
    new Filter2 { Caption="dde Mailpieces", Name="dde" }
  };

  // Event Handler
  private void onChange1(Syncfusion.EJ2.Blazor.DropDowns.ChangeEventArgs args)
  {
    System.Diagnostics.Debug.WriteLine($"onChange1: {args.Value} - {args.ItemData}");
    DropVal1 = args.Value;
    StateHasChanged();
  }
  private void onChange2(Syncfusion.EJ2.Blazor.DropDowns.ChangeEventArgs args)
  {
    System.Diagnostics.Debug.WriteLine($"onChange2: {args.Value} - {args.ItemData}");
    DropVal2 = args.Value;
    StateHasChanged();
  }
}

Do I need separate model and dto classes or is there a way to use the generated class?

Kind Regards

Pascal

4 Replies
PB Pascal Botzke January 7, 2020 03:28 PM UTC

Hi Syncfusion,

it is not possible to select an element from a list with my generated class and I have not received a change event. I use Syncfusion.EJ2.Blazor in Version 17.4.0.40.

My example has two drop-down lists. The first one uses the generated class and does not work, the second dropdown list uses a simpler class and works. My example:

@page "/testpage"

@using Syncfusion.EJ2.Blazor.DropDowns

<h3>TestPage</h3>

<p>DropDownList1 value is:<strong>@DropVal1</strong></p>
<EjsDropDownList TItem="Filter1" TValue="string" Value="@DropVal1" DataSource="@filterList1">
    <DropDownListEvents TValue="string" ValueChange="onChange1"></DropDownListEvents>
    <DropDownListFieldSettings Text="Caption" Value="Name"></DropDownListFieldSettings>
</EjsDropDownList>

<p>DropDownList2 value is:<strong>@DropVal2</strong></p>
<EjsDropDownList TItem="Filter2" TValue="string" Value="@DropVal2" DataSource="@filterList2">
    <DropDownListEvents TValue="string" ValueChange="onChange2"></DropDownListEvents>
    <DropDownListFieldSettings Text="Caption" Value="Name"></DropDownListFieldSettings>
</EjsDropDownList>

@code {
  public string DropVal1;
  public string DropVal2;

  // NSwagStudio generated class, not working
  public class Filter1
  {
    ///Name of a filter expression
    [Newtonsoft.Json.JsonProperty("name", Required = Newtonsoft.Json.Required.DisallowNull, NullValueHandling = Newtonsoft.Json.NullValueHandling.Ignore)]
    public string Name { get; set; }

    ///Caption of a filter expression
    [Newtonsoft.Json.JsonProperty("caption", Required = Newtonsoft.Json.Required.DisallowNull, NullValueHandling = Newtonsoft.Json.NullValueHandling.Ignore)]
    public string Caption { get; set; }
  }

  // modified class, working
  public class Filter2
  {
    public string Name { get; set; }

    public string Caption { get; set; }
  }

  // List of items
  public List filterList1 = new List{
    new Filter1 { Caption="All Mailpieces", Name="all" },
    new Filter1 { Caption="abc Mailpieces", Name="abc" },
    new Filter1 { Caption="dde Mailpieces", Name="dde" }
  };
  public List filterList2 = new List {
    new Filter2 { Caption="All Mailpieces", Name="all" },
    new Filter2 { Caption="abc Mailpieces", Name="abc" },
    new Filter2 { Caption="dde Mailpieces", Name="dde" }
  };

  // Event Handler
  private void onChange1(Syncfusion.EJ2.Blazor.DropDowns.ChangeEventArgs args)
  {
    System.Diagnostics.Debug.WriteLine($"onChange1: {args.Value} - {args.ItemData}");
    DropVal1 = args.Value;
    StateHasChanged();
  }
  private void onChange2(Syncfusion.EJ2.Blazor.DropDowns.ChangeEventArgs args)
  {
    System.Diagnostics.Debug.WriteLine($"onChange2: {args.Value} - {args.ItemData}");
    DropVal2 = args.Value;
    StateHasChanged();
  }
}

Do I need separate model and dto classes or is there a way to use the generated class?

Kind Regards

Pascal

PS: Update problem with source code

GG Gopi Govindasamy Syncfusion Team January 8, 2020 02:27 PM UTC

Hi Pascal,  

Greetings from Syncfusion support.  

We have validated your query with shared code snippet. In Filter1 class you have set mismatch field name to JsonProperty, so the selected value not deserialized and not updated to component. We have changed the code snippet and prepared sample based on your requirement. Please find the code snippet for your reference.  

@using Syncfusion.EJ2.Blazor; 
@using Syncfusion.EJ2.Blazor.DropDowns; 
<h3>TestPage</h3> 
 
<p>DropDownList1 value is:<strong>@DropVal1</strong></p> 
<EjsDropDownList TItem="Filter1" TValue="string" @bind-Value="@DropVal1" DataSource="@filterList1"> 
    <DropDownListFieldSettings Text="Caption" Value="Name"></DropDownListFieldSettings> 
</EjsDropDownList> 
 
<p>DropDownList2 value is:<strong>@DropVal2</strong></p> 
<EjsDropDownList TItem="Filter2" TValue="string" @bind-Value="@DropVal2" DataSource="@filterList2"> 
    <DropDownListFieldSettings Text="Caption" Value="Name"></DropDownListFieldSettings> 
</EjsDropDownList> 
 
@code { 
    public string DropVal1 { get; set; } 
    public string DropVal2 { get; set; } 
 
    // NSwagStudio generated class, not working 
    public class Filter1 
    { 
        ///  Name of a filter expression 
        [Newtonsoft.Json.JsonProperty("Name", Required = Newtonsoft.Json.Required.DisallowNull, NullValueHandling = Newtonsoft.Json.NullValueHandling.Ignore)] 
        public string Name { get; set; } 
 
        ///Caption of a filter expression 
 
        [Newtonsoft.Json.JsonProperty("Caption", Required = Newtonsoft.Json.Required.DisallowNull, NullValueHandling = Newtonsoft.Json.NullValueHandling.Ignore)] 
        public string Caption { get; set; } 
    } 
 
    // modified class, working 
    public class Filter2 
    { 
        public string Name { get; set; } 
 
        public string Caption { get; set; } 
    } 
 
    // List of items 
    public List<Filter1> filterList1 = new List<Filter1>() { 
    new Filter1 { Caption="All Mailpieces", Name="all" }, 
    new Filter1 { Caption="abc Mailpieces", Name="abc" }, 
    new Filter1 { Caption="dde Mailpieces", Name="dde" } 
  }; 
    public List<Filter2> filterList2 = new List<Filter2> { 
    new Filter2 { Caption="All Mailpieces", Name="all" }, 
    new Filter2 { Caption="abc Mailpieces", Name="abc" }, 
    new Filter2 { Caption="dde Mailpieces", Name="dde" } 
  }; 
 
} 

Notes: We have provided two-way binding support in our component. So you can use @bind-Value property to update the value bi-directional and no need to update the value in ValueChange event.  


Regards,
Gopi G. 


PB Pascal Botzke January 8, 2020 03:28 PM UTC

Thank you for your quick response.

We will try to change the generator or we will write the ApiClient manually.

Kind Regards

Pascal

SP Sureshkumar P Syncfusion Team January 9, 2020 12:52 PM UTC

Hi Pascal, 
 
 
Regards, 
Sureshkumar P 


Loader.
Up arrow icon