Jan 07, 2014, 8:15 PM
[CLOSED] [RAZOR] get selected item value from a combobox on special key or blur
Hi People
I have a few listeners on a combobox which is in an .editor with in a tab grid panel. I have implemented a custom search in this combo box and that is all working fine.
When you type is brings back the live filtered dropdown. What I am looking to do is pass the highlighed value from the combobox rather than the search text as is happening just now. I have tried SelectedItem.value but does not work.
below is the code for the column and the javascript functions that it calls.
column code
javascript
http://mvc.ext.net/#/Form_ComboBox/Custom_Search/
say typing "c" then using the using the arrow keys to highlight "cowslip" then hitting tab which would then fill in a few column for me then jump to the third one after that.
I have a few listeners on a combobox which is in an .editor with in a tab grid panel. I have implemented a custom search in this combo box and that is all working fine.
When you type is brings back the live filtered dropdown. What I am looking to do is pass the highlighed value from the combobox rather than the search text as is happening just now. I have tried SelectedItem.value but does not work.
below is the code for the column and the javascript functions that it calls.
column code
Html.X().Column()
.Text("Counterparty")
.Width(200)
.DataIndex("CounterpartyId")
.Renderer("renCounterParty")
.Editor(
Html.X().ComboBox()
.ID("cp" + TempData["tabNumber"])
.Listeners(l =>
{
l.BeforeQuery.Handler = "delete this.lastQuery;";
l.Focus.Handler = "if(this.getValue() == 0){this.setValue()}";
l.Blur.Handler = "getDefaultAccount(App." + "GridPanel_" + TempData["tabNumber"] + ",App." + "GridPanel_" + TempData["tabNumber"] + ".editingPlugin.getActiveRecord(),this.getValue(),App." + "GridPanel_" + TempData["tabNumber"] + ".editingPlugin.getActiveRecord().get('SettlementLocationId'));";
l.SpecialKey.Handler = "if(e.getKey() == e.TAB){getDefaultAccount(App." + "GridPanel_" + TempData["tabNumber"] + ",App." + "GridPanel_" + TempData["tabNumber"] + ".editingPlugin.getActiveRecord(),this.getValue(),App." + "GridPanel_" + TempData["tabNumber"] + ".editingPlugin.getActiveRecord().get('SettlementLocationId'));};if(e.getKey() == e.ENTER){getDefaultAccount(App." + "GridPanel_" + TempData["tabNumber"] + ",App." + "GridPanel_" + TempData["tabNumber"] + ".editingPlugin.getActiveRecord(),this.getValue(),App." + "GridPanel_" + TempData["tabNumber"] + ".editingPlugin.getActiveRecord().get('SettlementLocationId'));}";
}
)
.MinChars(0)
.TypeAhead(false)
.ValueField("CounterpartyId")
.DisplayField("Name")
.ForceSelection(false)
.TriggerAction(TriggerAction.Query)
.Store(
Html.X().Store()
.ID("StoreCounterpartyList" + TempData["tabNumber"])
.AutoLoad(false)
.Model(Html.X().Model()
.IDProperty("CounterpartyId")
.Fields(
new ModelField("CounterpartyId", ModelFieldType.Int),
new ModelField("Name", ModelFieldType.String)
)
)
.Parameters(p => p.Add(new StoreParameter()
{
Name = "idcm",
Value = "App." + "GridPanel_" + TempData["tabNumber"] + ".editingPlugin.getActiveRecord().get('CounterpartyTypeId')",
//Value = "App." + "GridPanel_" + TempData["tabNumber"] + ".editingPlugin.getActiveRecord().get('CounterpartyId')",
Mode = ParameterMode.Raw
}
)
)
.Proxy(
Html.X().AjaxProxy()
.Url(Url.Action("GetCounterpartyList"))
.ActionMethods(actions =>
{
actions.Read = HttpMethod.POST;
}
)
.Reader(
Html.X().JsonReader().Root("result")
)
)
)
)
javascript
var editNomOrPrice = function (grid,record) {
var id = grid.store.indexOf(record);
if(id == 0){
//Activate Nom cell
grid.editingPlugin.startEditByPosition({ row: id, column: 6 });
}else{
//Activate Price cell
grid.editingPlugin.startEditByPosition({ row: id, column: 7 });
}
}
var getDefaultAccount = function (ddid, grid, record, cpId, locId) {
//var record = getRecord();
//var cpId = cpId.SelectedItem.Value;
if (ddid == null || ddid == 0) {
return false;
}
cpId = record.set('CounterpartyId', ddid);
Ext.net.DirectMethod.request({
url: 'ExtNet/getDefaultAccount?counterpartyId=' + cpId + '&&settlementLocId=' + locId,
success: function (result) {
record.set('SettlementAccountId', result.data);
//jump to cell
editNomOrPrice(grid, record);
}
});
};
As always I cannot post a full example there is to much going on, if I were to pick an example to work from it would be http://mvc.ext.net/#/Form_ComboBox/Custom_Search/
say typing "c" then using the using the arrow keys to highlight "cowslip" then hitting tab which would then fill in a few column for me then jump to the third one after that.
Last edited by Daniil; Jan 14, 2014 at 7:42 AM.
Reason: [CLOSED]