This is a migrated thread and some comments may be shown as answers.

Toolbar buttons on Kendo Grid

2 Answers 214 Views

Grid

This is a migrated thread and some comments may be shown as answers.

Paul asked on 09 Jul 2014, 12:20 PM

Hi Guys,

Am I doing something wrong (i must be of course) because I can't seem to get a simple create button to work from my kendo grid toolbar.
I want a row to be added to the grid when the create button is clicked from the toolbar, everything in the demos suggests this should work unless I've missed some vitally important detail ...

01. <script>

02. $(function () {

03.

04. var window = $("#queryBuilder");

05.

06. window.kendoWindow({

07. width: "600px",

08. modal: true,

09. resizable: false,

10. draggable: false,

11. title: "New Query Builder",

12. actions: ["Close"]

13. });

14.

15. //window.data("kendoWindow").close();

16. window.data("kendoWindow").center().open();

17.

18. var queryModel = kendo.observable({

19. rules: new kendo.data.DataSource({

20. schema: {

21. model: {

22. id: "id",

23. fields: {

24. IncludeExclude: { type: "boolean" },

25. FieldName: { field: "FieldName", type: "string" },

26. Condition: { field: "Condition", type: "string" },

27. Value: { field: "Value", type: "string" }

28. }

29. }

30. },

31. create: function (options) {

32. this.rules.push(new { IncludeExclude: true, FieldName: "SubmissionId", Condition: "=", Value: "0" });

33. },

34. destroy: function (options) {

35. //this.rules.pop();

36. }

37. })

38. });

39.

40. $('#rules').kendoGrid({

41. dataSource: queryModel,

42. scrollable: true,

43. toolbar: ['create'],

44. columns: [

45. { field: ' includeExclude', title: 'Include Exclude' },

46. { field: 'FieldName', title: 'Field Name' },

47. { field: 'Condition', title: 'Condition' },

48. { field: 'Value', title: 'Value' },

49. { command: ['destroy'], title: '' }

50. ]

51. });

52.

53. var includeExclude = new kendo.data.DataSource({

54. items: [

55. { text: "I want Submissions where", value: true },

56. { text: "I dont want Submissions where", value: false }

57. ]

58. });

59.

60. });

61. </script>

62.}

63.

64.<div id="queryBuilder" style="display: none;">

65.

66. <div id="rules"></div>

67.

68. <hr style="margin-bottom: 5px;" />

69. <button class="k-button" style="float: right">Create New Submission Query</button>

70.</div>

Toolbar buttons on Kendo Grid

2 Answers, 1 is accepted