I have the following grid working fine with no problems:
<script>
function load(args) {
this.columns[1].format = { type: 'date', format: 'dd/MM/yyyy' }; // set your customize date format based on your column
}
function toolbarClick(args) {
var gridObj = document.getElementById("SaldosMXgrid").ej2_instances[0];
if (args.item.id === 'SaldosMXgrid_pdfexport') {
gridObj.pdfExport();
}
if (args.item.id === 'SaldosMXgrid_excelexport') {
gridObj.excelExport();
}
}
function refresh(e) {
if (e.requestType == "save") {
var grid = document.getElementById("SaldosMXgrid").ej2_instances[0];
grid.refresh();
}
}
</script>
<h2>Saldos Moneda Nacional</h2>
<p>
<div id="menubuttons">
<ejs-button id="btn" content="Importar Saldos MXN" type="button" onclick='ImportarSaldosMXN()' style="margin-top:15px;"></ejs-button>
</div>
</p>
<hr />
@{
var chilDataManager = new Syncfusion.EJ2.DataManager()
{
Adaptor = "UrlAdaptor",
Url = "/Saldos/FacturasRelacionadasgrid_Read/ ",
RequestType = "Post",
CrossDomain = true,
InsertUrl = "/Saldos/FacturasRelacionadasgrid_Create/",
RemoveUrl = "/Saldos/FacturasRelacionadasgrid_Delete/"
};
var childGrid = new Syncfusion.EJ2.Grids.Grid()
{
DataSource = chilDataManager,
QueryString = "BalanceID",
ActionBegin = "begin",
Toolbar = new List<string>()
{
new string("Add"),
new string("Delete"),
new string("Cancel"),
new string("Update")
},
EditSettings = new Syncfusion.EJ2.Grids.GridEditSettings()
{
AllowAdding = true,
AllowDeleting = true
},
Columns = new List<Syncfusion.EJ2.Grids.GridColumn>
{
new Syncfusion.EJ2.Grids.GridColumn(){ Field = "BalancesCfdiRelationID", Visible = false, IsPrimaryKey = true, IsIdentity = true },
new Syncfusion.EJ2.Grids.GridColumn(){ Field = "BalanceID", Visible = false, DefaultValue = "$ BalanceID" },
new Syncfusion.EJ2.Grids.GridColumn(){ Field = "cfdiID", HeaderText = "Factura", ForeignKeyValue = "Factura", ForeignKeyField = "cfdiID", DataSource = ViewBag.Facturas },
}
};
}
<script>
function begin(args) {
if (args.requestType == "save") {
var value = this.parentDetails.parentKeyFieldValue;
args.data.BalanceID = value;
}
}
</script>
<div id="contenido">
<br />
<ejs-grid id="SaldosMXgrid" childGrid="childGrid" load="load" allowExcelExport="true" allowSorting="true" allowReordering="true" allowFiltering="true" allowPaging="true" toolbarClick="toolbarClick" toolbar="@(new List<string>() { "ExcelExport", "Search", "Print", "Cancel", "Update" })">
<e-data-manager id="dataManager" adaptor="UrlAdaptor" url="/Saldos/SaldosMXgrid_Read" updateUrl="/Saldos/SaldosMXgrid_Update" requestType="Post"></e-data-manager>
<e-grid-editSettings allowDeleting="false" allowEditing="true" allowAdding="false" mode="Normal" showConfirmDialog="true"></e-grid-editSettings>
<e-grid-columns>
<e-grid-column field="BalanceID" isPrimaryKey="true" visible="false"></e-grid-column>
<e-grid-column field="TransactionDate" type="date" headerText="Fecha" width="110" allowEditing="false"></e-grid-column>
<e-grid-column field="TransactionReference" headerText="Referencia" width="610" allowEditing="false"></e-grid-column>
<e-grid-column field="Withdraw" headerText="Cargos" width="120" format="c2" allowEditing="false"></e-grid-column>
<e-grid-column field="WithdrawComments" headerText="Comentarios" allowResizing="true" width="300" allowEditing="true"></e-grid-column>
<e-grid-column field="Deposit" headerText="Abono" width="280" format="c2" allowResizing="true" allowEditing="false"></e-grid-column>
<e-grid-column field="DepositComments" headerText="Comentarios" width="300" allowEditing="true"></e-grid-column>
<e-grid-column field="BalanceAmount" headerText="Saldo" format="c2" allowResizing="true" visible="true" width="150" allowEditing="false"></e-grid-column>
</e-grid-columns>
</ejs-grid>
<ejs-scripts></ejs-scripts>
</div>
This is the controller read action:
public IActionResult SaldosMXgrid_Read([FromBody]DataManagerRequest dm)
{
IEnumerable<Balances> DataSource;
using (var context = new CotizadorTodashContext())
{
var CompanyID = context.AccountingUsers.FirstOrDefault(p => p.userLogin == User.Identity.Name).CompanyID;
DataSource = context.Balances.Where(p => p.CompanyID == CompanyID && p.BalanceCurrency == "MXN").OrderBy(p => p.BalanceID).OrderByDescending(p => p.TransactionDate).ToList();
foreach(var item in DataSource)
{
item.Company = null;
}
}
DataOperations operation = new DataOperations();
if (dm.Search != null && dm.Search.Count > 0)
{
DataSource = operation.PerformSearching(DataSource, dm.Search); //Search
}
int count = 0;
if (dm.Sorted != null && dm.Sorted.Count > 0) //Sorting
{
DataSource = operation.PerformSorting(DataSource, dm.Sorted);
}
if (dm.Where != null && dm.Where.Count > 0) //Filtering
{
DataSource = operation.PerformFiltering(DataSource, dm.Where, dm.Where[0].Operator);
}
else
{
count = DataSource.Cast<Balances>().Count();
}
if (dm.Skip != 0)
{
DataSource = operation.PerformSkip(DataSource, dm.Skip); //Paging
}
if (dm.Take != 0)
{
DataSource = operation.PerformTake(DataSource, dm.Take);
}
return dm.RequiresCounts ? Json(new { result = DataSource, count = count }) : Json(DataSource);
}
What i need to do is, to change the read Url on the fly with JavaScript, to reload the grid with new data, according the user input. I can create a new DataManager with JS, and assign it to the datagrid, but, it doesn't hit the controller action unless i change the "[FromBody]" tag to "[FromForm]", but in that case, the data returns correctly but the grid doesn´t show it.
Can you help me with that?
BTW..Sorry for the bad english