DropDownButton and EjsSplitButton have no list below it when the button is clicked.

[j]

Hi,

   I'm thinking that the current doc for EjsDropDownButton is for 17.4.0.39, and so the items are blank. See picture.
Do you still have the docs for 17.3.29 bc it's the version I'm using?

My codes are:

<EjsDropDownButton Content="Add Report">

<DropDownButtonItems>

<DropDownButtonItem Text="Edit"></DropDownButtonItem>

<DropDownButtonItem Text="Copy"></DropDownButtonItem>

<DropDownButtonItem Text="Paste"></DropDownButtonItem>

</DropDownButtonItems>

</EjsDropDownButton>

   I also try to use EjsSplitButton but no avail:

<EjsSplitButton Content="Add Report">

            <SplitButtonItems>

                <SplitButtonItem Text="Edit"></SplitButtonItem>

                <SplitButtonItem Text="Copy"></SplitButtonItem>

                <SplitButtonItem Text="Paste"></SplitButtonItem>

            </SplitButtonItems>

</EjsSplitButton>

Actually, all <SplitButtonItem> are highlighted, an indication that there's an error, "Found element with unexpected name SplitButtonItem. If this is intended to be a component, add a @using directive for its namespace."

[Saranya Dhayalan]

Hi J, 

 

Sorry for the inconvenience caused. 

We have updated the UG document for the latest version. For your convenience we have prepared a sample in 17.3.29 version. Please find the below code snippet and sample link: 

 

Index.razor 

@using Syncfusion.EJ2.Blazor.SplitButtons 

 

<EjsDropDownButton Items="@ddlItems" IconCss="e-ddb-icons e-profile"></EjsDropDownButton> 

 

 

<EjsSplitButton Items="@spltItems" IconCss="e-btn-icons e-paste"></EjsSplitButton> 

 

 

@code{ 

 

    public List<Syncfusion.EJ2.Blazor.SplitButtons.ItemModel> ddlItems { get; set; } = new List<Syncfusion.EJ2.Blazor.SplitButtons.ItemModel> 

{ 

        new Syncfusion.EJ2.Blazor.SplitButtons.ItemModel { Text = "Dashboard", IconCss = "e-ddb-icons e-dashboard" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.ItemModel { Text = "Notifications", IconCss = "e-ddb-icons e-notifications" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.ItemModel { Text = "User Settings", IconCss = "e-ddb-icons e-settings" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.ItemModel { Text = "Log Out", IconCss = "e-ddb-icons e-logout" } 

    }; 

 

    public List<Syncfusion.EJ2.Blazor.SplitButtons.ItemModel> spltItems { get; set; } = new List<Syncfusion.EJ2.Blazor.SplitButtons.ItemModel> 

{ 

        new Syncfusion.EJ2.Blazor.SplitButtons.ItemModel { Text = "Paste", IconCss = "e-btn-icons e-paste" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.ItemModel{ Text = "Paste Special", IconCss = "e-btn-icons e-paste-special" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.ItemModel{ Text = "Paste as Formula", IconCss = "e-btn-icons e-paste-formula" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.ItemModel{ Text = "Paste as Hyperlink", IconCss = "e-btn-icons e-paste-hyperlink" } 

    }; 

 

} 

 

 

 

 

Sample link: https://www.syncfusion.com/downloads/support/forum/150588/ze/BlazorApp9-884811828 

 

Could you please check the above sample and get back to us if you need further assistance on this? 

 

Regards, 

Saranya D 

 

[j]

This is excellent. Thanks!

[Saranya Dhayalan]

Hi J 

 

Most Welcome.  

 

Please let us know, if you need any further assistance on this.  

 

Regards, 

Saranya D 

[Dean Walker]

If you update EJ2.Blazor in this project from v17.3.0.29-beta to v17.4.0.44 it breaks the code with the following error...

cannot convert from 'System.Collections.Generic.List<Syncfusion.EJ2.Blazor.SplitButtons.ItemModel>' to System.Collections.Generic.List<Syncfusion.EJ2.Blazor.SplitButtons.DropDownButtonItem>'

This has happened to a project of mine as well as the sample that was provided.

https://www.syncfusion.com/downloads/support/forum/150588/ze/BlazorApp9-884811828 

Help would be very much appreciated, i want to move to production soon and currently on beta but the non-beta update breaks my project.

Thanks,

Dean

[Saranya Dhayalan]

Hi J, 

 

We have checked your reported issue, Previously, we have defined ‘ItemModel’ class for constructing items for Dropdown button Now we have changed this to ‘DropdownButtonItem’. Please find the below code snippet: 

 

@using Syncfusion.EJ2.Blazor.SplitButtons 

 

<EjsDropDownButton Items="@ddlItems" IconCss="e-ddb-icons e-profile"></EjsDropDownButton> 

 

 

<EjsSplitButton Items="@spltItems" IconCss="e-btn-icons e-paste"></EjsSplitButton> 

 

 

@code{ 

 

    public List<Syncfusion.EJ2.Blazor.SplitButtons.DropDownButtonItem> ddlItems { get; set; } = new List<Syncfusion.EJ2.Blazor.SplitButtons.DropDownButtonItem> 

{ 

        new Syncfusion.EJ2.Blazor.SplitButtons.DropDownButtonItem { Text = "Dashboard", IconCss = "e-ddb-icons e-dashboard" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.DropDownButtonItem { Text = "Notifications", IconCss = "e-ddb-icons e-notifications" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.DropDownButtonItem { Text = "User Settings", IconCss = "e-ddb-icons e-settings" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.DropDownButtonItem { Text = "Log Out", IconCss = "e-ddb-icons e-logout" } 

    }; 

 

    public List<Syncfusion.EJ2.Blazor.SplitButtons.SplitButtonItem> spltItems { get; set; } = new List<Syncfusion.EJ2.Blazor.SplitButtons.SplitButtonItem> 

{ 

        new Syncfusion.EJ2.Blazor.SplitButtons.SplitButtonItem { Text = "Paste", IconCss = "e-btn-icons e-paste" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.SplitButtonItem{ Text = "Paste Special", IconCss = "e-btn-icons e-paste-special" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.SplitButtonItem{ Text = "Paste as Formula", IconCss = "e-btn-icons e-paste-formula" }, 

        new Syncfusion.EJ2.Blazor.SplitButtons.SplitButtonItem{ Text = "Paste as Hyperlink", IconCss = "e-btn-icons e-paste-hyperlink" } 

    }; 

 

} 

 

 

For your convenience, we have modified a sample. Please find the sample link: 

 

Sample link: https://www.syncfusion.com/downloads/support/forum/150588/ze/BlazorApp91374939802 

 

Please find the release notes for tag directive support for ‘Items’ 

 

https://ej2.syncfusion.com/blazor/documentation/release-notes/17.4.39/#dropdownbutton 

 

https://ej2.syncfusion.com/blazor/documentation/release-notes/17.4.39/#splitbutton 

 

Could you please check the above sample link and get back to us, if you need any further assistance on this? 

 

Regards, 

Saranya D 

[Dean Walker]

Hi,

Yes this works thank you very much, i did try to work out the change but could not, so this was very helpful.

Dean.

[Saranya Dhayalan]

Hi J, 

 

Thanks for your update. 

 

We are happy to hear that your issue has been resolved. Kindly get back to us if you need any further assistance. 

 

Regards, 

Saranya D