Questions on Kendo UI for jQuery Forum

1 answer

181 views

I'm wondering if I can use more than just html elements in the text area that is created by the dataTextField. I'd like to add html classes but I'm having trouble getting it to work.

Example:

dataTextField: "text",
dataImageUrlField: "imageUrl",
dataContentField: "content",
dataSource: [
{
text: "Bid Details",
imageUrl: "img/bid_details_icon.png",
content: "<table class="hello_world"><tr><td>Hello World</td></tr></table>"
},

The set of quotes for the class name breaks the string.

Thanks
-Brandon

TabStrip

answered on 24 Apr 2013

3 answers

813 views

[Solved] set focus on autocomplete from select event in another autocomplete doesn't work

Hi!
I'm trying to create a simple form using two autocompletes (column1 and column2). I want the form to be fluent, so after the first autocomplete is selected I tried to set the focus on the next one. (using the select event in the first autocomplete)

I tried:

$("#column2").focus(); and $("#column2").data("kendoAutoComplete")focus();
but it didnt't work.

I set up a sample in js fiddler

How can I achieve the desired behavior?

Thanks!

AutoComplete

answered on 24 Apr 2013

5 answers

831 views

Problem with date parsing

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

376 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

284 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

345 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

169 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

237 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

163 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

123 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