PDA

View Full Version : [CLOSED] Move up/down gridpanel , delete gridpanel data can not work



gs_user
Jul 26, 2012, 3:52 PM
Hi,
That code was use to when user click button to move up, move down or delete gridpanel data
but the code can't work.
please help me.



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

<%@ Import Namespace="System" %>
<%@ Import Namespace="System.Web" %>
<%@ Import Namespace="System.Xml.Xsl" %>
<%@ Import Namespace="System.Xml" %>
<%@ Import Namespace="System.IO" %>
<%@ Import Namespace="System.Globalization" %>
<%@ Import Namespace="System.Data" %>
<%@ Import Namespace="System.Collections.Generic" %>
<%@ 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">
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{


this.Store1.DataSource = new object[] { new object[] { "3m Co", 71.72 }, new object[] { "Alcoa Inc", 29.01 }, new object[] { "Altria Group Inc", 83.81 } };
this.Store1.DataBind();
}
}


</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
var move = function (grid, up) {
var ds = grid.getStore();
var record = grid.getSelectionModel().getSelected();
var rindex = ds.indexOf(record); rindex += up ? -1 : 1;
if (rindex < 0 || rindex > ds.getCount())
{ return; }
ds.remove(record);
ds.insert(rindex, record);
grid.getSelectionModel().selectRecords([record]);
};


var del = function (grid) {
var selection = #{GridPanel1}.getView().getSelectionModel().getSel ection()[0];
if (selection) {
#{GridPanel1}.store.remove(selection);

}
};
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<ext:ResourceManager ID="ResourceManager1" runat="server">
</ext:ResourceManager>
<ext:Store ID="Store1" runat="server">
<Model>
<ext:Model ID="Model1" runat="server">
<Fields>
<ext:ModelField Name="company" />
<ext:ModelField Name="price" Type="Float" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
<ext:GridPanel ID="GridPanel1" runat="server" StoreID="Store1" Title=" " Width="600"
Height="350">
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column runat="server" ColumnID="Company" Header="Company" Width="160" Sortable="true"
DataIndex="company" />
<ext:Column runat="server" Header="Price" Width="75" Sortable="true" DataIndex="price" />
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" Mode="Single" />
</SelectionModel>
<Buttons>
<ext:Button ID="Button3" runat="server" Text="UP">
<Listeners>
<Click Handler="move(#{GridPanel1}, true);" />
</Listeners>
</ext:Button>
<ext:Button ID="Button4" runat="server" Text="DOWN">
<Listeners>
<Click Handler="move(#{GridPanel1}, false);" />
</Listeners>
</ext:Button>
<ext:Button ID="Button1" runat="server" Text="Delete">
<Listeners>
<Click Handler="del(#{GridPanel1});" />
</Listeners>
</ext:Button>
</Buttons>
</ext:GridPanel>
</div>
</form>
</body>
</html>

Daniil
Jul 26, 2012, 10:28 PM
Hi,

Not so informative:


but the code can't work.


Please always provide more details.

1. If you use the #{} within the <script>, that <script> must be wrapped in an <ext:XScript> control.

Or you can just replace

#{GridPanel1}
and use the "grid" argument which you pass into the functions.

2. There is no getSelected method. So, please replace

var record = grid.getSelectionModel().getSelected();
with

var record = grid.getSelectionModel().getSelection()[0];

3. There is no the selectedRecords method. So, please replace

grid.getSelectionModel().selectRecords([record]);
with

grid.getSelectionModel().select(record);

gs_user
Jul 27, 2012, 12:37 AM
Hi,
I correct errors, It's can work now.
Thanks again.



<script type="text/javascript">
var move = function (grid, up) {
var ds = grid.getStore();
var record = grid.getSelectionModel().getSelection()[0];
var rindex = ds.indexOf(record); rindex += up ? -1 : 1;
if (rindex < 0 || rindex > ds.getCount())
{ return; }
ds.remove(record);
ds.insert(rindex, record);
grid.getSelectionModel().select(record);
};


var del = function (grid) {
var selection = grid.getView().getSelectionModel().getSelection()[0];
if (selection) {
grid.store.remove(selection);

}
};
</script>



Hi,

Not so informative:


Please always provide more details.

1. If you use the #{} within the <script>, that <script> must be wrapped in an <ext:XScript> control.

Or you can just replace

#{GridPanel1}
and use the "grid" argument which you pass into the functions.

2. There is no getSelected method. So, please replace

var record = grid.getSelectionModel().getSelected();
with

var record = grid.getSelectionModel().getSelection()[0];

3. There is no the selectedRecords method. So, please replace

grid.getSelectionModel().selectRecords([record]);
with

grid.getSelectionModel().select(record);