Questions on Kendo UI for jQuery Forum

1 answer

98 views

Double click hit mark up under ActionSheet - Android

Hi!

We use the ActionSheet widget in a lot of views. The problem we have is that when a user clicks on a link in the ActionSheet (cancel for example), the click also goes through it and hits a list item under the ActionSheet - this results in two clicks and messes up the user experience.

This problem is particulary apparent on Android.

Any way to solve it?

ActionSheet

answered on 09 May 2013

3 answers

365 views

Changing the row template after grid creation

Hi,

Is there any way to change the row template after the grid has been created on the page? We want to provide different views of the grid (like small icons, large icons, etc) but we also need to be able to revert back to the standard template (i.e. no overriding template/Kendo creates the template).

Any ideas how we can do this please?

Grid

answered on 09 May 2013

2 answers

268 views

Specifying the fields to send on an 'update' command

Hi,
I am using the Data Source object to connect to a SharePoint 2013 ODATA source using REST and then use this as the data for a Kendo UI Grid.
The Data Source reads the list correctly and populates the grid, but when I update an item in the Kendo UI Grid the following error is returned by the REST end point.

The property '__deferred' does not exist on type 'SP.SecurableObject'. Make sure to only use property names that are defined by the type.

This is caused by the Data Source returning all the properties from the initial read request and then returning in the update command. SharePoint returns __deferred properties with a REST url to defer loading, but is throwing a wobbly if they are returned back in an update command.
Below is my Data Source

01.var dataSource = new kendo.data.DataSource({

02. type: "odata",

03. transport: {

04. read: {

05. url: listUrl,

06. type: "GET",

07. dataType: "json",

08. contentType: "application/json;odata=verbose",

09. headers: {

10. "accept": "application/json;odata=verbose"

11. }

12. },

13. create: {

14. url: listUrl,

15. type: "POST",

16. dataType: "json",

17. contentType: "application/json;odata=verbose",

18. headers: {

19. "accept": "application/json;odata=verbose",

20. "X-RequestDigest": $("#__REQUESTDIGEST").val(),

21. }

22. },

23. update: {

24. url: function (data) {

25. return listUrl + "(" + data.ID + ")";

26. },

27. beforeSend: function (jqXhr, options) {

28.

29. var data = JSON.parse(options.data);

30.

31. jqXhr.setRequestHeader("If-Match", data.__metadata.etag);

32.

33. },

34. type: "POST",

35. dataType: "json",

36. contentType: "application/json;odata=verbose",

37. headers: {

38. "accept": "application/json;odata=verbose",

39. "X-RequestDigest": $("#__REQUESTDIGEST").val(),

40. "X-HTTP-Method": "MERGE"

41. },

42. },

43. destroy: {

44. url: function (data) {

45. return listUrl + "(" + data.ID + ")";

46. },

47. type: "DELETE",

48. dataType: "json",

49. contentType: "application/json;odata=verbose",

50. headers: {

51. "accept": "application/json;odata=verbose",

52. "X-RequestDigest": $("#__REQUESTDIGEST").val(),

53. "X-HTTP-Method": "MERGE",

54. "If-Match": "*"

55. }

56. }

57. },

58. pageSize: 20,

59. schema: {

60. data: "d.results",

61. model: {

62. id: "ID",

63. fields: {

64. ID: { editable: false, nullable: false },

65. Title: { validation: { required: true } },

66. Body1: { validation: { required: true } },

67. Votes: { type: "number", validation: { required: true, min: 1 } },

68. }

69. }

70. }

71. });

Any idea what I can do to only return the fields that are updateable.
Cheers

Data Source

answered on 09 May 2013

1 answer

31 views

Does stockchart support intraday ?

You have daily chart demo. Does it also support intraday (from 1 min, 5, ... to hours)

General Discussions

answered on 09 May 2013

1 answer

287 views

Issue with number formatting with a custom format "#,##0.00##"

We have a need to for decimal formatting with a minimum of 2 decimals and a maximum of 4. However there's a 'small' rounding bug.

This:
kendo.toString(1.23126, "#,##0.00##")

Returns:
1.2313
(as expected)

However, this:
kendo.toString(1.23125, "#,##0.00##")

Returns:
1.2312

Which is clearly not expected. Because when you do this:
kendo.toString(1.235, "#,##0.00")

It returns:
1.24

This was tested using Chrome 26.somthing :)

General Discussions

answered on 09 May 2013

1 answer

96 views

Kendo uploader IE10 Asynchronous Upload not working

On Your Demo Page : http://demos.kendoui.com/web/upload/async.html

I try uploading a normal jpeg image and it just sits there a spins. Never Uploads the file. It never even breaks on the success function or the error function.

If i don't use asynchronous upload, it works.

All My IE10 settings security settings are turned down to medium.
My version is Windows 7 IE10 10.0.9200.16540

Works on every other browser and all older IE Versions. See screen grab of what i am seeing.

Upload

answered on 09 May 2013

2 answers

114 views

[Solved] addRow() method throwing exception

The addRow method is throwing "Object doesn't support this property or method" when running with IE 8.0.7601.17514

Run the attach solution.
Click Add Customer button.
In the popup enter 123456789 for Sage Customer Number and Test for Customer.
Click the X command at the top right of the popup dialog to cancel the addition.
Click Add Customer button and alert pops up indicating "Object doesn't support this property or method"

This code works properly in IE 9 & 10, Chrome(26.0.1410) and Firefox(20.0.1)

Grid

answered on 09 May 2013

4 answers

1.2K+ views

[Solved] Consuming a .NET JSON web service

Hi;

I'm building a .NET web service that my application will consume. I've built the service to deliver JSON data. Using the .NET serializer the data looks like this:

<string xmlns="http://yaddayaddayadda.com/">

[{"title":"Stuff","value":"Here's some stuff"}]

</string>

Here's the web service:

[WebService(Namespace = "http://yaddayaddayadda.com/")]

[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]

[System.ComponentModel.ToolboxItem(false)]

[ScriptService]

public class websiteWebService : System.Web.Services.WebService

{

[WebMethod]

[ScriptMethod(ResponseFormat = ResponseFormat.Json)]

public string GetStuff(int stuff_id)

{

SqlConnection connection = new SqlConnection(ConfigurationManager.ConnectionStrings["stuff"].ConnectionString);

connection.Open();

SqlCommand command = new SqlCommand("o_get_stuff", connection);

command.CommandType = CommandType.StoredProcedure;

command.Parameters.AddWithValue("@stuff_id", stuff_id);

SqlDataReader dr = command.ExecuteReader();

DataTable dt = new DataTable("Stuff");

dt.Load(dr);

dr.Close();

connection.Close();

List<Dictionary<string, object>> rows =

new

List<Dictionary<string, object>>();

Dictionary<string, object> row =

new

Dictionary<string, object>();

foreach (DataRow datarow in dt.Rows)

{

row = new Dictionary<string, object>();

foreach (DataColumn col in dt.Columns)

{

row.Add(col.ColumnName, datarow[col]);

}

rows.Add(row);

}

JavaScriptSerializer serializer = new JavaScriptSerializer();

string jsonData = serializer.Serialize(rows);

return jsonData;

}

Here is my javascript as it stands:

<script type="text/javascript">

$(document).ready(function () {

$("#stuffSelector").kendoDropDownList({

dataTextField: "title",

dataValueField: "value",

dataSource: {

transport: {

read: {

contentType: "application/json",

type: "POST",

url: "http://localhost:23035/Services/websiteWebService.asmx/GetStuff",

data: {

stuff_id: "0"

}

});

</script>

The problem I have is that the data array is wrapped in a <string>. How do I modify my datasource (or the web service) to provide just the array so that I can directly read the "title" and "value"? I'd like to drop something into the datasource schema but I don't know what will strip off the <string>.

Thanks!

Data Source

answered on 08 May 2013

5 answers

1.0K+ views

[Solved] Grid grouping problem when using row template (bug?)

I have a grid with a row template. I have 'Grouping' enabled for the grid, however when attempting to group by a certain column for columns are not re-spaced correctly (having the group column removed normally automatically re-spaces the other columns to keep the data under the column headers). Without the template the spacing works as it should, but with the template the data rows align themselves to the left, meaning many items will now be under the wrong column header.

Here's my code.

The row template, the coloured css classes just change the back colour, and can be removed for testing:

<script id="WorkOrderGridRowTemplate" type="text/x-kendo-template">

<tr>

<td>

${workorderreference}

</td>

<td>

${clientdestination}

</td>

<td>

${productreference}

</td>

<td>

${orderquantity}

</td>

<td>

${unitofmeasure}

</td>

<td>

${releasedate}

</td>

<td>

${quotedduedate}

</td>

<td>

${currentsequenceindex}

</td>

<td>

# if (bufferpenetrationpercentage > 100) { #

<span class="bufferPenetrationBlack">${bufferpenetrationpercentage}</span>

# } else if (bufferpenetrationpercentage > 66) { #

<span class="bufferPenetrationRed">${bufferpenetrationpercentage}</span>

# } else if (bufferpenetrationpercentage > 33) { #

<span class="bufferPenetrationYellow">${bufferpenetrationpercentage}</span>

# } else if (bufferpenetrationpercentage > 0) { #

<span class="bufferPenetrationGreen">${bufferpenetrationpercentage}</span>

# } else if (bufferpenetrationpercentage <= 0) { #

<span class="bufferPenetrationBlue">${bufferpenetrationpercentage}</span>

# } else { #

ERROR: ${ bufferpenetrationpercentage }

# } #

</td>

</tr>

</script>

The grid code:

$("#divWorkOrderGrid").kendoGrid({

dataSource: {

data: <%= _JsWorkOrderRecords %>

},

rowTemplate: kendo.template($("#WorkOrderGridRowTemplate").html()),

height: "auto",

scrollable: false,

sortable: true,

groupable: true,

pageable: false,

columns: [

{

field: "workorderreference",

title: "W/O Ref."

},

{

field: "clientdestination",

title: "Client/Destination"

},

{

field: "productreference",

title: "Product Ref."

},

{

field: "orderquantity",

title: "Order Quantity"

},

{

field: "unitofmeasure",

title: "UoM"

},

{

field: "releasedate",

title: "Release Date"

},

{

field: "quotedduedate",

title: "Quoted Due Date"

},

{

field: "currentsequenceindex",

title: "Current Sequence Index"

},

{

field: "bufferpenetrationpercentage",

title: "Buffer Penetration (%)"

}

]

});

Here's some example data:
[{"workorderreference": "100036628","clientdestination": "MTA","productreference": "2CIN5319/012","orderquantity": 237600,"unitofmeasure": "M2","releasedate": "13/01/2012","quotedduedate": "23/01/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": 40},{"workorderreference": "100036629","clientdestination": "MTA","productreference": "2C3612/001","orderquantity": 231000,"unitofmeasure": "M2","releasedate": "13/01/2012","quotedduedate": "23/01/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": 40},{"workorderreference": "100036630","clientdestination": "CUSTOMER","productreference": "15504710","orderquantity": 215638.2,"unitofmeasure": "M2","releasedate": "13/01/2012","quotedduedate": "19/01/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": 40},{"workorderreference": "100036762","clientdestination": "CUSTOMER","productreference": "2C0388/030","orderquantity": 371950,"unitofmeasure": "M2","releasedate": "13/02/2012","quotedduedate": "22/02/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": -340},{"workorderreference": "100036763","clientdestination": "CUSTOMER","productreference": "15504497","orderquantity": 10100,"unitofmeasure": "KG","releasedate": "13/02/2012","quotedduedate": "22/02/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": -340},{"workorderreference": "100037089","clientdestination": "CUSTOMER","productreference": "2C0008/012","orderquantity": 273969.52,"unitofmeasure": "M2","releasedate": "26/01/2012","quotedduedate": "05/02/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": -140},{"workorderreference": "100037090","clientdestination": "CUSTOMER","productreference": "15504960","orderquantity": 4251.84,"unitofmeasure": "KG","releasedate": "26/01/2012","quotedduedate": "05/02/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": -140},{"workorderreference": "100037251","clientdestination": "CUSTOMER","productreference": "15505006","orderquantity": 16760.16,"unitofmeasure": "KG","releasedate": "10/02/2012","quotedduedate": "19/02/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": -388},{"workorderreference": "100037503","clientdestination": "CUSTOMER","productreference": "2C0610/084","orderquantity": 74655,"unitofmeasure": "M2","releasedate": "23/12/2011","quotedduedate": "29/12/2011","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": 500},{"workorderreference": "100037504","clientdestination": "CUSTOMER","productreference": "15501905","orderquantity": 70778.82,"unitofmeasure": "KG","releasedate": "28/12/2011","quotedduedate": "04/01/2012","currentsequenceindex": "UNRELEASED","bufferpenetrationpercentage": 300}]

I've reproduced this on Firefox, Chrome, Safari and IE8 and 9. IE9 has another quirky issue, with random rows appearing out of sync with their column header when trying to display the ungrouped grid, but I'll leave that for the time being,

Grid

answered on 08 May 2013

2 answers

161 views

[Solved] Difficulty implementing video player when using template

I am trying to get an instance of a video player (JWPlayer) to cooperate with a template I am using. I am very new to this so please forgive me if this solution is obvious to some.

Objective:
When a user clicks a kendo button on the default.aspx page, a kendo window pops up and is formatted based on a template I pass in. I'd like to display the video inside that kendoWindow inside of a div.

This javascript method is located inside my default.aspx:

function playVideoNow()

{

jwplayer("details-container").setup({

file: "https://www.contoso.com/example.m4v",

image: "https://www.contoso.com/example.png"

});

This is the template that I have sitting inside of default.aspx:

<script type="text/x-kendo-template" id="template">

<div id="details-container">

<h2>Video Name</h2>

<em>Video Date</em>

<dl>

<dt>Some Info: </dt>

<dt>Some More Info:</dt>

</dl>

</div>

# window.onload = playVideoNow() #

</script>

Problem:
When I open the kendoWindow, it complains that it cannot locate "details-container". I assume this is because it is out of scope for the window, since the javascript method is executing from default.aspx, it doesn't know that "details-container" exists.

Question:
So what is the proper way to implement this? Should I run jwplayer.setup() in the template? What would this look like? Some example code would really help to get me started.

Thanks,

Ray

Templates

answered on 08 May 2013