Questions on Kendo UI for jQuery Forum

2 answers

356 views

Edit Grid: Using DropDownList shows "Undefined" as the DataTextField

I have had great success with your GRID widget but I am having one problem. I am unable to get the dropDownMenu to show the possible choices, “undefined” shows up for every choice. I looked through many threads on this topic but could not find a solution for me.

I have a workable project where you can see this problem.
I modeled this page after your demo: http://demos.kendoui.com/web/grid/editing-custom.html

Login to site "http://life-renewal-test.org" using ID=friend@gmail.com
Psw = friend!
Click "edit" near my Volunteer Offers to get to page manageVolunteerInfo.cshtml
Click on Type “Fund Raising” to get the dropdownMenu choices
All choices read “undefined”

The page data is sourced from: http://life-renewal-test.org/friend/volunteerGridRead.cshtml
The dropdown data is sourced from: http://life-renewal-test.org/friend/volunteerTypeRead.cshtml

Thank you

Grid

answered on 19 May 2013

4 answers

116 views

HTML 5 forms input focus behavior user experience issues

When editing form fields in my HTML 5 kendo mobile app the input focus behavior is strange in iOS webviews and Mobile Safari. Navigating with the iOS keyboard Previous and Next buttons works fine but in our user acceptance testing we found many users tap the subsequent fields they want to edit instead of using these buttons. When the keyboard is present because an input has focus and the user taps on another field, that field is correctly focused sometimes but more often the focus returns to the original field with some "scroll jumpiness", an arbitrary field that was not tapped gains focus, or the keyboard is hidden and no input has focus.

Our app is currently on kendo mobile v2013.1.319 but we found that all versions since 2012.2.719 has the same issue.

Steps to reproduce:

navigate to http://demos.kendoui.com/mobile/forms/index.html in Mobile Safari
tap the "Type text " field so that it gains focus and the software keyboard is shown
tap the password, search, url, email fields and go back and forth tapping among them and observe "scroll jumpiness" and random field focusing behavior.

This behavior occurs on simple, two-input login forms also:

navigate to http://m.socialofficesuite.com in Mobile Safari
tap to focus username or password and tap back and forth between fields repeatedly

Is this glitchiness with the kendo javascript framework or perhaps an issue particular to the element hierarchy form > ul > li > label > input focus behavior?

General Discussions

answered on 18 May 2013

1 answer

104 views

How to bind a date and enable filtering for a field where date is in a format like this > /Date(1368388119000)/

01.<div data-bind="kendoGrid: {

02. data: $root.Reports,

03. groupable: true,

04. scrollable: true,

05. filterable: true,

06. sortable: true,

07. pageable: {

08. pageSize: 10,

09. pageSizes: true

10. },

11. columns: [

12. { field: 'ReportNumber', title : 'Report Number'},

13.

{ field: 'CreateDate', type:'date', template: function(dataItem) { return '<span>' + ConvertDate(dataItem.CreateDate, 'MM/DD/YYYY') + '</

span>';}, title: 'Create Date'}

14. { command: { text: 'View', click: $root.ShowReport }, title:' ', width: 80}

15. ]

16. }">

17.</div>

01.function ConvertDate(value, format) {

02. var valueUnwrapped = ko.utils.unwrapObservable(value);

03. var pattern = format || 'mmmm d, yyyy';

04. if (valueUnwrapped == undefined || valueUnwrapped == null) {

05. return '';

06. } else {

07. var date = moment(valueUnwrapped);

08. var str = moment(date).format(pattern);

09. return str;

10. }

11. }

Hi,

I am using knockout-kendo.js

In the underlying data source for the grid the "CreateDate" is just a string like this: /Date(1368388119000)/
I have been able to display the date in the grid using the template as shown in the code above. But when I try to use the filter on the Create Date field it throws a javascript error : Uncaught TypeError: Object /Date(1368388119000)/ has no method 'getTime'

What is the proper way to bind the date in this format so that the filtering works with it?

Grid

answered on 18 May 2013

1 answer

239 views

Virtualization on grid does not fire requestStart and requestEnd events on DataSource

Hi,

When a user is scrolling through many items in a grid that we have set up to use virtualization, I need to know when the grid is going back and requesting data because I have a few searching, sorting and filtering controls around the grid that I would like to also be disabled also when the grid pulls down more data. Unfortunately, the requestStart and requestEnd events are not fired on the DataSource when this occurs.

Is there a possible workaround for this and/or could this be submitted as a bug please because I think it should fire these events when scrolling a virtualized grid.

Grid

answered on 18 May 2013

1 answer

362 views

Set value of another cell based on selected item from Combo box

I have a Grid defined as:

$("#FloorPlanGrid").kendoGrid({

dataSource: floorPlanSource,

toolbar: ['create'],

columns: [

{field: 'CompanyName', title: 'Company Name', editor: flooringDropDown},

{field: 'AccountNumber', title: 'Account Number'},

{field: 'CompanySubType', title: 'Sub Type'},

{field: 'Active', title: 'Active'},

{field: 'CreditAvailable', title: 'Credit Available'},

{field: 'DFINumber', title: 'DFI Number'},

{field: 'ClosedDate', title: 'Closed Date'},

{ command: ['edit', 'destroy'] }

],

editable: 'inline',

//edit: function (e) {

// debugger;

//}

});

With a custom editor for the company name defined as:

function flooringDropDown(container, options) {

$("<input required data-text-field='Text' data-value-field='Value' data-bind='value: " + options.field + "'/>")

.appendTo(container)

.kendoDropDownList({

autoBind: false,

dataSource: {

transport: {

read: window.PaymentOutsideOptionsUrl

}

},

select: function(e) {

var item = this.dataItem(e.item.index());

if (item) {

console.log(item.SubType);

debugger;

}

);

}

Where the debugger line is in the select event, I would like to set the value of the CompanySubType to item.SubType. I have verified that I can get the SubType, but I cannot for the life of me figure out how to set the value of the CompanySubType column. Could someone demonstrate how to set this value?

Jason

Grid

answered on 18 May 2013

5 answers

192 views

Add series dynamically to the navigator

Hi,

How do I access the properties of the stock chart's navigator? I can access the chart's options like so:

var chart = $("#stock-chart").data("kendoStockChart");
var chartOptions = chart.options;

but I am not having any luck with the navigator. I would like to add series and access other properties programmatically.

Thanks,
Tonih

Charts

answered on 18 May 2013

1 answer

2.4K+ views

Validation error messages in grid

I'm evaluating the Kendo UI grid for possible use in a rails applications. Is there any way to customize the validation error messages for a column?

The validation seems to be working, but I still get the standard error messages:

schema: {
model: {
id: "id",
fields: {
name: { editable: true, validation: {required: true, message: "Brand name is required."}},
brand_code: {
editable: true,
validation: {pattern: "^[A-Z]{4}$", message: "Brand Code must be 4 upper case characters."}
},
brand_type: {editable: true, validation: { required: true }}
}
},
errors: "error"
}

Grid

answered on 18 May 2013

1 answer

357 views

Grid Column Template Checkbox only allow check on edit inline?

I have a Kendo Grid with Inline Editing and the following for example:

.Editable(editable => editable.Mode(GridEditMode.InLine))

columns.Template(@<text></text>).ClientTemplate("<input type='checkbox' #= ActionAssign ? checked='checked':'' # class='chkbx5' />").Title("Assign").Width(100);

How can I only show the template checkbox only when in edit mode but when now like True/False etc. as a label or something. If that is too difficult then just disabling the checkbox. I am having a hard time finding some basic functionality type examples online.

Thanks
Sean

Grid