I have been trying to find some help in various places for an issue that I'm having with a tabstrip and grid.

What I'm trying to do
What I'm trying to do is use a server bound grid that uses templates for 2 of its rows inside of a tab strip that I would like to get loaded using "LoadContentFrom" to take advantage of on demand loading. In addition to that, I need to implement sorting on the grid.

What I've already tried
I have tried numerous ways to make this happen but have not had any success. To temporarily solve this problem, I am using the "Content" function to load the data in my tab strips. The down side of this is that all the data in all my tab strips gets loaded on page load. This causes the page to load slower and each time I click on a column header to sort, the page refreshes.

Summary question
So my question is, is it possible to have a tab strip that uses the "LoadContentFrom" method and have a server bound grid within one of the tab strips that can sort?  If it is possible, can someone give me an example of what that would look like?

My development environment
I am work on an MVC 4 based project. I am using VB.NET as my programming language. I am fine with someone providing an answer using C#.

What my code looks like now
Below is an example of the code that I have now.

Tab strip code
@Imports CommericalPortal.BusinessData.Entities
@Imports CommericalPortal.Web.Models.Entities
@imports CommericalPortal.Web.My.Resources
@ModelType Customer

@Code
    ViewBag.Settings.PageTitle = Model.OperatingName

    Dim lastSavedTabIndex As Integer
    If Request.Cookies("TabCustomersPolicySavedIndex") IsNot Nothing AndAlso IsNumeric(Request.Cookies "TabCustomersPolicySavedIndex").Value) Then
        lastSavedTabIndex = CInt(Request.Cookies("TabCustomersPolicySavedIndex").Value)
    Else
        lastSavedTabIndex = 1
    End If
End Code

@(Html.Kendo().TabStrip().Name("TabCustomers").SelectedIndex(lastSavedTabIndex) _
    .Items(Sub(actions)
                   actions.Add().Text(TabText.ContactInfoTab).Content(Html.Action("ByLocation", "Contacts", New With {.asPartial = True}).ToHtmlString)
                   actions.Add().Text(TabText.PoliciesTab).Content(Html.Action("ByLocation", "Policies", New With {.asPartial = True}).ToHtmlString)
                   actions.Add().Text(TabText.InvoicesTab).Content(Html.Action("ByLocation", "Invoices", New With {.asPartial = True}).ToHtmlString)
                   actions.Add().Text(TabText.ClaimsTab).Content(Html.Action("ByLocation", "Claims", New With {.asPartial = True}).ToHtmlString)
                   actions.Add().Text(TabText.BillingTab).Content(Html.Action("ForCustomer", "Billing", New With {.asPartial = True}).ToHtmlString)
           End Sub) _
    .Events(Sub(x)
                   x.Select("onSelect")
            End Sub)
    )

<script>
    function onSelect(e) {
        SetupTabStripToRememberActiveTabBetweenPageCalls
("TabCustomers", "TabCustomersPolicySavedIndex");
    }
</script>


Tab strip contents code (grid)
@ModelType ilist(of CommericalPortal.BusinessData.Entities.PACInformation)'
@imports CommericalPortal.Web

@(Html.Kendo.Grid(Model).Name("DisplayPAC") _
    .Columns(Sub(columns)
                 columns.Bound(Function(model) model.AccountNumber).Title(CommericalPortal.BusinessData.Resources.BillingAndInvoices.PacAccountNumberLabel_ShortForm).Sortable(False)
                 columns.Bound(Function(model) model.BankNumber).Title(CommericalPortal.BusinessData.Resources.BillingAndInvoices.PacBankNumberLabel_ShortForm)
                 columns.Bound(Function(model) model.TransitNumber).Title(CommericalPortal.BusinessData.Resources.BillingAndInvoices.PacTransitNumberLabel_ShortForm)
                 columns.Bound(Function(model) model).Template(Function(obj) String.Format("<a href='{0}/{1}'>{2}</a>", Url.Content("~/PAC/Edit"), obj.ID, CommericalPortal.Web.My.Resources.GridText.EditLinkText)).Title("")
                 columns.Bound(Function(model) model).Template(Function(obj) String.Format("<a  href='{0}/{1}'>{2}</a>", Url.Content("~/PAC/ViewCheques"), obj.ID, CommericalPortal.Web.My.Resources.GridText.ViewChequesLinkText)).Title("")
         End Sub) _
    .Sortable(Function(sorting) sorting.SortMode(GridSortMode.SingleColumn).Enabled(True))
)

Does HeirarchicalDataSource support heterogeneous objects?
If my transport receives something like:
[{"id": 1, "name": "smith", "groups": [{"id": 1, "typeId": 1, "valueId": 1}]}]

How would the model be defined? Could you do something like:
groupModel = {
    id: "id",
    fields: {
        id: { editable: false, nullable: false, type: "number" },
        typeId: { editable: true, nullable: false, type: "number" },
valueId { editable: true, nullable: false, type: "number" },
    },
    hasChildren: false,
};
personModel = {
id: "id",
fields: {
        id: { editable: false, nullable: false, type: "number" },
name: {editable: true, nullable: false, type: "string" },
groups: groupModel,
},
hasChildren: function(item) {
return item.groups.length > 0;
}
} 
I then use the person object in the model field of the schema in my data source. 
I know the above doesn't work. If I move groups out side of the fields like it doesn't work either. It doesn't seem to know I want to define nested node objects. Do I explicitly need to new Node objects? 

I have use one upload file of kendo web ui and i'm having trouble at removeurl 1 file in me session.
i don't know paramater one ( id ) from removeurl.
Me code here bellow:
(
       $(document).ready(function () {
         $("#files").kendoUpload({
             async: {
                 saveUrl: "/Admin_Site/Upload_file",
                 removeUrl:"/Admin_Site/Remove_File", 
                 autoUpload: true,
             },
            remove: onRemove,
            select: onSelect,
            success: onSuccess,
         });
     });
)

Hi,

I need to make the iframe scrollable and zoomable inside the ModalView and I am not having any success on an iPad. I even tried data-zoom=true etc did not work.

Please see the code below (does not work on an iPad):

Thank you for any help!

According to Apple iOS usability  guidelines:
  "iOS apps allow people to tap the status bar to quickly scroll back to the top of a long list"

So, I try to implement with the following about.html.  Tap event is not showing up in console.  Any ideas?
Thanks,
Rick

<html>
<head>
    <title>About</title>
</head>
<body>
    <section data-role="layout" data-id="about-layout">
        <header data-role="header">
            <div data-role="navbar" data-tap="myTouch.tap">
                <span date-role="view-title">About</span>
            </div>
        </header>
        <!--View content will render here-->
        <footer data-role="footer">
            <div data-role="tabstrip">
                <a href="#home" data-icon="home">Home</a>
                <a href="search.html" data-icon="search">Search</a>
                <a href="about.html" data-icon="about">About</a>
                <a href="more.html" data-icon="more">More</a>
            </div>
        </footer>
    </section>
    <div id="about" data-role="view" data-layout="about-layout" data-zoom="true" data-reload="true">
... long content removed
    </div>
    <script>
        function NavTouch() {
            console.log("tap");
            var view = $("#about").data("kendoMobileView");
            view.scroller.reset();
        }
        window.myTouch = {
            tap: function(e) { NavTouch(); },
        }
        </script>
</body>
</html>

Hi,

I have noticed that when displaying large grids on an android tablet (Chrome for Android or the preinstalled Android Browser), scrolling performance is very poor.

For example when scrollable is set to true scrolling becomes painfully slow and useless both browsers: http://jsfiddle.net/wqCQN/19/

If scrollable.virtual is set to true it is pretty much the same on chrome but does not work at all in android browser http://jsfiddle.net/wqCQN/21/

Surprisingly to me, if scrollable is set to false http://jsfiddle.net/wqCQN/22/ scrolling becomes very smooth and responsive in both browsers, exactly how I would want it in all scrollable modes. However, the problem with this configuration is that column widths are not respected and column headers scroll away when scrolling.

UserAgents of tested browsers:


Grids are the most common and important component of our interface and are the reason why we chose Kendo UI in the first place.

Is there a way to get it to perform better on mobile browsers with column headers staying visible while scrolling and possibly column widths still being applied?

Thanks.

hello,
there is  a checkbox group in listview ,  when user tap checkbox , data-click="listViewClick" ,event fire

Test env:  ipad mini
        when tap down on any  one of  chekcbox group in listview,  checkbox 's  checked status can not be access by right now ,  I have tested, maybe about 300ms delay later,  the choosed  checkbox's checked status can be get. I guess kendui  framework optimized it for touch screen to avoid wrong operation
BUT, My goal is to limit the  number of checkbox can be choosed,  for example ,   in this  code snippets,  four checkbox in group ,can be choose no more than 2 items, so in function listViewClick, I am trying to count the number that checked when user tap down every time,  So because of delay change of  checked status ,  My way can not work !  

 Q: how to get checked status right now when user tap down? or other suggestion for limit the number user can be choose?




 

When I am trying to edit or add in grid using Custom Dropdown Binding... in the code behind the viewmodel is not binding properly. It shows Id as Null and Name as Collection.
Could any one please solve this problem?
Thanks in Adv.
My View Model: My Editor Template
My Grid Binding
When I am trying to edit, the datasource in Json Format
and in the code behind(Web APi)when I trying to capture in the model it shows like this(Plz check the attachment)
 

Following the SDK example on a fully configured scheduler with 3 views (day, month, agenda) and bound remote data:


This seems to only destroy the "views"... but the Day|Month|Agenda buttons as well as the date picker and outer container remain.  I would expect the destroy() method to destroy everything properly.

Is there something I am missing?

Hi All,

I am getting this error.

Cannot read property '__count' of undefined

I have read up on this and the solution was to make sure that this statement is part of the model.

                    total: function (data) {
                        return data["odata.count"];
                    },

Fiddler returns the correct information 

  "odata.metadata":"<url>/%24metadata#categories","odata.count":"1","value":[
    {
      "SubCategories":[
        {
          "Id":1,"Name":"Skateboards","CategoryId":1,"Tracking":{
            "CreatedBy":"tester","CreatedOn":"2013-07-29T14:48:25.987","ModifiedBy":"tester","ModifiedOn":"2013-07-29T14:48:25.987","Timestamp":"AAAAAAAACAk="
          }
        }
      ],"Id":1,"Name":"Sports","Tracking":{
        "CreatedBy":"tester","CreatedOn":"2013-07-29T14:48:25.987","ModifiedBy":"tester","ModifiedOn":"2013-07-29T14:48:25.987","Timestamp":"AAAAAAAACAY="
      }
    }

Here is the data source configuration.  

new kendo.data.HierarchicalDataSource({
            type: "odata",
            transport: {
              read: {
                  url: resourceurl + "/categories",
                  data: {
                      $expand:"SubCategories"
                  },
                  dataType: "json"
              }  
            },
            schema: {
                model: {
                    id: "Id",
                    hasChildren: true,
                    children: "SubCategories",
                    data: function (data) {
                        if (data.value) {
                            return data.value;
                        }
                        delete data["odata.metadata"];
                        return [data];
                    },
                    total: function (data) {
                        return data["odata.count"];
                    },
                    errors: function (data) {
                    }                    
                }
            }
        });

Any ideas?

Regards

Richard...