Multiple inputs in single toolbar item?
I'd like to have a toolbar that has two checkboxes, one on top of the other, but I can't seem to make the checkboxes line break, is it not possible to have a single toolbar item with multiple inputs?
<ToolbarItem Type="ItemType.Input">
<Template>
<p><SfCheckBox TChecked=" bool" @bind-Checked="EastSideChecked" ValueChange="@OnOrgLocationFilterChange" Label="East Side"></SfCheckBox></p>
<p><SfCheckBox TChecked="bool" @bind-Checked="WestSideChecked" ValueChange="@OnOrgLocationFilterChange" Label="West Side"></SfCheckBox></p>
</Template>
</ToolbarItem>
SIGN IN To post a reply.
4 Replies
Hi Ben,
Greetings from Syncfusion Support.
You can’t use two inputs in single toolbar item which may cause improper values to the respective inputs. So we suggest you to use separate items for both the inputs and customize it using CSS. We have prepared a sample for your reference which can be downloaded from the following link.
|
<ToolbarItem Type="ItemType.Input" CssClass="test1">
<Template>
<SfCheckBox Checked="true" Label="Test1"></SfCheckBox>
</Template>
</ToolbarItem>
<ToolbarItem Type="ItemType.Input" CssClass="test2">
<Template>
<SfCheckBox Checked="false" Label="Test2"></SfCheckBox>
</Template>
</ToolbarItem>
<style> .e-toolbar .e-toolbar-items .e-toolbar-item.test1 {
height: 10px;
top: 10px;
position: absolute;
}
.e-toolbar .e-toolbar-items .e-toolbar-item.test2 {
left: 552px;
height: 10px;
top: 33px;
position: absolute;
}
</style> |
Please try the above solution and get back to us if you need any further assistance.
Regards,
Nevitha
SIGN IN To post a reply.
