SfListBox OnChange Event - Not firing correctly

[David Krasicki]

I created a simple page with a Dual List Box as found in the following example:  https://blazor.syncfusion.com/documentation/listbox/dual-listbox/

The issue I'm seeing is the ValueChanged event fires when items are selected in the List Box, not when the list of Values changes.  For example, when I move an item from the left List Box over to the right List Box, I expect the ValueChanged event to fire.  Instead, it only fires if I click on (select) one of the items in the List Box.

Am I using the wrong event?  Which event triggers when the underlying DataSource changes?  Is there a way to override the functionality of the move events found in the Dual List Box tool bar?

[Madhan Venkateshan]

Hi David Krasicki, 

 

Good day to you. 

 

You can use ‘OnActionComplete’ event and it will be triggered when you move an item, please refer the below code snippets. 

 

<div id="listbox1"> 

    <h4>Group A</h4> 

    <SfListBox TValue="string[]" DataSource="@GroupA" Scope="#listbox" TItem="CountryCode"> 

        <ListBoxEvents TValue="string[]" OnActionComplete="OnActionComplete"></ListBoxEvents> 

        <ListBoxFieldSettings Text="Name"></ListBoxFieldSettings> 

        <ListBoxToolbarSettings Items="@Items"></ListBoxToolbarSettings> 

    </SfListBox> 

</div> 

<div id="listbox2"> 

    <h4>Group B</h4> 

    <SfListBox TValue="string[]" ID="listbox" DataSource="@GroupB" TItem="CountryCode"> 

        <ListBoxFieldSettings Text="Name"></ListBoxFieldSettings> 

    </SfListBox> 

</div> 

 

@code { 

    public string[] Items = new string[] { "moveUp", "moveDown", "moveTo", "moveFrom", "moveAllTo", "moveAllFrom" }; 

    public List<CountryCode> GroupA = new List<CountryCode> 

  { 

        new CountryCode{ Name = "Australia", Code = "AU" }, 

        new CountryCode{ Name = "Bermuda", Code = "BM" }, 

        …. 

    }; 

 

    public List<CountryCode> GroupB = new List<CountryCode> 

  { 

        new CountryCode{ Name = "India", Code = "IN" }, 

        new CountryCode{ Name = "Italy", Code = "IT" }, 

        …. 

    }; 

 

    public class CountryCode 

    { 

        public string Name { get; set; } 

        public string Code { get; set; } 

    } 

 

    public void OnActionComplete(Syncfusion.Blazor.DropDowns.ActionCompleteEventArgs args) 

    { 

        if(args.EventName == "moveTo" || args.EventName == "moveUp") 

        { 

            // perform your operation 

        } 

    } 

} 

 

Regards, 

Madhan V 

[Jay Goodison]

Does OnActionComplete work when you use a template

[Saranya Dhayalan]

Hi David,  

We have checked your reported query, In our current behavior OnActionComplete event is not  triggered when you move an item. We have confirmed that the issue is defect and logged a defect report for the same. The fix for this issue is estimated to be available in our upcoming patch release and appreciate your patience until then. 

 

Regards, 

Saranya D