input#autocomplete

var tagTab=["oranges"];

$("#autocomplete").kendoAutoComplete({
    dataSource: tagTab, 
    dataBound: function(e) {
         var dataSource = new kendo.data.DataSource({
                 data: [ "bananas", "cherries" ]
         });
         var autocomplete = $("#autocomplete").data("kendoAutoComplete");
         autocomplete.setDataSource(dataSource);
   }
});

This is my code, in fact as you can see here when the user start to write something, the tags will change from "oranges" to "bananas" and "cherries".
Actually it's a simple exemple, the goal will be to change the tags in function of the imput text...

Anyway, when you start to write "ba",  the autoComplete opens correctly, the tag is"bananas" like expected...

My problem is:  When I select the tag (with arrow keys or mouse)  then I press enter (or click), just nothing append in the imput text field, the autoComplete just close.

If someone could help me please, would be awesome ! 

hello,
I need to design an Building chart . I fetch data from service and that save in native database. now I design to  tree view structure . such as below
ProjectName
       BuildingA
               Wing 1
                    Floor 1
                          Activity1
                                Item1
                                Item2
                         Activity2
                    Floor2
                           Activity1
                                Item1
                                Item2
                         Activity2
                Wing 2
                Wing 3
         Building2
         Building3
 

Figured out how to use it. Question is void.

I have data for 11 month, date 02/26/2012, 03/25/2012,
04/26/2012….. 12/30/2012.

I want to show those dates on Axis labels.  

.CategoryAxis(axis => axis

                                  

                                   
.Categories(e=>e.Date)

                                    .Date()

                                    .BaseUnit(ChartAxisBaseUnit.Months)

                                   
.Labels(labels => labels

                                                         
.Rotation(-80)

                                                 
        .Format("MM/dd/yyyy")

                                    )

This code will show first date of the month. 02/01/2012,
03/01/2012 and so on. It doesn’t show the accrual date . If I remove Date and
baseUnit it will show each week. Can you tell me how to accomplish this.

 

Thanks

 

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.