iSeller Commerce
iSeller POS Retail
iSeller POS F&B
iSeller POS Express
Crosslight
WebUI
ClientUI
What's New
Download Trial
Web Solution
Mobile Solution
Enterprise Solution
Custom Development
Blog
Community
Latest Development Blogs
ForumPostTopic
Browse By Tag
Hi,
I am facing the typical problem, where i was requested to do Replace Operation. That is I need to delete the selected row and add new row to the grid based on any modification/change done to text(which is Column of grid (EventCode)).
I have successfully handled this problem and able to perform by pointing the selected object to the row just above selected row earlier and even it is showing from UI. But the real problem araised is Keyborad features is not working after this operation.
That is, Once i do this operation i am not able to use keyboard events (OnKeyDown) from Grid which is not working I need to manually use mouse to click on Grid Cell then Keyboard event fired able to move from up to down the Gridrows using arrowkeys.
Here, below is my code,
<ISWebGrid:WebGrid ID="TemplateGrid" runat="server" Width="100%" Height="90%" UseDefaultStyle="True"
OnInitializeDataSource="TemplateGrid_InitializeDataSource" OnInitializeRow="TemplateGrid_InitializeRow"
OnInitializeLayout="TemplateGrid_InitializeLayout" OnInitializeSelfReferenceDataSource="TemplateGrid_InitializeSelfReferenceDataSource">
<FlyPostBackSettings PostHiddenFields="True" PostViewState="False" />
<LayoutSettings CellPaddingDefault="0" CellSpacingDefault="0" VirtualPageSize="1000" AllowGrouping="No" AllowColumnMove="Yes" AllowSorting="Yes" GridLines="Vertical"
AutoFitColumns="True" AutoHeight="False" AutoWidth="True" AllowFilter="No" StatusBarVisible="false">
<ClientSideEvents OnRowSelectorClick="ratTemplateTree.onGridCellClick" OnSelfRefRowExpand="ratTemplateTree.OnRowExpand" OnCellClick="ratTemplateTree.onGridCellClick" OnRowSelect="ratTemplateTree.onGridRowSelect" OnBeforeDelete="ratTemplateTree.onGridBeforeDelete"
OnKeyDown="ratTemplateGridUtility.autoSearchKeyDownHandler" OnAfterResponseProcess="ratTemplateTree.AfterResponseProcess;" OnBeforeRequest="ratTemplateTree.DoBeforeRequest" />
</LayoutSettings>
<RootTable DataKeyField="ITemplate" AllowColumnMove="Yes" AllowColumnSizing="Yes" AllowEdit="No" AllowSorting="Yes">
<Columns>
<ISWebGrid:WebGridColumn ShowInSelectColumns="No" ColumnType="CheckBox" AllowGrouping="No"
AllowSizing="No" AllowSorting="No" EditType="NoEdit" Name="ColumnCheckbox" Width="25px"
IsRowChecker="True" Bound="False">
</ISWebGrid:WebGridColumn>
<ISWebGrid:WebGridColumn Caption="Event Code" DataMember="EventCode" Name="EventCode"
ShowInSelectColumns="No" Width="100px" EditType="NoEdit" HiddenDataMember="HasError">
<ISWebGrid:WebGridColumn Caption="Narrative" DataMember="Narrative" Name="Narrative"
HiddenDataMember="ParentIndex" EditType="NoEdit" IsAutoWidth="true">
<ISWebGrid:WebGridColumn Caption="Parent Event" DataMember="parentCode" Name="parentCode" Width="100px">
</Columns>
<SelfReferencingSettings ChildDataMember="ParentIndex" Enabled="True" ExpandColumnInnerTextPadding="10"
ExpandColumnMember="EventCode" LoadOnDemand="True" ParentDataMember="ITemplate"
ParentRootMode="NullValue" />
</RootTable>
</ISWebGrid:WebGrid>
On the page .aspx i have added <asp:ScriptReference Path="~/Client_Resources/JavaScript/WebGridUtility.js" /> where the cliend side script of OnKeyDown="ratTemplateGridUtility.autoSearchKeyDownHandler" are written inside WebGridUtility.
And rest of Clientside events are written in <asp:ScriptReference Path="~/Client_Resources/JavaScript/pageScripts/TemplateTree.js" /> which is added inside the page only.
Please guide me how I am able to solve this Keyboard actions after performing the Replace operation on WebGrid. But this is performing good after addition, modification, deletion I am able to use keyboard arrow keys to navigate through the rows of Grid but once I do the Replace Operation Grid will refresh then it will be showing the row just above the replaced row but the keyboard arrow keys will be freezed completely. Then once again i need to use mouse click on any row on grid then keyboard arrows will start working normally :( .
So, please help me how to proceed further on this.
Hi Girish,
From post above, this problem might be happen because WebGrid doesn't have any selected row (lost focus). To resolved this, you can select the row that you replaced before by using this code in client side:
function select() { var WebGrid1 = ISGetObject("WebGrid1"); WebGrid1.RootTable.GetRow(index).Select(); //(int)index of the row that you have replaced return true; }
If this problem still happen, could you give me a simple sample that can be executed in our local end so we can debug it here? Look forward to hear any feedback from you so I can help you further.
Regards,
Bernard
Hi Bernard,
Thanks for your quick response.
I am using the above code to select the row above the replaced row. where I am storing the previous KeyValue of previous row and making to select that specific row in below client side function.
AfterResponseProcess: function(controlId) {
//alert("Processing Request");
this._grid.SetFocus();
// DelFlag will be one if they are perfomring the replace operation.
if (this.DelFlag == 1) {
//Set Row Position After Delete
if (this.ScrollPos > 0) {
this._grid.RootTable.GetElement(WG40.BODY, WG40.HTMLDIV).scrollTop = this.ScrollPos
}
if (this._grid.GetSelectedObject() != null) {
var RowIndex = this._grid.GetSelectedObject().rowIndex;
var gSelObj = this._grid.GetSelectedObject().GetRowObject(RowIndex);
gSelObj.Grid.ClearSelection(RowIndex);
var rowI = document.getElementById("prevEventKeyValue").value;
if (rowI != "") {
this._grid.RootTable.GetRow(this._grid.RootTable.GetRowByKeyValue(rowI).RowElement.rowIndex).Select();
//this._grid.RootTable.SelectRow(this._grid.RootTable.GetRowByKeyValue(rowI).RowElement.rowIndex);
else
this._grid.RootTable.SelectRow(0);
this.DelFlag = -1;
return true;
},
The thing is Grid will refreshs and showing the selection row to above one which was replaced but it is making keyborad options completely freezed :(
Please guide me on this, why it is happening.
From you code, I don't see any code that trigger Postback. If you have any server-side method behind maybe you can save the keyValue on HiddenField. The during InitializeRow check the cells and set selected property on row object as true value. If this problem still occurs, could you give me a simple sample that replicate this issue?
I have given all the info regarding the 'Replace Operation' that I am performing on the Web Grid.
Please go through the above info of mine Once again. if you still need any info let me know.
One more strange thing I have noticed today is:
If I click inside anywhere of frame where I am trying to make some change, before "Save" then the Web Grid is somehow able to get focus and able to work correctly with the keyboard features where onKeydown is working. ( I know it looks strange but this is what happening I dont know why is this working fine i just need to click inside the Frame before clicking "Save":(.
Lastly, I am not working anything in PostBack as I just need to navigate rows of Grid through arrowkeys. I have written only client side scripting which is working perfectly in normal scenarios like add, delete and Modify except Replace operations :(
And Also, i'm following the same logic storing the previous key value in Hidden field and in AfterResponseProcess i'm making to select.
Please try to guide me on this asap.
With Regards,
Girish G
Hello Girish,
Perhaps, there are some missunderstanding in here. What we meant about postback, because we refer back to your first post that said "...Grid will refreshs...".Refresh is one of postback action like others such as filter,sort, insert, update, delete,etc. While seeing in your afterResponse code, there is no code that caused postback.This is what Bernard point.
However, looking at your current code, there are some logic that make me wonder...
if (this._grid.GetSelectedObject() != null) { var RowIndex = this._grid.GetSelectedObject().rowIndex; var gSelObj = this._grid.GetSelectedObject().GetRowObject(RowIndex); gSelObj.Grid.ClearSelection(RowIndex); var rowI = document.getElementById("prevEventKeyValue").value; if (rowI != "") { this._grid.RootTable.GetRow(this._grid.RootTable.GetRowByKeyValue(rowI).RowElement.rowIndex).Select(); //this._grid.RootTable.SelectRow(this._grid.RootTable.GetRowByKeyValue(rowI).RowElement.rowIndex); } else this._grid.RootTable.SelectRow(0);
At first, you used gSelObj.Grid.ClearSelection(RowIndex); , then this._grid.RootTable.GetRow(this._grid.RootTable.GetRowByKeyValue(rowI).RowElement.rowIndex).Select();.The first code will instanly remove your selection. The second should be reselect again.However, why it needs this way? I understand that you have set the validation and the code would be called if it is necessary. But I think you better debug your codes. I don't know what is the current value so I don't know how it goes. Besides, I don't know about rowI that needs "preEventValue".But I assume this might be your hidden field. Also, it seems you use the code to handle something after delete process or something (by seeing the flag). If that so, why you need to focus the grid again?As far I know, when deletes a row, it would automatically select another row after that which should make your savedKeyValue obsoleted or changed. So, is that you need to lostfocus and focus again?
Anyway, that's only my thinking. Perhaps, you should let us know what is "Replace Operation does".Because we might need that detail to investigate what cause this issue.
Regards,Handy
or
Choose this if you're already a member of Intersoft Community Forum. You can link your OpenID account to your existing Intersoft Social ID.
Choose this if you don't have an Intersoft account yet. Your authenticated OpenID will be automatically linked to your new Intersoft account.
Enter your Wordpress Blogname
Creating your account...