Questions on Kendo UI for jQuery Forum

1 answer

368 views

TL;DR - I want to provide a custom field name but use the built-in validation messages.

I am trying to customize the validation messages displayed by the Kendo validator in a mobile application.

I've created a JsFiddle (http://jsfiddle.net/jeremy_wiebe/6nw8s/) to help show what's going on and the options for specifying validation options.

Don't provide anything, just let Kendo build the message using the input element's 'name' attribute. This is sub-optimal because the 'name' attribute doesn't allow spaces in it and 'customerNumber1 is required' doesn't look good.
Specify a 'title' on the input. This is a start but kendo uses _only_ the 'title' attribute value for all validation messages. This is again sub-optimal when the input may become invalid for multiple reasons (required, min/max values, incorrect format, etc). Try putting '-100' the second field to see what I mean.
Put a 'validationMessage' attribute on the input. As far as I can tell this is identical to doing #2. So it has the same shortcomings.
Add custom data-{rule}-msg attributes for each type of validation you might have on the attribute. This solves the problem at the cost of making more verbose HTML. Now I have to put a custom validation message on each HTML input form for each validation rule I have.

Looking at the Kendo source I see that there's an object that stores the built-in validation rule messages. These messages use the kendo formatting (see the _extractMessage function) to display a message and have placeholders for the field name as well as any other dynamic validation bits that may be applicable for the message.

So, what I'd like to be able to do is specify the 'title' attribute on the input (referring to my JSFiddle I'd use 'Customer #' from the second <input>) and have the kendo validator use that as the field name when it formats the built-in validation messages. In this way the second input would show 'Customer # is required' if the field is empty and 'Customer # should be greater than or equal to 1' if the value is -11.

Is there any way to accomplish this as the code is now?

Validation

answered on 09 Oct 2012

1 answer

313 views

Datepicker don't show the selected date

Hi everyone,

I'm quite new to KendoUI but what I have seen so far is really cool :)

Actually I'm trying to edit a date with a datepicker. When I initialize the datepicker a selected date won't be displayed and I don't know why.
Even if I call the basic datepicker by this:

$("#datum").kendoDatePicker({});

no selected date will be displayed althought dates can be selected.

My original code looks like this:

var value = "12.06.2012";

$("#datepicker").kendoDatePicker({

culture: "de-DE",

format: "dd.MM.yyyy",

value: value

});

When I open the datepicker the correct value (12.06.2012) is selected in the "dropdown", but nothing is show in the datepicker's input... :( Btw: No errors in the Firebug console

Any help is appreciated!

Thanks and cheers,
Chris

// Update: I'm using:
Kendo UI v2012.2.710
jQuery v1.7.1
Firefox 15.0.1
Iron (based on Chrome) 20.0.1150.1
Windows 7

DatePicker

answered on 09 Oct 2012

3 answers

928 views

Refresh the Entire Page after grid action 'destroy' completes.

Hi,
When I delete a row from my grid, I need to refresh the same page because other data on the page depends on items in the grid.
Is there someway I can do this?
Thanks,
Murph

Grid

answered on 09 Oct 2012

2 answers

220 views

Images in Kendo UI Editor: first image will not display in IE

Here's a puzzle... I am building an editor that contains some HTML, including some image tags. In IE the first image displays in the editor as a broken image, while any subsequent images display correctly. This behaviour is not exhibited in Chrome. I've modified the HTML in the editor any way I can to try to "fix" this but no matter what the first image is broken in IE.

Any help?

EDIT:
This effect only occurs when the first image is on the server. If the first image is off the server (e.g. I take a URL from any image on the internets) then it's all good.
Any idea why IE would choose to not display the first image if it's on the server?
FYI: it's not a permission issue (I think) since the account used to run .NET has access to the images, and no suspicious events are being logged that suggests the server is denying the first image.

Editor

answered on 09 Oct 2012

0 answers

117 views

validation tooltips appear behind DropDownLists

Please see attached screenshot from Internet Explorer 8. My validation tooltips appear behind DropDownLists. I'm no css guru so I would appreciate some help. As far as I can tell the tooltips have a higher z-index than the DropDownLists.

Validation

asked on 09 Oct 2012

0 answers

78 views

Complete web applciation

Do you have sample asp.net mvc web application with Kendo UI , not just individual control level example . I am expecting a business level application sample? like shopping cart

If you have one please send it to me I would like to see how i can join all controls

Regards
Gopi

DropDownList

asked on 09 Oct 2012

3 answers

314 views

Possible bug; Grid height: 'auto' not working Firefox with Kendo version 2012.1 322

Just updated to version 2012.1 322 and a grid has stopped sizing the height correctly in Firefox. It displays with only a height equivalent to one row, but it can still be scrolled. I've attached a screenshot, normally this should size to show 10 rows.

The grid in question has a detail template, but does not have an explicit template for the master rows. Here's my main setup script:

var dataSource = new kendo.data.DataSource({

data: gblProductsData,

schema:

{

model:

{

fields:

{

id: { type: 'string' },

referencecode: { type: 'string' },

description: { type: 'string' },

category: { type: 'string' },

unitofmeasureid: { type: 'string' },

buffergroupid: { type: 'string' },

defaultorderworkflowtypeid: { type: 'string' },

isarchivedproduct: { type: 'boolean' }

}

},

pageSize: 10

});

//Reset grid

$('#divProductGrid').html('');

//Setup grid

gblDivProductGrid = $('#divProductGrid').kendoGrid({

dataSource: dataSource,

autoBind: true,

height: 'auto',

scrollable: true,

filterable: true,

sortable: true,

groupable: false,

pageable: true,

toolbar: productGridToolbarTemplate,

detailTemplate: productGridDetailTemplate,

detailInit: InitialiseProductDetails,

detailExpand: ProductDetailExpand,

detailCollapse: ProductDetailCollapse,

columns:

[

{

field: 'referencecode',

title: 'Reference Code'

},

{

field: 'description',

title: 'Description'

},

{

field: 'category',

title: 'Category',

filterable: false

},

{

field: 'unitofmeasureid',

title: 'Unit Of Measure',

filterable: false

},

{

field: 'buffergroupid',

title: 'Buffer Group',

filterable: false

}

]

});

Changing 'scrollable' to 'false' fixes this problem, though of course the grid won't resize horizontally when the window resizes. It all still works fine in Chrome and IE.

Grid

answered on 09 Oct 2012

1 answer

120 views

Multiple Value Axes with Date CategoryAxis

I'm trying to have multiple value axes with CategoryAxis date type. See the following jsFiddle, and how the dates are not labeled on the x-axis: http://jsfiddle.net/gavinr/Q6ust/

Is this an issue with Kendo or am I doing something wrong?

Charts

answered on 09 Oct 2012

0 answers

133 views

How to remove the child node by its id

Hi,

I am using kendoui checkbox template treeview. When i am selecting the child node i am able to get the
id of that child. Then how can i get the id of that parent and how can i delete the selected child node with that id.

Please provide me an example or sample

Thanks and Regards
Srinivas

TreeView

asked on 09 Oct 2012

4 answers

326 views

Paging in Grid

Hi,

I am using kendo grid with paging.In my grid i have checkbox for selecting the grid row.
when i am using paging when I select a row in page 1 and after if go to page 3 and select a row and save the data to database.
The problem is when I select the page 3 row the page 1 row which is selected is not saved.
Even if I change the grid page to 1 the selected row is deselected automatically.
Is there any solution to solve the problem.

please help...

Regards,
Sam.

Grid

answered on 09 Oct 2012