Multiselect Close Eventcallback

Hi,

i am using the multiselect. I want to subscribe to the close event, but if i do so, there is a weird behavior going on and the event is not fired. My code:

@page "/development/nils/multibox-test"
@using Syncfusion.Blazor.DropDowns
@using Syncfusion.Blazor.Buttons

<div class="control-section col-lg-12 checkbox">
@if(@values != null) {
<span> @string.Join(",", values)</span>
}
<div class="col-lg-9">
<div class="content multiselect-checkbox">
<SfMultiSelect TValue="string[]" @bind-Value="@values" Placeholder="Select countries" Mode="@VisualMode.CheckBox" DataSource="@Country" ShowSelectAll="@ShowSelectAllCheckBox" EnableSelectionOrder="@EnableSelectionOrders" ShowDropDownIcon="@EnableDropDownIcon" FilterBarPlaceholder="Search countries" PopupHeight="350px">
<MultiSelectFieldSettings Text="Name" Value="Code"></MultiSelectFieldSettings>
<MultiSelectEvents TValue="string[]" OnClose="@OnSelect"></MultiSelectEvents>
</SfMultiSelect>
</div>
</div>
<div class="col-lg-3">
<div class="content property-section">
<table>
<tr>
<td>
<SfCheckBox Label="ShowSelectAll" @bind-Checked="@checkSelectAll" ValueChange="@OnSelectAllChange"></SfCheckBox>
</td>
</tr>
<tr>
<td>
<SfCheckBox Label="DropDown Button" @bind-Checked="@dropdownButton" ValueChange="@OnDropDownButtonChange"></SfCheckBox>
</td>
</tr>
<tr>
<td>
<SfCheckBox Label="Selection reorder" @bind-Checked="@selectionReorder" ValueChange="@OnSeletionReorder"></SfCheckBox>
</td>
</tr>
</table>
</div>
</div>
</div>
@code{

public string[] values {get;set;} = new string[0];

public bool ShowSelectAllCheckBox { get; set; } = true;
public bool EnableSelectionOrders { get; set; } = true;
public bool EnableDropDownIcon { get; set; } = true;
private bool checkSelectAll { get; set; } = true;
private bool dropdownButton { get; set; } = true;
private bool selectionReorder { get; set; } = true;
public void OnSelectAllChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args)
{
this.ShowSelectAllCheckBox = args.Checked;
}
public void OnDropDownButtonChange(Syncfusion.Blazor.Buttons.ChangeEventArgs args)
{
this.EnableDropDownIcon = args.Checked;
}
public void OnSeletionReorder(Syncfusion.Blazor.Buttons.ChangeEventArgs args)
{
this.EnableSelectionOrders = args.Checked;
}

public void OnSelect (Syncfusion.Blazor.DropDowns.PopupEventArgs args)
{
var test = 1;
}
public class Countries
{
public string Name { get; set; }
public string Code { get; set; }
}
List<Countries> Country = new List<Countries>
{
new Countries() { Name = "Australia", Code = "AU" },
new Countries() { Name = "Bermuda", Code = "BM" },
new Countries() { Name = "Canada", Code = "CA" },
new Countries() { Name = "Cameroon", Code = "CM" },
new Countries() { Name = "Denmark", Code = "DK" },
new Countries() { Name = "France", Code = "FR" },
new Countries() { Name = "Finland", Code = "FI" },
new Countries() { Name = "Germany", Code = "DE" },
new Countries() { Name = "Greenland", Code = "GL" },
new Countries() { Name = "Hong Kong", Code = "HK" },
new Countries() { Name = "India", Code = "IN" },
new Countries() { Name = "Italy", Code = "IT" },
new Countries() { Name = "Japan", Code = "JP" },
new Countries() { Name = "Mexico", Code = "MX" },
new Countries() { Name = "Norway", Code = "NO" },
new Countries() { Name = "Poland", Code = "PL" },
new Countries() { Name = "Switzerland", Code = "CH" },
new Countries() { Name = "United Kingdom", Code = "GB" },
new Countries() { Name = "United States", Code = "US" },
};
}
<style>
.property-section .e-checkbox-wrapper {
margin: 10px;
}
.control-section.checkbox {
margin-top: 20px;
}
.multiselect-checkbox {
width: 70%;
margin-left: 70px;
}
</style>

Attachment: 20200515_09.30.40.gif_af0fed4b.zip

1 Reply

PM Ponmani Murugaiyan Syncfusion Team May 18, 2020 07:52 AM UTC

Hi Nils, 
 
Greeting from Syncfusion support. 
 
We have validated your reported query. The app disconnected due to SignalR buffer size, we suggest you to increase the MaximumReceiveMessageSize in Startup.cs file in your applications to get rid of the reported issue.  
 
[startup.cs] 
 
public Startup(IConfiguration configuration) 
       { 
            Configuration = configuration; 
        } 
 
        public IConfiguration Configuration { get; } 
 
        // This method gets called by the runtime. Use this method to add services to the container. 
        // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940 
        public void ConfigureServices(IServiceCollection services) 
        { 
            services.AddRazorPages(); 
            services.AddServerSideBlazor(); 
            services.AddSingleton<WeatherForecastService>(); 
            services.AddSyncfusionBlazor(); 
            services.AddSignalR(e => 
            { 
                e.MaximumReceiveMessageSize = 10240000; 
            }); 
        } 
 
 
Kindly check with the above sample. If issue still exists in your end, please get back us we will assists you further. 
 
Regards, 
Ponmani M 


Loader.
Up arrow icon