PDA

View Full Version : [CLOSED] Grid Panel editing



rmelancon
Apr 18, 2017, 1:16 PM
I am trying to prevent editing based on a value in code behind. In the example the statement "if 1=2" would be some business logic/condition. I am returning false thinking that should prevent editing but it does not.



<%@ Page Language="vb" %>

<script runat="server">
Private Class GridDTO
Property ID As Integer
Property Trade As Boolean = True
Property Type As String
Property ChangeGuidance As String
End Class

Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load
If Not IsPostBack AndAlso Not Ext.Net.X.IsAjaxRequest Then
Dim data As New List(Of GridDTO)
Dim X = New GridDTO With {.ID = 1, .Trade = True, .ChangeGuidance = ""}
data.Add(X)
X = New GridDTO With {.ID = 2, .Trade = True, .ChangeGuidance = "Test Guidance"}
data.Add(X)
X = New GridDTO With {.ID = 3, .Trade = False, .ChangeGuidance = ""}
data.Add(X)

storeVerification.DataSource = data
storeVerification.DataBind()
End If

End Sub

<DirectMethod([Namespace]:="ModelHoldingsGrid")>
Public Function BeforeEdit() As Boolean
If 1 = 2 Then
Return True
Else
Return False
End If
End Function

<DirectMethod([Namespace]:="VerificationGrid")>
Public Sub Edit(id As Integer)
Me.grdAllocationsVerification.GetStore().GetById(i d).Commit()
End Sub

</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Edit Grid</title>
<script type="text/javascript">

var verificationEdit = function (editor, e) {
if (!(e.value === e.originalValue)) {
VerificationGrid.Edit(e.record.data.ID);
}
}

var beforeEdit = function (data) {
this.oldValues = Ext.net.clone(data);
return ModelHoldingsGrid.BeforeEdit();
}

</script>

</head>
<body>
<form id="Form1" runat="server">
<ext2:ResourceManager ID="ResourceManager1" runat="server" />

<ext2:Panel Title="Model Change Verification" runat="server" ID="pnlVerification">
<Items>

<ext2:GridPanel Title="Allocation Changes" runat="server" ID="grdAllocationsVerification" AutoScroll="true">
<Store>
<ext2:Store ID="storeVerification" runat="server" >
<Model>
<ext2:Model runat="server" IDProperty="ID">
<Fields>
<ext2:ModelField Name="ID"></ext2:ModelField>
<ext2:ModelField Name="Trade"></ext2:ModelField>
<ext2:ModelField Name="Type"></ext2:ModelField>
<ext2:ModelField Name="ChangeGuidance"></ext2:ModelField>
</Fields>
</ext2:Model>
</Model>
</ext2:Store>
</Store>
<ColumnModel>
<Columns>
<ext2:Column ID="Column1" runat="server" DataIndex="ID" Hidden="true"></ext2:Column>
<ext2:CheckColumn MaxWidth="50" runat="server" DataIndex="Trade" Text="Trade?" Editable="true" ></ext2:CheckColumn>
<ext2:Column runat="server" MaxWidth="40" DataIndex="Type" Text="Type"></ext2:Column>
<ext2:Column runat="server" DataIndex="ChangeGuidance" Text="Change Guidance" Editable="true">
<Editor>
<ext2:TextArea runat="server" ID="txtChangeGuidance" MaxLengthText="100"></ext2:TextArea>
</Editor>
</ext2:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext2:RowEditing runat="server">
<Listeners>
<BeforeEdit Handler="return beforeEdit(e.record.data);"></BeforeEdit>
<Edit Fn="verificationEdit" />
</Listeners>
</ext2:RowEditing>
</Plugins>
</ext2:GridPanel>
</Items>

</ext2:Panel>
</form>
</body>
</html>

fabricio.murta
Apr 18, 2017, 4:03 PM
Hello @rmelancon!

I am afraid it is not a good idea to rely on a direct method result for allowing/disallowing a row to be edited.

First, because it can take an unpredictable amount of time for the row to be editable, because the server response will delay based on the network availability.

The problem here is that server-side calls are made asynchronously. What you get when trying to bind a direct method return to a variable is just an object describing the call issued. It can't "pause" javascript (client-side code) arbitrarily to wait for the server answer.

If you really want to rely on server to allow/disallow editing you would need a totally different approach, like binding click (or double click) event to the grid row, and mask the grid (so it can't be interacted while working) and calling the direct method.

Then you should bind the success callback to actually initiate the editing of the row (removing the mask in the process). This way at least the user would be able to know the server-side processing is ongoing and not try to edit another row while the first is still being evaluated for availability to edit.

I believe your best approach here would be to add a field during Page_Load (and don't bind a grid column to that field to keep it hidden -- just add to the model), and then bind that field to the result of the client-side beforeEdit() function.

If this is still not clear for you, please review these discussions on the forums:
- why direct method return a object? (https://forums.ext.net/showthread.php?26483)
- Using the response from DirectMethod in Renderer function (https://forums.ext.net/showthread.php?60445)

Basically, search the forums for "directMethod return".

I hope this helps!

rmelancon
Apr 18, 2017, 8:06 PM
Ok, that makes sense. I guess I was thinking the direct method would be called asynchronously. I will set a property on the store to control editing. Thanks.

fabricio.murta
Apr 19, 2017, 3:09 PM
Hello @rmelancon!

Thanks for your feedback, I hope the solution of the store property works well for you. If not, let us know!