We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. (Last updated on: November 16, 2018).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

GO TO SPECIFIC PAGE USING VIRTUALSCROLLING WITH URL ADAPTOR AND DATAMANAGER

Thread ID:

Created:

Updated:

Platform:

Replies:

127908 Dec 17,2016 12:06 AM UTC Dec 28,2016 01:01 PM UTC ASP.NET MVC 3
loading
Tags: Grid
César Ventura
Asked On December 17, 2016 12:06 AM UTC


Hola! 

Tengo un Grid con un URL Adaptor y datamanager para mostrar los datos, estoy usando virtualscrolling de esta manera:

@(Html.EJ().Grid<PRODUCTS>("FlatGrid")
.ScrollSettings(scroll => { scroll.Height("auto").Width("auto").FrozenRows(0).AllowVirtualScrolling(true).VirtualScrollMode(VirtualScrollMode.Continuous); })
....
)

y quiero poder navegar entre las páginas aunque estén de manera virtualizada, es decir, que pueda colocar a que página quiero acceder e inmediatamente me dirija ahí,
ya que solamente bajando con el scroll se puede acceder solo a la siguiente página.

de antemano muchas gracias.

saludos!!!

Mani Sankar Durai [Syncfusion]
Replied On December 19, 2016 11:56 AM UTC

Hi Cesar, 

Thanks for contacting Syncfusion support. 

We have analyzed your query and we have prepared a sample that can be downloaded from the below link. 

In this sample we have navigated to the corresponding page which is given in the textbox using gotoPage grid method on button click event. 

Please refer the below code example. 
[Index.cshtml] 
<input id="textbox" type="text" name="value" /> 
<button id="next">Click to navigate </button> 
 
@(Html.EJ().Grid<MVCSampleBrowser.Models.EditableOrder>("FlatGrid") 
.Datasource(ds => ds.URL("/Grid/DataSource").Adaptor(AdaptorType.UrlAdaptor)) 
             .AllowScrolling() 
             .ScrollSettings(scroll => { scroll.AllowVirtualScrolling().Height(300).Width(400).FrozenRows(0).VirtualScrollMode(VirtualScrollMode.Continuous); }) 
 
             .Columns(col => 
            { 
                ... 
              } 
            
) 
 
<script type="text/javascript"> 
    $("#next").ejButton({ 
        click: function (args) { 
            obj = $("#FlatGrid").ejGrid("instance"); 
            var value = parseInt($("#textbox").val()); 
            obj.gotoPage(value);                      //using gotoPage method we can navigate to any page in grid 
            index = (obj.model.pageSettings.pageSize * obj.model.pageSettings.currentPage + 1); 
            scrollobject = obj.getScrollObject(); 
            if (value == 1) 
                scrollobject.scrollY(0) 
            else 
                scrollobject.scrollY(index,true) 
            
        } 
    }); 
</script> 


Using gotoPage method we have navigate from one page to any other page in grid which is given in button click event of ejButton. 

Also please refer the documentation link. 

Please let us know if you need further assistance. 

Regards, 
Manisankar Durai. 


César Ventura
Replied On December 27, 2016 07:25 PM UTC


Gracias por tu respuesta Mani Sankar Durai!!! 

saludos.

Mani Sankar Durai [Syncfusion]
Replied On December 28, 2016 01:01 PM UTC

Hi Cesar, 

Thanks for the update. 

Please get back to us if you need further assistance. 

Regards, 
Manisankar Durai. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

or the page will be automatically redirected to sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;