Hi.
I have my igGrid and the datasource is filtered by two dates entered into two igdatepicker, it works fine, but now the problem is I can not use the features of the grid, I show the code:
here i filtering by the datepicker:
function Calculo() { var fInicio = document.getElementById("FechaInicio").value; var fFin = document.getElementById("FechaFin").value; $.getJSON( "/ComisionesCalculadas/Calculo", { fechainicio: fInicio, fechafin: fFin }, function (json) { $("#grid").igGrid("dataSourceObject", json); $("#grid").igGrid("dataBind"); }, "json" ); }
function busqueda() { var fInicio = document.getElementById("FechaInicio").value; var fFin = document.getElementById("FechaFin").value; $.getJSON( "/ComisionesCalculadas/Busqueda", { fechainicio: fInicio, fechafin: fFin }, function (json) { $("#grid").igGrid("dataSourceObject", json); $("#grid").igGrid("dataBind"); }, "json" ); }
and there is my controllers:
[HttpGet] public JsonResult Busqueda(string fechainicio, string fechafin) { DateTime fechaInicio = Convert.ToDateTime(fechainicio); DateTime fechaFin = Convert.ToDateTime(fechafin); var busqueda = this.busquedaFiltrada(fechaInicio, fechaFin); return Json(busqueda, JsonRequestBehavior.AllowGet); } [HttpGet] public JsonResult Calculo(string fechainicio, string fechafin) { DateTime fechaInicio = Convert.ToDateTime(fechainicio); DateTime fechaFin = Convert.ToDateTime(fechafin); db.spComisionesCalcular(fechainicio, fechaFin); var calculo = this.busquedaFiltrada(fechaInicio, fechaFin); return Json(calculo, JsonRequestBehavior.AllowGet); }
public IQueryable busquedaFiltrada(DateTime fechainicio, DateTime fechafin) {
var fechas = from p in db.viewCalculo orderby p.FechaEvento where p.FechaEvento == fechainicio || p.FechaEvento > fechainicio && p.FechaEvento < fechafin || p.FechaEvento == fechafin select p; return fechas; }
If someone could help me I thank you in advance.
Regards
Christhian.
Hi,
are you getting any specific errors?
Thanks,
Angel
Hi Angel.
The problem is that the features do not work, sorting, filtering and paging, the grid is not refreshed when I use them, this is the code I use to activate these features:
.Features(features =>{ features.Sorting(); features.Paging().PageSize(10).FirstPageLabelText("").FirstPageTooltip("Ir a primera pagina").PrevPageLabelText("").PrevPageTooltip("Ir a pagina Anterior").ShowPagerRecordsLabel(true) .LastPageLabelText("").LastPageTooltip("Ir a Ultima pagina").NextPageLabelText("").NextPageTooltip("Ir a Siguiente pagina").PageSizeDropDownLabel("Mostrar").PageSizeDropDownTrailingLabel("Registros"); features.Filtering().FilterButtonLocation(Location.Left);});
There is an error that appears to me, just do nothing, change page and does not change, drawing data and does not move, I want to filter and not filter them.
Maybe you and able to see that the change in runtime datasource, but you tell me, I read some sorting and filtering remote, but if truth is not the case.
And I hope you can help me.
regards
hey,
it's a bit hard for me to understand what exactly is wrong - i mean it could be an issue with the way the data source is set, or some other problem. What could really help is if you can paste the whole grid configuration (including any controller code), as well as provide any screenshots from firebug, when you hit next / prev in the paging, or try to sort a column. I would like to see if the requests make it to the server, and what the response code is. If you cannot provide this information i will try to setup a sample tomorrow and try to reproduce it in more depth.
thank you
thanks for you response.
this is my view:
@model IQueryable<ComisionesModels.viewCalculo>@using Infragistics.Web.Mvc; @{ ViewBag.Title = " "; Layout = "~/Views/Shared/_Layout.cshtml";}
<script type="text/javascript"> $(window).load(function () { $('#FechaInicio').igDatePicker({ width: 200, dateInputFormat: 'date', regional: 'en-US', required: true, nullText: 'Ingrese fecha de inicio' }); $('#FechaFin').igDatePicker({ width: 200, dateInputFormat: 'date', regional: 'en-US', required: true, nullText: 'Ingrese fecha de fin' }); $("#btnCalcular").igButton({ labelText: $("#btnCalcular").val() }); $("#btnBusqueda").igButton({ labelText: $("#btnBusqueda").val() }); });</script><script type="text/javascript">
function Calculo() { var fInicio = document.getElementById("FechaInicio").value; if( fInicio == 'Ingrese fecha de inicio'){ alert("No ha ingresado Fecha de Inicio"); return; } var fFin = document.getElementById("FechaFin").value; if( fFin == 'Ingrese fecha de fin'){ alert("No ha ingresado Fecha de Fin"); return; } if (fInicio > fFin) { alert("La fecha de Fin es mayor a la Fecha de Inicio"); return; } $.getJSON( "/ComisionesCalculadas/Calculo", { fechainicio: fInicio, fechafin: fFin }, function (json) { $("#grid").igGrid("dataSourceObject", json); $("#grid").igGrid("dataBind"); }, "json" ); } function busqueda() { var fInicio = document.getElementById("FechaInicio").value; if( fInicio == 'Ingrese fecha de inicio'){ alert("No ha ingresado Fecha de Inicio"); return; } var fFin = document.getElementById("FechaFin").value; if( fFin == 'Ingrese fecha de fin'){ alert("No ha ingresado Fecha de Fin"); return; } if(fInicio > fFin){ alert("La fecha de Fin es mayor a la Fecha de Inicio"); return; } $.getJSON( "/ComisionesCalculadas/Busqueda", { fechainicio: fInicio, fechafin: fFin }, function (json) { $("#grid").igGrid("dataSourceObject", json); $("#grid").igGrid("dataBind"); }, "json" ); }</script><h2>Calculo de Comisiones</h2> <div id="controles"> <br /> <table style=" width: 850px"> <tr> <td></td> <td></td> <td><strong>Fecha Inicio:</strong></td> <td><input id="FechaInicio" type="text" /></td> <td></td> <td><strong>Fecha Fin:</strong></td> <td><input id="FechaFin" type="text" /></td> <td></td> <td></td> <td><input id="btnBusqueda" type="button" value="Busqueda" onclick="busqueda()" /></td> <td><input id="btnCalcular" type="button" value="Calcular" onclick="Calculo()" /></td> </tr> </table> <br /> </div>
@(Html.Infragistics().Grid(Model).ID("grid").Width("900px").ShowHeader(true).Columns(columns => { columns.For(x => x.idEmpleadosEventos).HeaderText("idEmpleadosEventos").Width("150px"); columns.For(x => x.FechaEvento).HeaderText("FechaEvento").Width("120px"); columns.For(x => x.idEmpleado).HeaderText("idEmpleado").Width("100px"); columns.For(x => x.idRol).HeaderText("idRol").Width("100px"); columns.For(x => x.idEventoPago).HeaderText("idEventoPago").Width("110px"); columns.For(x => x.idPlaza).HeaderText("idPlaza").Width("100px"); columns.For(x => x.idTipoLote).HeaderText("idTipoLote").Width("100px"); columns.For(x => x.idVentanilla).HeaderText("idVentanilla").Width("100px"); columns.For(x => x.idHipoteca).HeaderText("idHipoteca").Width("100px"); columns.For(x => x.MontoOperacion).HeaderText("MontoOperacion").Width("130px").DataType("currency"); columns.For(x => x.FechaCalculo).HeaderText("FechaCalculo").Width("130px"); columns.For(x => x.TipoPago).HeaderText("TipoPago").Width("100px"); columns.For(x => x.CantidadPago).HeaderText("CantidadPago").Width("120px"); columns.For(x => x.MontoPago).HeaderText("MontoPago").Width("100px"); columns.For(x => x.PorcentajeComision).HeaderText("PorcentajeComision").Width("150px"); columns.For(x => x.MontoComision).HeaderText("MontoComision").Width("130px"); columns.For(x => x.EstatusEnviado).HeaderText("EstatusEnviado").Width("130px"); }) .Features(features =>{ features.Sorting(); features.Paging().PageSize(10).FirstPageLabelText("").FirstPageTooltip("Ir a primera pagina").PrevPageLabelText("").PrevPageTooltip("Ir a pagina Anterior").ShowPagerRecordsLabel(true) .LastPageLabelText("").LastPageTooltip("Ir a Ultima pagina").NextPageLabelText("").NextPageTooltip("Ir a Siguiente pagina").PageSizeDropDownLabel("Mostrar").PageSizeDropDownTrailingLabel("Registros"); features.Filtering().FilterButtonLocation(Location.Left); features.Hiding().ColumnChooserCaptionText("Elegir Columna").ColumnHideText("Ocultar Columna").ColumnChooserDisplayText("Elegir Columna"); }) .Height("330") .DataSourceUrl(Url.Action("Index")) .DataBind().Render() )
and this is my controller:
private ComisionesDBEntities db = new ComisionesDBEntities(); // // GET: /Calculo/ComisionesCalculadas/ public ActionResult Index() { return View("Index"); } [HttpGet] public JsonResult Busqueda(string fechainicio, string fechafin) { DateTime fechaInicio = Convert.ToDateTime(fechainicio); DateTime fechaFin = Convert.ToDateTime(fechafin); var busqueda = this.busquedaFiltrada(fechaInicio, fechaFin); return Json(busqueda, JsonRequestBehavior.AllowGet); } [HttpGet] public JsonResult Calculo(string fechainicio, string fechafin) { DateTime fechaInicio = Convert.ToDateTime(fechainicio); DateTime fechaFin = Convert.ToDateTime(fechafin); db.spComisionesCalcular(fechaInicio, fechaFin); var calculo = this.busquedaFiltrada(fechaInicio, fechaFin); return Json(calculo, JsonRequestBehavior.AllowGet); }
public IQueryable busquedaFiltrada(DateTime fechainicio, DateTime fechafin) { var fechas = from p in db.viewCalculo orderby p.FechaEvento where p.FechaEvento == fechainicio || p.FechaEvento > fechainicio && p.FechaEvento < fechafin || p.FechaEvento == fechafin select p; return fechas; }
I think, the problem is the datasource, because, if my datasource is an simple query, my grid works fine sorting, filtering and every features, and this case the datasource is changing in base of two dates, but i'm in your hands.
thanks Angel.
But I'm resolved, there are two ways to do this, first create a method to updateURL, in this method to the query with the latest dates entered:
the other way, and is the most simple, just add the feature ". Type (OpType.Local), and either way I work!!.
Thanks anyway.