paging:remain on same page

6 posts, 0 answers
  1. Daniel
    Daniel avatar
    192 posts
    Member since:
    Mar 2012

    Posted 18 Mar 2013 Link to this post

    Hello,
    I have the following scenario :i press a custom edit buttom,and it appears a template under the grid,i make some updates,regarding the row data,and after that,with an action i make the update and the grid is refreshing,but  if was on page 2,the page reset and it shows me again page 1.
    It is possible to remain on the same page,after i reloaded the data?

    Regards,
    Daniel
  2. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2194 posts

    Posted 20 Mar 2013 Link to this post

    Hi Daniel,

     
    From the provided information it`s not clear for us what is the exact reason for this behavior - could you please provide the Grid code and more information about current setup that you have? This would help us pinpoint the exact reason for this behavior.

    Kind Regareds,
    Vladimir Iliev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  3. Daniel
    Daniel avatar
    192 posts
    Member since:
    Mar 2012

    Posted 20 Mar 2013 Link to this post

    The grid code is looking like this:
    @(Html.Kendo().Grid<UCMSPayroll.ViewModels.TallyMeasurementViewModel>()
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(p => p.Code);
            columns.Bound(p => p.Name);
            columns.Bound(p => p.MaxLength).Title("Max length");
            columns.Bound(p => p.IsActive).ClientTemplate("#=IsActive ? 'da': 'nu'#"); ;
            columns.Bound(p => p.IsHour).ClientTemplate("<input type='checkbox' disabled='true'   name='IsHour' #= IsHour ? checked='checked' : '' # />"); ; ;
            columns.Bound(p => p.Precision);
            columns.Bound(p => p.Priority);
            columns.Bound(p => p.Formula);
            columns.Command(command => { command.Destroy().Text("del"); command.Custom("modifica").Click("doLoading"); }).Width(200);
            columns.Template(x => { }).ClientTemplate("<img  src='/Content/Images/edit.png' onclick='doLoading1(this)' title='test'> <a href='javascript: void(0)' class='abutton delete' onclick='deleteRow(this)' title='button delete'></a>");

        })

        .ToolBar(toolBar => toolBar.Template("<a href='javascript: void(0)' class='abutton create' onclick='createRow()' title='button create'></a>"))
        .Pageable()
        .Sortable()
        .Scrollable()

        .DataSource(dataSource => dataSource
            .Ajax()
            .Events(events => events.Error("error_handler"))
            .Model(model => model.Id(p => p.PkTallyMeasurement))
            .Create(update => update.Action("EditingInline_Create", "Home"))
            .Read(read => read.Action("EditingInline_Read", "Home"))
            .Update(update => update.Action("EditingInline_Update", "Home"))
            .Destroy(update => update.Action("EditingInline_Destroy", "Home"))
            .PageSize(5)
        )
        )
    <div id="editZone">
    </div>
    <script>
    function doLoading1(e) {

            var grid = $("#Grid").data("kendoGrid");
            var dataitem = grid.dataItem($(e).closest("tr"));
            $("#editZone").hide();
            $('#editZone').load('/Home/CreateEdit/' + dataitem["PkTallyMeasurement"], function () {
                $("#editZone").fadeIn('slow');
            });
        }
    </script>
    in the controller the read action is looking like this

    public ActionResult EditingInline_Read([DataSourceRequest] DataSourceRequest request)
            {
                return Json(_tallyMeasurementRepository.GetAll().ToDataSourceResult(request));
            }
    the action that is used in the .Load function is looking like this:

    [HttpGet]
            [OutputCache(Duration=2,VaryByHeader="X-Requested-With",Location=OutputCacheLocation.Server)]
            [RestrictToAjax]
            public ActionResult CreateEdit(int id=0)
            {
                   if (id != 0)
                    {
                        var model = _tallyMeasurementRepository.GetById(id);
                        return PartialView("_CreateEdit", AutoMapper.Mapper.Map<TallyMeasurement, TallyMeasurementViewModel>(model));
                    }
                    else
                    {
                        return PartialView("_CreateEdit", new TallyMeasurementViewModel());
                    }
                   
            }
    and the Post action
    [HttpPost]
            
            public ActionResult CreateEdit(TallyMeasurementViewModel viewModel)
            {
                if (viewModel != null)
                {
                    if (viewModel.PkTallyMeasurement != 0)
                        _tallyMeasurementRepository.Update(AutoMapper.Mapper.Map<TallyMeasurementViewModel, TallyMeasurement>(viewModel));
                    else
                        _tallyMeasurementRepository.Add(AutoMapper.Mapper.Map<TallyMeasurementViewModel, TallyMeasurement>(viewModel));

                }
                return RedirectToAction("Measurementt");
            }

    The main ideea is when i press add or edit,below the grid,it appears a html template,with the model values if,we are editing,or empty if we are adding.
    And if i am on page 2,and i add a new record,the position is remaining on page 2,until i press the button to submit the new data,after that the grid refreshes and the page become 1,instead it should be still on page 2,or if i have a pagesize of 5,and i add a new data,it should move to the page 3,not repositioning on page 1.And i have to add the data to the server,because the template and the grid are on the same web page,so if i add something new,i want to see it in the grid.

    I hope is pretty clear.
    Regards,
    Daniel
  4. Daniel
    Daniel avatar
    192 posts
    Member since:
    Mar 2012

    Posted 21 Mar 2013 Link to this post

    I think maybe is because i make a redirect to a page,so a full server request,and the paging is reseting.Is this the reason?
  5. Vladimir Iliev
    Admin
    Vladimir Iliev avatar
    2194 posts

    Posted 22 Mar 2013 Link to this post

    Hi Daniel,

     
    Basically you are loosing the grid current state because you are redirecting to another page. In current case I would suggest to use the Grid dataSource client-side read method to refresh the grid with the new data after you submit the changes using Ajax request (without reloading the current page).

    Kind Regards,
    Vladimir Iliev
    the Telerik team
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
  6. Daniel
    Daniel avatar
    192 posts
    Member since:
    Mar 2012

    Posted 25 Mar 2013 Link to this post

    ok,thank you for the suggestion.
Back to Top