PDA

View Full Version : [CLOSED] Hide CheckBox in CheckMenuItem



softmachine2011
Sep 25, 2012, 9:07 AM
Hi,

In older versions of Ext.NET 2.1 this test case doesn't show CheckBox in each item of menu. Now how can I hide it?

TEST CASE


<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
for (int i = 0; i < 10; i++)
{
var menuItem = new CheckMenuItem
{
ID = string.Format("chk{0}", i),
Text = string.Format("Value {0}", i),
Group = "myGroup",
Checked = (i == 3)
};

if (menuItem.Checked)
myTooltip.Html = menuItem.Text;

myButton.Menu.First().Items.Add(menuItem);
}
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Ext.Net Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:SplitButton ID="myButton" runat="server" AutoDataBind="true" Text="Button text">
<Menu>
<ext:Menu runat="server" />
</Menu>
<ToolTips>
<ext:ToolTip runat="server" ID="myTooltip" Title="Tooltip Title" />
</ToolTips>
</ext:SplitButton>
</form>
</body>
</html>

Daniil
Sep 25, 2012, 10:48 AM
Hi,

If it worked, then, I think, it was the casual behavior.

Probably, if you don't need checkboxes, you should not use CheckMenuItems. Though, I don't know the requirement. Please clarify it.

softmachine2011
Sep 25, 2012, 10:58 AM
Well, in v1.3 it works like in older v2.1 (without checkbox)... I think that since ExtJS 4.1.2 update this behaviour changes.

I don't know if it is correct or not, but I think that is not a bug...

As you see in the example, each option is highlighted with a round mark and also have a checkbox now.

Is there any way to hide the checkbox like in the picture?

4826

Daniil
Sep 25, 2012, 11:06 AM
Well, CheckMenuItem is a MenuItem with CheckBox. It is its destination.

Maybe, setting respective CheckedCls and UncheckedCls can help to hide the CheckBoxes.

softmachine2011
Sep 25, 2012, 12:34 PM
Hi,

Is it normal that only applying CheckedCls and UncheckedCls properties to a non-existent cls the checkbox and round mark dissapear?

TEST CASE


<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
for (int i = 0; i < 10; i++)
{
var menuItem = new CheckMenuItem
{
ID = string.Format("chk{0}", i),
Text = string.Format("Value {0}", i),
Group = "myGroup",
Checked = (i == 3),
CheckedCls = "myCustomCls",
UncheckedCls = "myCustomCls"
};

if (menuItem.Checked)
myTooltip.Html = menuItem.Text;

myButton.Menu.First().Items.Add(menuItem);
}
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Ext.Net Example</title>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:SplitButton ID="myButton" runat="server" AutoDataBind="true" Text="Button text">
<Menu>
<ext:Menu runat="server" />
</Menu>
<ToolTips>
<ext:ToolTip runat="server" ID="myTooltip" Title="Tooltip Title" />
</ToolTips>
</ext:SplitButton>
</form>
</body>
</html>

Daniil
Sep 25, 2012, 1:46 PM
Well, yes, it overrides the default ones and doesn't break anything. Just no CSS rules are applied.

softmachine2011
Sep 25, 2012, 2:00 PM
Ok, finally I applied my custom css class.

Thanks

RCN
Nov 01, 2012, 12:40 PM
could you provide the css?

softmachine2011
Nov 02, 2012, 9:53 AM
Hi @RCN,

Here you have:

Code Behind:


protected void Page_Load(object sender, EventArgs e)
{
for (int i = 0; i < 10; i++)
{
var menuItem = new CheckMenuItem
{
ID = string.Format("chk{0}", i),
Text = string.Format("Value {0}", i),
Group = "myGroup",
Checked = (i == 3)
Tag = "myTag",
CheckedCls = "customCheckedMenuItem",
UncheckedCls = "noClass"
};

if (menuItem.Checked)
myTooltip.Html = menuItem.Text;

myButton.Menu.First().Items.Add(menuItem);
}
}


CSS


.customCheckedMenuItem .x-menu-group-icon
{
background-image: url("/extjs/resources/themes/images/default/menu/group-checked-gif/ext.axd");
}

Regards.