This is a migrated thread and some comments may be shown as answers.
New Offline feature
4 Answers 29 Views
This is a migrated thread and some comments may be shown as answers.
Mike
Top achievements
Rank 1
Mike asked on 02 Dec 2014, 11:22 PM
Can someone point to some demos using this new feature using the MVC Wrappers. A complete demo would be nice. Someone mentioned during the webinar about some examples that also show how to detemine when Broswers on online and offline.  Thanks

4 Answers, 1 is accepted

Sort by
0
Petur Subev
Telerik team
answered on 04 Dec 2014, 04:49 PM
Hello Mike,

At this point we do not have MVC demo that represents the same as the that the HTML demo, but it is possible to do it through the MVC wrappers. Basically the only option that you need to enable is to specify the OfflineStorage variable.

You can try this on the editing (incell) MVC demo like I did:



@(Html.Kendo().Grid<Kendo.Mvc.Examples.Models.ProductViewModel>()   
    .Name("Grid")   
    .Columns(columns => {       
        columns.Bound(p => p.ProductName);
        columns.Bound(p => p.UnitPrice).Width(140);
        columns.Bound(p => p.UnitsInStock).Width(140);
        columns.Bound(p => p.Discontinued).Width(100);
        columns.Command(command => command.Destroy()).Width(110);
    })
    .ToolBar(toolbar => {
        toolbar.Create();
        toolbar.Save();       
    })
    .Editable(editable => editable.Mode(GridEditMode.InCell))
    .Pageable()
    .Navigatable()
    .Sortable()
    .Scrollable()
    .DataSource(dataSource => dataSource       
        .Ajax()        
        .Batch(true)
        .PageSize(20)
        .OfflineStorage("foo")
        .ServerOperation(false)               
        .Events(events => events.Error("error_handler"))
        .Model(model => model.Id(p => p.ProductID))
        .Create("Editing_Create", "Grid")
        .Read("Editing_Read", "Grid")
        .Update("Editing_Update", "Grid")
        .Destroy("Editing_Destroy", "Grid")
    )
)
<script type="text/javascript">
    function error_handler(e) {   
        if (e.errors) {
            var message = "Errors:\n";
            $.each(e.errors, function (key, value) {
                if ('errors' in value) {
                    $.each(value.errors, function() {
                        message += this + "\n";
                    });
                }
            });       
            alert(message);
        }
    }
</script>


Kind Regards,
Petur Subev
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Mike
Top achievements
Rank 1
answered on 04 Dec 2014, 05:17 PM
Thanks. What about the second part of my question? The demo on determining if Online or Offline in IE, Chrome, or FireFox.
0
Petur Subev
Telerik team
answered on 08 Dec 2014, 08:37 AM
Hello Mike,

I assume the following topic is the one that you are looking for:

http://docs.telerik.com/kendo-ui/framework/datasource/offline#detect-browser-internet-connection

Kind Regards,
Petur Subev
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
El Chamo
Top achievements
Rank 2
answered on 30 Jul 2015, 12:13 AM

Hi,

The example is good but how can I set Offline the datasource ? How can I do the equivalent on MVC of the following javascript code to set the datasource offline explicitly?:

dataSource.online(true);

How can I get the datasource object from mi MVC Razor code?

This is my code:

 

@(Html.Kendo().Grid<User>()
    .Name("grid")
    .Columns(columns =>
    {
        columns.Bound(c => c.DisplayName).Width(250).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
        columns.Bound(c => c.UserPrincipalName).Width(250).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
        columns.Bound(c => c.JobTitle);
        columns.Bound(c => c.ObjectId);
        columns.Command(command => command.Custom("ViewDetails").Click("showDetails"));
    })
    .HtmlAttributes(new { style = "height: 730px;" })
    .Scrollable()
    .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
    .Groupable()
    .Sortable()
    .Pageable(pageable => pageable
        .Refresh(true)
        .PageSizes(true)
        .ButtonCount(10))
    .DataSource(dataSource => dataSource
        .Ajax()
                .PageSize(10)
            .ServerOperation(true)
                        .Read(read => read.Action("GetUsers", "Users"))
                        .OfflineStorage("User-Offline")
                                .Model(i => i.Id("ObjectId"))                       
    )
)

Thanks.
 
Tags
Grid
Asked by
Mike
Top achievements
Rank 1
Answers by
Petur Subev
Telerik team
Mike
Top achievements
Rank 1
El Chamo
Top achievements
Rank 2
Share this question
or