Nov 04, 2013, 10:26 AM
[CLOSED] Multicombo with group and treeview
Hello,
We are trying to create multicombo with groups. To achive this we have embeded a tree control within combo box. UI is looking good but when we are trying to set the selected items text in combo textbox, the dropdown is getting closed. Below is the code snippet. Is there any property that can stop the dropdown from getting closed.
We are trying to create multicombo with groups. To achive this we have embeded a tree control within combo box. UI is looking good but when we are trying to set the selected items text in combo textbox, the dropdown is getting closed. Below is the code snippet. Is there any property that can stop the dropdown from getting closed.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ComboTree.aspx.cs" Inherits="ComboTree" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!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></title>
<script type="text/javascript" src="jquery-1.5.1.min.js"></script>
<style>
.complete .x-grid-cell-inner
{
font-weight: bold;
color: #777;
}
.folder-create
{
background-image: url(images/circlebluessmall.png) !important;
}
</style>
<script type="text/javascript">
function ddlbind() {
var msg = "",
selChildren = App.TreePanel1.getChecked();
Ext.each(selChildren, function (node) {
if (msg.length > 0) {
msg += ", ";
}
msg += node.data.text;
});
if (msg.length > 0) {
App.ddlSkill.setValue(msg);
} else {
App.ddlSkill.setValue('Select Skill Set');
}
return msg;
};
</script>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
treebind();
}
}
private void treebind()
{
Ext.Net.Node root = new Ext.Net.Node()
{
};
root.Expanded = true;
TreePanel1.Root.Add(root);
for (int i = 1; i <= 1; i++)
{
Ext.Net.Node compositionNode = new Ext.Net.Node()
{
Text = "Category" + i
//IconCls = "folder-create"
};
root.Children.Add(compositionNode);
for (int j = 1; j <= 5; j++)
{
Ext.Net.Node pieceNode = new Ext.Net.Node()
{
Text = "Skill" + j,
Leaf = true,
NodeID = Convert.ToString(j),
Checked = false
//IconCls = "folder-create"
};
compositionNode.Children.Add(pieceNode);
}
}
}
</script>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" />
<ext:DropDownField ID="ddlSkill" runat="server" TriggerIcon="Combo" Cls="combo_box"
Width="295" EmptyText="Select Skill Set">
<Component>
<ext:TreePanel ID="TreePanel1" runat="server" Height="400" Width="250" Frame="false"
UseArrows="true" AutoScroll="true" Animate="true" RootVisible="false">
<Listeners>
<CheckChange Handler="var node = Ext.get(this.getView().getNode(item));ddlbind();
node[checked ? 'addCls' : 'removeCls']('complete');" />
<Render Handler="this.getRootNode().expand(true);" Delay="50" />
</Listeners>
</ext:TreePanel>
</Component>
</ext:DropDownField>
</form>
</body>
</html>
Last edited by Daniil; Nov 08, 2013 at 2:14 PM.
Reason: [CLOSED]