PDA

View Full Version : [CLOSED] MultiCombo with two columns



osef
Aug 10, 2015, 10:22 PM
Hi Team How Can I do to I put the items in two columns in a Button with Menu to emulate MultiCombo as example in the URL

http://examples.ext.net/#/Form/ComboBox/MultiCombo/


I want to two columns

This is a example

24138


Thank you team.

Regards

Daniil
Aug 11, 2015, 5:13 PM
Hi @osef,

Seems I don't see any way except the example below.

You will need to change the updateButtonText function to take both the Menus into account.

Example

<%@ Page Language="C#" %>

<!DOCTYPE html>

<html>
<head runat="server">
<title>Ext.NET v2 Example</title>

<script>
var updateButtonText = function (item, checked) {
var text = [];

item.parentMenu.items.each(function (item) {
if (item.checked) {
text.push(item.text);
}
});

if (text.length == 0) {
App.Button1.setText("[Select Colors]");
} else {
App.Button1.setText("[" + text.join(",") + "]");
}
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />

<ext:Button
ID="Button1"
runat="server"
Icon="Rgb"
Text="[Select Colors]"
Width="200">
<Menu>
<ext:Menu runat="server" Width="200">
<Defaults>
<ext:Parameter Name="HideOnClick" Value="false" Mode="Raw" />
</Defaults>
<Items>
<ext:Container runat="server">
<LayoutConfig>
<ext:HBoxLayoutConfig Align="Stretch" />
</LayoutConfig>
<Items>
<ext:Menu runat="server" Flex="1" Floating="false">
<Items>
<ext:CheckMenuItem runat="server" Text="Red" CheckHandler="updateButtonText" />
<ext:CheckMenuItem runat="server" Text="Green" CheckHandler="updateButtonText" />
<ext:CheckMenuItem runat="server" Text="Blue" CheckHandler="updateButtonText" />
</Items>
</ext:Menu>
<ext:Menu runat="server" Flex="1" Floating="false">
<Items>
<ext:CheckMenuItem runat="server" Text="Yellow" CheckHandler="updateButtonText" />
<ext:CheckMenuItem runat="server" Text="White" CheckHandler="updateButtonText" />
<ext:CheckMenuItem runat="server" Text="Black" CheckHandler="updateButtonText" />
</Items>
</ext:Menu>
</Items>
</ext:Container>
</Items>
</ext:Menu>
</Menu>
</ext:Button>
</form>
</body>
</html>

osef
Aug 12, 2015, 7:11 AM
Thank you, but with the version 2.x, because this is the example with image.

24142

I have a big aplication,so, I need to do it with 2.x.

Thank you

Daniil
Aug 13, 2015, 9:46 AM
Running the example with the latest Ext.NET v2 from SVN I see this:
24146

Please provide your test case.

By the way, to remove the space on the left please set Plain="true" for the Menu.