Ok, I have downloaded the sources from:
http://www.extjs.com/forum/attachmen...7&d=1263783379
Extracted the archive and put into the resources/SuperSelectBox folder of my test project.
As well, I've copied the states.js using FireBug.
And below the example I'm testing with.
It appears to reproduce the problem you described:
1. Select some item more and blur.
2. All values dissapear.
I guess it's because of there is ExtJS 3.4 in Ext.NET, but the SuperSelectBox scripts uses ExtJS 3.2. At least, in their example:
http://technomedia.co.uk/SuperBoxSelect/examples3.html
By the way, I was unable to check what the behavior is in that example, but can't even select an item, because there is no trigget to expand a SuperSelectBox (I'm talking about the first one).
Example
<%@ Page Language="C#" %>
<%@ 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>Ext.Net Example</title>
<ext:ResourcePlaceHolder runat="server" Mode="Style" />
<link href="resources/SuperBoxSelect/superboxselect.css" rel="Stylesheet" type="text/css" />
<ext:ResourcePlaceHolder runat="server" Mode="ScriptFiles" />
<script src="resources/SuperBoxSelect/states.js" type="text/javascript"></script>
<script type="text/javascript" src="resources/SuperBoxSelect/SuperBoxSelect.js"></script>
<script type="text/javascript">
var onReady = function () {
var states = new Ext.data.SimpleStore({
fields: ['abbr', 'state', 'nick', 'cls'],
data: Ext.exampledata.states,
sortInfo: {
field: 'state',
direction: 'ASC'
}
});
var sbs1 = new Ext.ux.form.SuperBoxSelect({
allowBlank: false,
id: 'selector1',
xtype: 'superboxselect',
fieldLabel: 'States',
emptyText: 'Select some US States',
resizable: true,
name: 'states',
anchor: '100%',
store: states,
mode: 'local',
displayField: 'state',
displayFieldTpl: '{state} ({abbr})',
valueField: 'abbr',
value: 'CA,NY',
forceSelection: true,
allowQueryAll: false,
listeners: {
render: function (sbs) {
sbs.wrapEl.on('contextmenu', function (ev, h, o) {
ev.stopEvent();
var rec = sbs.findSelectedRecord(h),
i = sbs.findSelectedItem(h),
n = rec.get('abbr');
var ctxMenu = new Ext.menu.Menu({
items: [{
text: 'Action 1 on ' + n
}, {
text: 'Action 2 on ' + n
}]
});
ctxMenu.showAt([ev.getPageX(), ev.getPageY()]);
}, sbs, {
delegate: 'li.x-superboxselect-item'
});
}
}
});
var form1 = new Ext.form.FormPanel({
id: 'f1Form',
renderTo: Ext.getBody(),
title: 'Base Functionality',
autoHeight: true,
bodyStyle: 'padding:50px;',
width: 700,
items: [sbs1],
buttons: [{
text: "setValue('AK,NY,CO')",
scope: this,
handler: function () {
Ext.getCmp('selector1').setValue('AK,NY,CO');
}
}, {
text: 'getValue()',
scope: this,
handler: function () {
alert(Ext.getCmp('selector1').getValue());
}
}, {
text: 'BasicForm.getValues()',
scope: this,
handler: function () {
var v = form1.getForm().getValues(true);
alert(v);
}
}, {
text: "reset",
scope: this,
handler: function () {
Ext.getCmp('selector1').reset();
}
}, {
text: "disable",
scope: this,
handler: function () {
Ext.getCmp('selector1').disable();
}
}, {
text: "enable",
scope: this,
handler: function () {
Ext.getCmp('selector1').enable();
}
}]
});
new Ext.ToolTip({
target: sbs1.wrapEl,
delegate: 'li.x-superboxselect-item',
trackMouse: true,
renderTo: Ext.getBody(),
listeners: {
'beforeshow': {
fn: function (tip) {
var rec = sbs1.findSelectedRecord(tip.triggerElement);
tip.body.dom.innerHTML = rec.get('nick');
},
scope: this
}
}
});
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server">
<Listeners>
<DocumentReady Handler="onReady();" />
</Listeners>
</ext:ResourceManager>
</form>
</body>
</html>
Originally Posted by Daniil
