Questions on Kendo UI for jQuery Forum

5 answers

781 views

Hi,
I'm trying to load a dataSource date field with a Javascript date value like 1366408800000. The grid will not display the value - do I need to strip off the time aspect?
If i change the field to dateTime type it simply displays the full number + when editing it treats it like a number - with no date picker - I'd like it to treat it like a date, with correct formating.
Regards,
Jack

Grid

answered on 24 Apr 2013

1 answer

348 views

ListView Selection Validation

Hi,

Is it possible to validate the selection (not editing) of a ListView? In other words to use the validator to verify that an item is selected in the listview when the selection mode is set to 'Single'?

This seems like it would be a fairly straightforward thing to require, but I've tried just adding the 'required' attribute to the div, but it doesn't seem to make any difference....

Thanks in advance,

J.

Validation

answered on 24 Apr 2013

1 answer

243 views

Kendo ui grid inline editing in tab with Datepicker not select a date value

Hi Guys,

I having an issue where kendo ui inline grid inside tab does not select any value. The Razor page that i have created is not inheriting _layout.cshtml. Would be this an issue since the inline grid date picker selected value when not implementing inside tab. Please advise, thank you.

@(Html.Kendo().Grid<HH.PrductModel>()

.Name("Product")
.HtmlAttributes(new { @Style = "align:center; font-size:10px; width:950px" })
.Columns(columns =>
{

columns.Bound(p => p.ProductId).Width(95);
columns.Bound(p => p.Name).Width(120);
columns.Bound(p => p.Description).Width(150);
columns.Bound(p => p.ExpiryDate).EditorTemplateName("Date").Format("{0:dd/MM/yyyy}").Width(115);

columns.Command(commands => commands.Edit()).Width(100);

})

.ToolBar(toolbar => toolbar.Create())
.Sortable()
//.Pageable()
.Pageable(paging => paging
.Input(false)
.Numeric(true)

.PreviousNext(true)
.PageSizes(new int[] { 5, 10, 25, 50 })
.Refresh(false)

)
.Selectable()
.Scrollable()
.ColumnMenu(c => c.Columns(false))
.DataSource(dataSource => dataSource

.Ajax()//bind with Ajax instead server bind
.PageSize(10)
.ServerOperation(true)
.Model(model =>
{
model.Id(p => p.ProductId);

})
.Sort(sort => sort
.Add(x => x.Name).Descending())

.Read(read => read.Action("GetProductData", "ProductDetails").Type(HttpVerbs.Get))
.Create("CreateProductList", "ProductDetails")
.Update("EditProductList", "ProductDetails")

)

)

Please advise, thank you

Grid

answered on 24 Apr 2013

3 answers

302 views

Debug Version of Kendo.all script?

Hello,

Is there a debug version of the kendo.all script? I keep getting errors, and while it's been with my code, it would be much easier to figure out if I had a debug version? If so, where can I download? Don't see it in asp.net mvc or mobile downloads, didn't try others.

Thanks.

General Discussions

answered on 24 Apr 2013

1 answer

143 views

Kendo Grid Column bound Dropdown Row wise binding

I am facing one issue in implementing kendo grid. We are using MVC4 with
LINQ and Entity framework with SQL 2008 R2 as backend database.

We are using kendo grid in one of the screens. The grid has a dropdown
which has to be dynamically bind for each record on the basis of a LINQ
condition. The output of the query can be different for each record.

Earlier we were binding dropdowns for all records using Viewdata[] but
now we are unable to implement the above requirement. Please help us on
the same.

Attached are the code samples.

Grid

answered on 24 Apr 2013

1 answer

193 views

Add new item is not sending updated model

Hi Kendo Team,

I've a grid that have one ajax call to get the description and display in the grid and also there are two auto increment columns. The problem I'm having with it is when I'm adding a new record, the model is not updated when sending to the controller. This is my view page.

<script type="text/javascript">

function onWorkshopJobRequirementListRequestEnd(e) {

if (e.type == "create" || e.type == "update") {

e.sender.read();

}

function onWorkshopJobRequirementListError(e) {

if (e.errors) {

var message = "Errors:\n";

$.each(e.errors, function (key, value) {

if (value.errors) {

message += value.errors.join("\n");

}

});

alert(message);

}

function JobRequirementList_Edit(e) {

e.sender.showColumn("REQUIREMENT_DESCRIPTION_CUSTOM");

e.container.find("input[name=SEQUENCE]").css('width', '80px');

if (e.model.isNew()) {

debugger

e.container.find("input[name=SEQUENCE]").val(++currentSequence);

e.container.find("input[name=LINE_NUMBER]").val(++currentLineNo);

}

e.container.find(".k-grid-cancel").bind("click", function () {

e.sender.hideColumn("REQUIREMENT_DESCRIPTION_CUSTOM");

})

}

function JobRequirementList_Databound(e) {

e.sender.hideColumn("REQUIREMENT_DESCRIPTION_CUSTOM");

}

function Requirement_change(e) {

$.ajax({

url: "@Url.Action("GetRequirementDescription", "Shared")",

data: {requirementId: e.sender.value()},

datatype: "json",

type: "POST",

success: function(myData){

$("#REQUIREMENT_DESCRIPTION_CUSTOM").attr('value', myData);

}

});

}

</script>

@(Html.Kendo().Grid<WorkshopJobRequirement>()

.Name("WorkshopJobRequirementList_" + ViewData["WorkshopJobId"])

.Sortable()

.Pageable(paging =>

{

//paging.Messages(message => message.Display("Total standard hours: " + ViewData["TotalTime"].ToString()));

paging.Enabled(true);

paging.Info(true);

paging.PageSizes(true);

paging.Numeric(true);

paging.PreviousNext(true);

paging.Refresh(true);

paging.PageSizes(new int[5] { 5, 10, 15, 20, 25 });

})

.DataSource(dataSource => dataSource

.Ajax()

.PageSize(15)

.Model(model =>

{

model.Id(p => p.REQUIREMENT_TRANS_ID);

model.Field(p => p.WORKSHOP_TRANSACTION_ID).DefaultValue((int)ViewData["WorkshopJobId"]);

model.Field(p => p.LINE_NUMBER).Editable(false).DefaultValue((short)ViewData["MaxLineNo"]);

model.Field(p => p.SEQUENCE).DefaultValue((short)ViewData["MaxSequence"]);

model.Field(p => p.STANDARD_HOURS).Editable(false);

})

.Events(events =>

{

events.RequestEnd("onWorkshopJobRequirementListRequestEnd");

events.Error("onWorkshopJobRequirementListError");

})

.Read(read => read.Action("_WorkshopJobRequirementList", "RepairAndMaintenanceJobRequirementList", new { workshopJobId = ViewData["WorkshopJobId"] }))

.Update(update => update.Action("_WorkshopJobRequirementEdit", "RepairAndMaintenanceJobRequirementList"))

.Create(create => create.Action("_WorkshopJobRequirementCreate", "RepairAndMaintenanceJobRequirementList"))

)

.Selectable(selectable => selectable.Mode(GridSelectionMode.Single))

.ToolBar(toolbar => toolbar.Create())

.Reorderable(reorder => reorder.Columns(true))

.Filterable()

.Columns(columns =>

{

columns.Bound(p => p.LINE_NUMBER).Title("Line no").Width("80px");

columns.Bound(p => p.SEQUENCE).Title("Sequence").Width("80px");

if (Model.DISPLAY_MM_HOURS_REQUIREMENTS)

{

columns.Bound(p => p.STANDARD_HOURS).Title("Std hours").Width("80px");

//.FooterTemplate("Total standard hours: " + ViewData["TotalTime"].ToString());

}

columns.Bound(p => p.REQUIREMENT_ID).Title("Requirement").EditorTemplateName("_Requirement")

.ClientTemplate("#=REQUIREMENT_DESCRIPTION_CUSTOM#");

columns.Bound(p => p.REQUIREMENT_DESCRIPTION_CUSTOM).Title("Description");

columns.Bound(p => p.PRINT_FLAG).Title("Print")

.Width("80px").HtmlAttributes(new { @style = "text-align:center" })

.ClientTemplate("<input type='checkbox' disabled='disabled' name='suppressed' #=PRINT_FLAG?checked='checked':''# />");

columns.Bound(p => p.COMPLETE).Title("Complete")

.Width("80px").HtmlAttributes(new { @style = "text-align:center" })

.ClientTemplate("<input type='checkbox' disabled='disabled' name='suppressed' #=COMPLETE?checked='checked':''# />");

columns.Command(command =>

{

command.Edit();

}).Width(200).Title("Commands").HeaderHtmlAttributes(new { @style = "text-align:center" });

})

.Events(events => events.Edit("JobRequirementList_Edit").DataBound("JobRequirementList_Databound"))

)

<script type="text/javascript">

var currentSequence;

var currentLineNo;

$(function () {

$('#WorkshopJobRequirementList_@ViewData["WorkshopJobId"]').data("kendoGrid").one("dataBound", function (e) {

currentSequence = e.sender.dataSource.options.schema.model.fields.SEQUENCE.defaultValue;

currentLineNo = e.sender.dataSource.options.schema.model.fields.LINE_NUMBER.defaultValue;

})

</script>

If you see my attached screenshot, you will be able to see the discrepancies.

Please let me know, how can I fix this.

Thank you

Grid

answered on 24 Apr 2013

4 answers

144 views

Migrating from Telerik to Kendo - change event

I am migrating from Telerik NumericTextBox to Kendo and have a question about the change event.

The page has multiple NumericTextBoxes in the grid rows so the change event needs the ID of the control to know which grid row is being changed.

The commented lines were from the Telerik version

function SpinnerQtyChange(e) {
    var target = this.element[0];
    var id = target.id.replace("QtySpinner_", "");
    var quantityJ = $(target).closest("td"); // Up to my <td> (Quantity)
    QtyChange(id, quantityJ, this.value(), e.oldValue);

    //var id = e.target.id.replace("QtySpinner_", "");
    //var quantityJ = $(e.target).parent().parent(); // Up to my <td> (Quantity)
    //QtyChange(id, quantityJ, e.newValue, e.oldValue);
}

The problem is the e.oldValue - where can I find it?

Thanks,
Gary Davis

NumericTextBox

answered on 23 Apr 2013

1 answer

109 views

ComboBox does not work with IE8

We are using the ComboBox and it works fine on IE7/IE9 and other browsers, however it does not let us to click the drop down with IE8, type in is OK.

We are using "Kendo UI Web v2012.2.913" and "jQuery-1.8.2".

Any suggestion?

Thanks a lot,
-T

ComboBox

answered on 23 Apr 2013

1 answer

2.1K+ views

Pass parameter to Kendo Window with content of ParitialView

Hello:

I'd like to pass parameter of Kendo Window when a div clicked, the passed parameter will be the value of this Div, the Kendo Window renders from a partial view.

Razor view:

<div id="div1" onclick="divClicked" >50744</div>

@{Html.Kendo().Window()

.Name("win1")

.Visible(false)

.Modal(true)

.Height(400)

.Content(@<text>

@{Html.RenderAction("GetStandard", "Standard", new { eID=???});}

</text>).Render();

}

<script>

$(document).ready(function () {

$("#div1").on("click", divClicked);

});

</script>

<script type="text/javascript">

function divClicked() {

var eID = $(this).text();

$("#win1").data("kendoWindow").center().open();

}

</script>

When the DIV is clicked, the value is saved to eID, then I need to pass this eID to PartialView, like
.../Standard/GetStandard?eID=50744

Please advise,

Thank you,

Window

answered on 23 Apr 2013

2 answers

86 views

Kendo UI Menu custom theme IE 8 glitch

I've modified the Bootstrap theme, essentially just changing some background-colors, gradients, colors, border colors etc. But for some reason, when I use my custom theme on the Kendo UI Web Menu demo, there is a glitch when mousing over items in IE 8. (The original Kendo UI theme and Bootstrap theme work as expected.)

I've been searching through my custom CSS and can't find the issue. I've done a file diff on the CSS themes, inspected elements in Chrome Developer tools, IE 8 Developer tools, and cannot still cannot find the problem.

I have posted a question in StackOverflow:
http://stackoverflow.com/questions/16113226/kendo-ui-menu-custom-theme-ie-8-glitch
StackOverflow question

The StackOverflow question goes into similar detail, with links to these jsBins to test out in IE 8:
jsBin (custom theme - IE 8 glitch)
jsBin (original Bootstrap)

If anyone could help me with this custom theme CSS glitch in IE 8 that would be most helpful.

Thanks!

Menu

answered on 23 Apr 2013