I want to declaratively add a datetimepicker.

This is how I add one now:


This is how I want to add one:

However, no picker is initialized.

Shouldn't there be at least one example on how to do this on api reference pages?

I am having issues with the kendo menu not rendering properly in IE.  When the menu opens, I can see the border of the menu, and transparent contents.  If I hover over the transparent area, then the items in that container render.


Also - using a kendo menu within a kendo window in IE - the menu border again renders with transparent content.  However, when moving the mouse cursor over the content area, the items DO NOT render properly.


In both of these cases, the menu renders correctly in Chrome.


Any ideas or known workarounds?

My first problem is:
Sometime the window.innerHeight is just 548px and not 568px (iPhone 5 with statusbar plugin)
this leads to a padding/margin on the bottom of 20px.

my app start code looks this:

normally on device it work but out of 10, 2,5 times it doesn't work.


my Second problem is: 
I have a tabstrip with 3 buttons, all works except the last one.
When I click it, it does not get the km-active-state class. instead the view before got the km-active-state class.
when i click the 2nd time on the last view it will select(activate) it.

i thought i found the bug/problem, i did a rollback till it worked. and then i change bit for bit till it did not work.
The culprit was Datasource I used one datasource a 2nd time in my app. (on view init i did var ds = new kendo.ui.DataSourceGift;)

So i change everything too init all Datasource at app start.

but now its starts again when i reload the app (location.reload();) [is for multilingual purpose]
its 50% that it works/not working.

Do you guys have an idea what the problem is?

its hard to post code because im using requirejs

I share it, it might be helpful for some

After updating to 2012.2.913, our updatable grids stopped being able to save records to the data source.  ModelState.IsValid was returning false for "Id", saying "The Id field is required".  The Id field is a Guid which is auto-populated by our NHibernate data model after a record is added, so we found this puzzling.

Our simplest grids were like this:

@(Html.Kendo().Grid<VMMudType>()
      .Name("vMudTypeGrid")
      .DataSource(datasource => datasource
                                    .Ajax()
                                    .Model(model => model.Id(m => m.Id))
                                    .Create(r => r.Action("Insert", "MudTypeGrid"))
                                    .Read(r => r.Action("Select", "MudTypeGrid"))
                                    .Update(r => r.Action("Update", "MudTypeGrid"))
                                    .Destroy(r => r.Action("Delete", "MudTypeGrid"))
      )
      .Columns(columns =>
      {
          columns.Bound(a => a.Name);
          columns.Command(command =>
          {
              command.Edit();
              command.Destroy();
          });
      })
      .Editable(ed => ed.Mode(GridEditMode.InLine))
      .Sortable()
      .Filterable()
      .ToolBar(commands => commands.Create())
      )

Data model had only the two fields, "Id", which was a Guid, and "Name", which was a string.

Looking at the actual save requests for the pre-upgrade grid versus the upgraded version in Fiddler, I saw the following difference in the POST results: The old version sent "sort=&group=&filter=&Id=00000000-0000-0000-0000-000000000000&Name=Water-Based", while the new version sent "sort=&group=&filter=&Id=&Name=Water-Based".  The generated Javascript for the grid also showed this difference: model:{id:"Id",fields:{Name:{type:"string"},Id:{type:"object",defaultValue:"00000000-0000-0000-0000-000000000000"}}} for the older version, vs. "model":{"id":"Id","fields":{"Name":{"type":"string"},"Id":{"type":"string"}}} for the new version.

The change that broke things seems to have been in TypeExtensions.cs, where ToJavaScriptType(this type) had a new clause for Guids:

if (type.GetNonNullableType() == typeof(Guid))
{
    return "String";
}

There are workarounds for this.  I changed our Insert grid controller to specifically not bind on Id:

public virtual ActionResult Insert([DataSourceRequest] DataSourceRequest request, [Bind(Exclude = "Id")] TViewModel vm)

It was also possible to work around this by changing ".Model(model => model.Id(m => m.Id))" to
                                    .Model(model =>
                                    {
                                        model.Id(m => m.Id);
                                        model.Field(m => m.Id).DefaultValue(Guid.Empty);
                                    })

But the former will work better with our framework, because we can put it into our grid controller parent class.

I could also have made the change to TypeExtensions to take out the Guid clause, but without knowing more about the rationale for the change, I didn't think I should.  What was the reason for having Javascript treat Guids like strings, and would there be a way to do this which didn't break things when adding new records with Guids that are auto-populated by the data model?

Aaron Humphrey
Pleasant Solutions

Hi.

I'm trying to use the Splitter in a div contained within a TabStrip.

I'm guessing it's because the div is not visible at the point when I call

$('#x-splitter ').kendoSplitter();

but when the splitter is eventually displayed (i.e. when the tab is selected) the first pane is 0-width. As soon as the window is resized it jumps to the correct size.

Is there any way I can tell the splitter to refresh when it's first displayed?

Any help much appreciated!

Mark

Here is my configuration in the View using html helpers and I have attached a picture of how it looks like:

@(Html.Kendo().Grid<Merchant_List_Updater_MVC.Controllers.AreaObject>()
               .Name("Grid")
               .Columns(columns =>
               {
                            columns.Bound(x => x.name).Title("Region Name");
                            columns.Bound(p => p.locationList).Title("Locations Included");
                            //Once clicked it searches and invokes a function in the script named "EditButtonClicked".
                            columns.Command(command => command.Custom("Modify")
                                                              .Click("ModifyButtonClicked"))
                                                                                          .HeaderHtmlAttributes(new {style = "width:80px;"})
                                                                                          .Width("105px");
                            //Once clicked it searches and invokes a function in the script named "DeleteButtonClicked".
                            columns.Command(command => command.Custom("Remove")
                                                              .Click("DeleteButtonClicked"))
                                                                                          .HeaderHtmlAttributes(new {style = "width:80px;"})
                                                                                          .Width("105px");
               })
               .Pageable(pageable => pageable.PreviousNext(true).ButtonCount(5))
               .Sortable(sortable => sortable.Enabled(true))
               .Scrollable(scr => scr.Height("auto"))
               .DataSource(dataSource => dataSource
                                         .Ajax()
                                         .Read(read => read.Action("AreaJsonDataSourceOrder", "ModifyOptions"))
                                         .PageSize(15))
               .Resizable(resize => resize.Columns(true))
               .Reorderable(reorder => reorder.Columns(true))
               .Selectable(selectable => selectable.Mode(GridSelectionMode.Single))        
      )

I tried to iterate through the list and display all elements in the list into a cell in a column but I've having trouble getting it to work.
Here is what I have so far.

In Grid definition:
columns.Bound(x => x.locationList).Title("Locations Included").ClientTemplate("#= iterate(x.locationList) #");

where x.locationList is a List<string> in the object passed in.

In <script>:
function iterate(object) {
var html = "<ul>";

for (var x = 0; x < object.length; x++) {
html += "<li>";
html += object[x];
html += "</li>";
}

html += "</ul>";
return html;
}

However, this causes all the records to disappear. What is the correct syntax to do this?

I tested out JSON initialization from DataSource inline, which worked for me.
But now I am preparing to do this from a remote source, so I made a static copy of  the JSON and put it in a file.

(NOTE: what this is creating is a PanelBar which when opened allows one to check off different file types. When the user presses SEARCH button, I will find out which file types have been checked off. If you know a better way to do this, tell me).

I would create a JSFiddle, but I don't know how to simulate reading a JSFIDDLE JSON file.

This is not working for me:


And here is the menu.JSON file:



When I put everything in-line this works fine:

Hello,

I have an issue with a line chart with 310px width which hide a part of last label (http://jsbin.com/zuqiz/9/edit):

var stats=[        
          {'date':"2013-12-01",'value':1},
          {'date':"2013-12-02",'value':12},
          {'date':"2013-12-03",'value':13},
          {'date':"2013-12-04",'value':14},
          {'date':"2013-12-05",'value':14},
          {'date':"2013-12-06",'value':14},
          {'date':"2013-12-07",'value':14},
          {'date':"2013-12-08",'value':14},
          {'date':"2013-12-09",'value':14},
          {'date':"2013-12-10",'value':14},
          {'date':"2013-12-11",'value':14},
          {'date':"2013-12-12",'value':14},
          {'date':"2013-12-13",'value':14},
          {'date':"2013-12-14",'value':14},
          {'date':"2013-12-15",'value':14},
          {'date':"2013-12-16",'value':14},
          {'date':"2013-12-17",'value':14},
          {'date':"2013-12-18",'value':14},
          {'date':"2013-12-19",'value':14},
          {'date':"2013-12-20",'value':14},
          {'date':"2013-12-21",'value':14},
          {'date':"2013-12-22",'value':14},
          {'date':"2013-12-23",'value':14},
          {'date':"2013-12-24",'value':14},
          {'date':"2013-12-25",'value':14},
          {'date':"2013-12-26",'value':14},
          {'date':"2013-12-27",'value':14},
          {'date':"2013-12-28",'value':14},
          {'date':"2013-12-29",'value':14},
          {'date':"2013-12-30",'value':14},
          {'date':"2013-12-31",'value':14}
    
            ];
 

function createChart() {
$("#chart").kendoChart({
    title: {
        text: "test"
    },
   dataSource: {
          data: stats
                        },
    series: [{
        type: "line",
         field: "value"
                  
    }],
    categoryAxis: {
        field: "date",
        type: "Date",
        labels: {format: "M/d",step:6}
    }

    }
);

$(document).ready(createChart);


Same issue with step:10.