PDA

View Full Version : [CLOSED] TAB key press not setting focus to next row



speedstepmem4
Sep 05, 2014, 6:18 AM
Hi,

We are unable to set the focus to next row on the TAB key press.
Here is the sample code to replicate the issue.



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

<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" Namespace="Sample" />
<div>
<ext:GridPanel ID="gridpanel" runat="server" Border="false"
Width="500" Height="400">
<Store>
<ext:Store ID="storeGrid" runat="server" IgnoreExtraFields="true">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Description" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel2" runat="server">
<Columns>
<ext:Column ID="Name" ColumnID="Name" runat="server" DataIndex="Name" Text="Name" Width="150">
<PrepareCommand Args="grid,command,record,row,col,value" FormatHandler="False" Handler="" />
<Editor>
<ext:TextField ID="txtName" runat="server" StyleSpec="text-transform:uppercase;"
MaxLength="50" EnableKeyEvents="true">
<Listeners>
<Show Handler="this.focus.defer(50, this);" />
<KeyUp Handler="if (e.keyCode >= 65 && e.keyCode <= 90) this.setValue(this.getValue().toUpperCase());" />
</Listeners>
</ext:TextField>
</Editor>
</ext:Column>
<ext:Column ID="Description" ColumnID="Description" runat="server" DataIndex="Description" Text="Description" Width="250">
<PrepareCommand Args="grid,command,record,row,col,value" FormatHandler="False" Handler="" />
<Editor>
<ext:TriggerField ID="txtDesc" runat="server" StyleSpec="text-transform:uppercase;"
MaxLength="50" EnableKeyEvents="true" TriggerIcon="Search">
<Listeners>
<Show Handler="this.focus.defer(50, this);" />
<KeyUp Handler="if (e.keyCode >= 65 && e.keyCode <= 90) this.setValue(this.getValue().toUpperCase());" />
</Listeners>

</ext:TriggerField>
</Editor>
</ext:Column>
<ext:Column ID="ID" ColumnID="ID" runat="server" DataIndex="ID">
</ext:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext:CellEditing ID="CellEditing1" runat="server" ClicksToEdit="2">
</ext:CellEditing>
</Plugins>
<SelectionModel>
<ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" Mode="Single" runat="server">
<Listeners>
<BeforeSelect Fn="ValidRow">
</BeforeSelect>
</Listeners>
</ext:CheckboxSelectionModel>
</SelectionModel>
<Buttons>
<ext:Button ID="btn_add1" runat="server" AutoPostBack="false" Text="Add Row">
<Listeners>
<Click Delay="1" Handler="newRow();" />
</Listeners>
</ext:Button>
<ext:Button ID="btn_save1" runat="server" AutoPostBack="false" Text="Save">
<Listeners>
<Click Delay="1" Handler="#{storeGrid}.sync();" />
</Listeners>
</ext:Button>
<ext:Button ID="Btn_Delete1" runat="server" Text="Delete">
</ext:Button>
<ext:Button ID="Btn_Cancel1" runat="server" Text="Cancel">
</ext:Button>
</Buttons>
</ext:GridPanel>

</div>
</form>
<script>
var editMode = false;
var alert = '';
var CurrentRowIndex;
function ValidRow() {
return !editMode;
}
function newRow() {
editMode = true;
var rowIndex = Sample.gridpanel.store.getCount();
Sample.gridpanel.store.insert(rowIndex, {});
Sample.gridpanel.getView().focusRow(rowIndex);
Sample.gridpanel.editingPlugin.startEdit(rowIndex, 1);
CurrentRowIndex = rowIndex;
}
</script>
</body>
</html>


Please refer the screenshot and do guide us.

Daniil
Sep 05, 2014, 7:49 AM
Hi @speedstepmem4,

Do you need a new row is added automatically on Tab? Unfortunately, there is no such the functionality.

I remember I've already helped someone on the forums with such a request. I can suggest you to try to find a related thread using the forums searching engine.