Hi All,

I am using ASP.NET MVC 4 and Telerik's KendoUI grid control with in grid editing (GridEditMode.InCell). I am able to see data in the grid and edit data, but the problem is that when I click cell for editing I am not getting Kendo UI controls (DatePicker, ...). Controls that I am getting for editing are plain without any styles. When I add any Kendo control on the page I am getting right control, such as DatePicker control. So style and controls' js are there. The only problem is I am not getting Kendo control inside of the grid.

Index.cshtml

_Layout.cshtml


I also posted the same question on Stack Overflow KendoUI grid InCell editing style issue with images, so you can see what I am talking about.
 
Thanks in advance.

Sincerely,
Vlad.

My navbar truncates on when I select a form field.  The navbar is cut almost in half and the back button is hard to reach.  Only a full page refresh restores the natural size.


You can reproduce the problem with the following link on an iphone device:
http://www.veterinaryclipboard.com/#dosagecalcview?isfeline=true

I'm using a ScrollView as a carousel to house some questions and need to disable swipe events for it (I'm using "next" and "previous" buttons to control it). The problem I'm coming across is that I have a jQuery-UI slider inside the ScrollView, but when I try to change the slider value, it starts to move the ScrollView to the next "page".

I was hoping there was a native way to disable "swipe to move", but it doesn't appear that there is.

I've played around with catching the events on the ScrollView pages, but haven't been able to get something that works on an actual device:

Any ideas or help would be appreciated.

Hi:

I am trying to convert the Knockout tutorial #2 to Kendo MVVM.  Learn knockout Tutorial Collections
Not doing well.

Problem is the binding is not happening and the dropdown loses it's dropdownlist on add or remove. 

Note: Kendo does not seem to have the calculated (logical) binding like Knockout does for visible and enabled.

Phil

I'm trying to make a pie out of this JSON data:
Here's my function:

Interestingly though, the pie only occupies 1/4 of a circle. I've been playing around with the numbers to try and grow and shrink them, but I just can't seem to make the thing occupy more than 1/4 of a pie.

I've attached a screenshot.

Could someone please let me know what I'm doing wrong?

Hi, I am trying to set the Header title for a field a parameter value.

eg. something like the below (I would like the value in bold FIRST_HEADER to be for example x.FIRST_HEADER derived from the model and not a static string.

Thanks in advance
Manos


@(Html.Telerik().Grid<CheckoutConfirmDeliveryModel>()
                            .Name("gvDelivery")
                            .ClientEvents(events => events                        
                            .OnDataBinding("onDataBinding"))
                            //.OnDataBound("onDataBound"))
                            //.OnComplete("onComplete"))
                        .Columns(columns =>
                        {                           
                            columns.Bound(x => x.FIRST_ID).Hidden(false);
                                                   
                            columns.Template(x => Html.ActionLink(x.FIRST, "FIRSTACTION", "CheckoutController", new { x.TIME_ID })).Title(FIRST_HEADER).ClientTemplate("<a href=\"" + Url.Action("SelectDeliveryDateTime", "CheckoutController") + "/<#= FIRST#>\">" + "<#= FIRST #>" + "</a>");                          
                        })
                                .DataBinding(dataBinding => dataBinding.Ajax().Select("DeliveryList", "Checkout", Model))
                                .EnableCustomBinding(true))

Hi,

I'm modifying Row Template sample to put three grids horizontally.  My questions are:

1. How can I set the height of the grid to the height of my browser?  I tried to change the grid height to 100% but it does not work.
                           rowTemplate: kendo.template($("#rowTemplate").html()),
                           height: 100%
2. In my case, three grids cannot fit in my screen a scroll bar showing at the bottom as expected. When I testing my modified version on my iphone and swiping the grid's body, I expect the content will move but it does not.  If I swiping the grid's header the content moved.  Just wonder how can I move the content when swiping the grid's body.

Thank you very much for your time.
puyo

I implemented the Drag and Drop from a treeNode to an external DIV in this way:
                  /////////////////////////////////////////////////////////////
                  // DRAG A NODE
                  function onDragStart(e) {                   
                  }
                  function onDrag(e) {
                      if (e.dropTarget.id == "dropDiv") {
                          e.setStatusClass("k-add");
                      }
                      else {
                          e.setStatusClass("k-denied");
                      }
                  }
                  function onDrop(e) {
                     // var d = this.dataItem(e.sourceNode);                                                               
                  }
                  function onDragStart(e) {
                  }
                  function onDragEnd(e) {                     
                  }
                  /////////////////////////////////////////////////////////////////
                  //TREE SOURCE DEFINITION
                  treeSource = new kendo.data.HierarchicalDataSource({
                      transport: { read: { url: serviceRoot + "Plant", dataType: "json" }},
                      schema: { model: { id: "idPlant" }   }
                  });
                  /////////////////////////////////////////////////////////////////
                  $("#treePlants").kendoTreeView({
                      dataSource: treeSource,
                      dataTextField: "PlantAlias",
                      dragAndDrop: true,
                     
                      dragstart: onDragStart,
                      drag: onDrag,
                      drop: onDrop,
                      dragend: onDragEnd
                  });

It seems running but when the Node is dragged on the DIV area the "k-add" icon remain attached to cursor... no way to remove it clicking or not the mouse buttons.
Looking at javascript console in Chrome the error: Uncaught TypeError: Cannot read property 'dataSource' of undefined
is shown in kendo.ui.min.js.
How to fix this?


How to proceed.

I am trying to start with an initial list of items and display them using the mobile listview. This works fine, however if I add to the list and re-display the items, then the click event can no longer find the data property and throws an error. Here is the code, any help or suggestions on how to do this is appreciated.

var aptdata = [
            { 'apt': 'ATL', 'name': 'Atlanta' },
            { 'apt': 'JFK', 'name': 'John F Kennedy' },
            { 'apt': 'LGA', 'name': 'La Guardia' }
];

function alistbind() {
    var ldata = localStorage.aptdata;
    if (ldata == null) {
        localStorage.aptdata = JSON.stringify(aptdata);
    }
    $("#alist").kendoMobileListView({
        autoBind: false,
        dataSource: JSON.parse(localStorage.aptdata),
        style: 'inset',
        template: "<a>${apt} - ${name}</a>",
        click: function (e) {
            console.log('fun clicked: ' + e.dataItem.apt);
            showdetail(e.dataItem.apt);
            app.navigate("#aptdetail");
        }
    });
    $("#alist").data("kendoMobileListView").dataSource.read();
}

function AddAirport() {
    var ldata = JSON.parse(localStorage.aptdata)
    var newapt = { 'apt': 'FLL', 'name': 'Ft Lauderdale' };
    ldata.push(newapt);
    localStorage.aptdata = JSON.stringify(ldata);
    alistbind();
}