VIEW
@{
var X = Html.X();
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>Index</title>
<script type="text/javascript">
var onClick = function () {
var values = App.GridPanel1.getSelectionModel().getSelection();
App.GridPanel1.getStore().remove(values)
var store = App.GridPanel2.getStore();
store.loadData(values,true)
console.log(values);
console.log(store);
}
</script>
</head>
<body>
<div>
@X.ResourceManager()
@(
Html.X().GridPanel()
.ID("GridPanel1")
.ForceFit(true)
.Title("GridPanel1")
.AutoScroll(true)
.Scroll(ScrollMode.Both)
.Store(
Html.X().Store()
.DataSource(ViewBag.loadgrid)
.Model
(
X.Model()
.Fields
(
X.ModelField().Name("reqid").Type(ModelFieldType.String),
X.ModelField().Name("matid").Type(ModelFieldType.String),
X.ModelField().Name("quotid").Type(ModelFieldType.String)
)
)
)
.ColumnModel(
Html.X().Column().DataIndex("reqid").Text("Common Name 1").Flex(1),
Html.X().Column().DataIndex("matid").Text("Common Name 2").Flex(1),
Html.X().Column().DataIndex("quotid").Text("Common Name 3").Flex(1)
)
.SelectionModel(
X.CheckboxSelectionModel()
.Mode(SelectionMode.Multi)
)
.BottomBar(
Html.X().PagingToolbar()
)
)
@(
Html.X().GridPanel()
.ID("GridPanel2")
.Title("GridPanel2")
.Store(
Html.X().Store()
.DataSource(ViewBag.loadgrid2)
.Model
(
X.Model()
.Fields
(
X.ModelField().Name("reqid").Type(ModelFieldType.String),
X.ModelField().Name("matid").Type(ModelFieldType.String),
X.ModelField().Name("quotid").Type(ModelFieldType.String)
)
)
)
.ColumnModel(
Html.X().Column().DataIndex("reqid").Text("Common Name 1").Flex(1),
Html.X().Column().DataIndex("matid").Text("Common Name 2").Flex(1),
Html.X().Column().DataIndex("quotid").Text("Common Name 3").Flex(1),
Html.X().ImageCommandColumn()
.Width(30)
.Commands(
Html.X().ImageCommand()
.Icon(Icon.Decline)
.ToolTip(t =>
{
t.Text = "Delete plant";
})
.CommandName("delete")
)
.Listeners(l => {
//l.Command.Handler = "App.GridPanel1.getStore().add(record); this.grid.geStore().remove(record);";
l.Command.Handler = "App.GridPanel1.getStore().add(record); this.up('gridpanel').store.removeAt(recordIndex);";
})
)
.SelectionModel(
X.CheckboxSelectionModel()
.Mode(SelectionMode.Multi)
)
.BottomBar(
Html.X().PagingToolbar()
)
)
@(X.Button().Text("click")
.Listeners(l =>
{
l.Click.Handler = "onClick()";
})
)
</div>
</body>
</html>
CONTROLLER AND SAMPLE DATA
public class Copy_Grid_to_gridController : Controller
{
//
// GET: /Copy_Grid_to_grid/
public ActionResult Index()
{
var l = new List<testGrid>();
for (int i = 0; i <= 2; i++)
{
var o = new testGrid()
{
reqid="GridPanel1-REQID-"+i.ToString(),
matid = "GridPanel1-MATID-" + i.ToString(),
quotid = "GridPanel1-QUOTID-" + i.ToString(),
};
l.Add(o);
}
ViewBag.loadgrid = l;
var l2 = new List<testGrid>();
for (int i = 0; i <= 2; i++)
{
var o2 = new testGrid()
{
reqid = "GridPanel2-REQID-" + i.ToString(),
matid = "GridPanel2-MATID-" + i.ToString(),
quotid = "GridPanel2-QUOTID-" + i.ToString(),
};
l2.Add(o2);
}
ViewBag.loadgrid2 = l2;
return View();
}
}
public class testGrid
{
public string reqid { get; set; }
public string matid { get; set; }
public string quotid { get; set; }
}
There are 2 listener Handler in
GridPanel2 ,commented function not working.
Select some record from
Gridpanel1 and click on button,then remove data from
Gridpanel2
