Hi,

How can I update a column template based on a selected option from my context menu?

So when I select a row in my grid and right click the mouse to open the context menu I would like to update the status column with the selected option from my context menu.

so far the I build this exampl: http://dojo.telerik.com/@Ricardo%20Coelho/AyeVUz/11

Could someone help me with thins?

Thanks.

Hello 

I checked the remove functions of the Upload Widget. As far as I understand: Any remove functionality reacts only on files "inside" the Upload widget. The widget itself is not persistent: You can upload files by the widget to get files into that list. You then can delete/remove them right away. After reload the page this file list is empty. The usual business case I know is: Customer do upload files on a day and want to delete it any other day or just later. I have such a case and create a unique ID for each uploaded file. I wonder if and how it is possible to use the Upload widget by sending this ID and triggering the removeURL handler. I've found some very old entries, one with trigger the remove event by "$(".k-delete").parent().click();" but nothing happens doing that. 

The most simple way would be to add a file to be deleted on that file list and then call the removeURL handler. 

Is there an easy way to do that or is it better to use a separate AJAX call?

Regards

I'm updating my dropdown's datasource by calling   DDL.data("kendoDropDownList").dataSource.read();

This partially works, it executes the server side read event, but it does not execute the JS function which should dynamically get the parameters for the server side read event. The function assigned in .Data [see below] (GetAllDescriptorsData) only executes once - when the page loads, it does not re-execute when . call read() [see above]. 

My question is, How can I force a read and get new parameters?

 @(Html.Kendo().DropDownList()
                        .Name(YearDescriptorID)
                          .DataSource(source =>
                          {
                              source.Read(read =>
                              {
                                  var IsSpouse = Model.IsSpouse ? "1" : "0";
                                  read.Action("GetAllDescriptors", "Income").Data("GetAllDescriptorsData("+ Model.PersonalKey + "," + IsSpouse + ")");
                              
                              })
                               .ServerFiltering(true);
                          })
                        .AutoBind(false)
                        .DataTextField("DisplayText")
                        .DataValueField("IncomeKey")
                        .Events(e =>
                        {
                            e.Change("onChangeYearDescriptor");
                            e.DataBound("onDataboundYearDescriptor");
                        })
                )

Assuming I have the following HTML element
<div id="grid" />
the following script works:

$("#grid").kendoGrid({
columns: [
{ field: "name" },
{ field: "age" }
],
dataSource: [
{ name: "Jane Doe", age: 30 },
{ name: "John Doe", age: 33 }
]
});

I would like the following to work instead (and it doesn't):

$("#grid").kendoGrid({
columns: [
{ field: 0 },
{ field: 1 }
],
dataSource: [
[ "Jane Doe", 30 ],
[ "John Doe", 33 ]
]
});

I can make it work using a workaround like the sample below, but this is an ugly workaround - any chance this could be placed into the framework?
The reason is that JSON that contains array or arrays cost much less to transfer then a JSON with array of objects with named fields

Is it possibile to add a context menu to cell.

The idea is add a right click on cell, header, footer to format it.

Any other options/idea is appreciated

I am using a KendoUI grid to display data on screen. Each row has a set of buttons that trigger various actions. One button triggers a modal popup asking the user to select a child item (generated via an ajax call) of the row before continuing on with the action. The first time the button is triggered, the select is correctly filled, however, on subsequent calls the select box is left blank as if the element doesn't exist. Any idea what I am doing wrong here:

    $(document).ready(function () {
      $('#formGrid').delegate('.exportButton', 'click', function () {
         var button = $(this);
         var formId = button.attr("data-form-id");
         var formImplementationId = button.attr("data-form-implementation-id");
         var formVersion = Number(button.attr("data-form-version"));

         $.ajax({
           url: AppSettings["BaseUrl"] + "/xxxx/GetVersions?formId=" + formId + "&formImplementationId=" + formImplementationId,
           dataType: 'json',
           success: function (data) {
             $.each(data, function (index) {
               var item = data[index];
               $("#exportVersion").append("<option value=\"" + item.Version + "\">Version: " + item.Version + " (" + item.EffectiveDate + ")</option>")
             });
           }
         });

         var kendoWindow = $("<div />").kendoWindow({
           title: "Export Form",
           resizable: false,
           modal: true
         });

         kendoWindow.data("kendoWindow")
           .content($("#select-export-version").html())
           .center().open();

         kendoWindow
           .find(".export-confirm")
           .click(function () {
             if ($(this).hasClass("export-confirm-yes")) {
               window.location = AppSettings["BaseUrl"] + "/xxxx/ExportForm?formId=" + formId + "&formImplementationId=" + formImplementationId + "&formVersion=" + $('#exportVersion').val()
             }

             kendoWindow.data("kendoWindow").close();
           })
           .end()
         });
      });

      $('#formGrid').kendoGrid({
        dataSource: {
          transport: {
            read: {
              url: '@Url.EncodedAction("GetForms", "xxxx")',
              dataType: "json",
              contentType: "application/json"
            }
          },
          schema: {
            model: {
              fields: {
                FormName: { type: "string" },
                ContractName: { type: "string" },
                EffectiveDate: { type: "date" },
                UserName: { type: "string" },
                IsDraft: { type: "string" },
                FormId: { type: "string" },
                FormImplementationId: { type: "string" },
                FormVersion: { type: "number" }
              }
            }
          },
          pageSize: 15,
          sort: [{ field: "FormName", dir: "asc" }]
        },
        sortable: true,
        pageable: true,
        columns: [
          {field: "FormName", title: "Form"},
          {field: "Version", title: "Version", width: 100},
          {field: "ContractName", title: "Contract", width: 150},
          {field: "EffectiveDate", title: "Last Modified", format: "{0:MM/dd/yyyy}"},
          {title: "User", field: "UserName"},
          {field: "Status", title: "Status", width: 120},
          {
            template: function (dataItem) {
              buttons = '<div class="buttonDiv">';
              buttons += '<button class="exportButton" title="Export Form" data-form-id="' + dataItem.FormId + '" data-form-implementation-id="' + dataItem.FormImplementationId + '" data-form-version="' + dataItem.Version + '"><span class="glyphicon glyphicon-open"></span></button>'
              buttons += '</div>';

              return buttons;
            },
          }
        ]
      });
    });

    <script id="select-export-version" type="text/x-kendo-template">
      <div id="export-file-modal" class="maintenance-modal">
        <p>
          <label for="exportVersion">Select the version of the form to export:</label><br />
          <select id="exportVersion"></select>
        </p>
        <div id="export-buttons" class="text-center same-width">
          <button class="export-confirm export-confirm-yes k-button k-default">Export</button>
          <button class="export-confirm export-confirm-no k-button k-primary">Cancel</button>
        </div>
      </div>
    </script>

In a non-MVVM enviroment, I can define the child entities of my hierarchical datasource by setting the schema:

In a viewModel I am defining the same datasource like this:

What is happening here, that I am loading a flat array of json objects from a file (later api endpoint) and unflatten this list, so it is in a hierachical format. The method to unflatten this array is naming the children "Assets". Running this, the treeview fails to display. If I change the unflatten method to name those children "items", the treebiew works.

You can reproduce this in this Dojo: http://dojo.telerik.com/UTOBe/3

Change items, to anything else and it stops working. How can I configure the kendo.observableHierarchy, so it uses any other property then "items" to determine if an object has children using a viewModel?

Destroying and recreating a Toolbar in the same DOM element causes problem with Splitbutton expansion via keyboard.  To reproduce:

1.  Create a toolbar with a splitbutton.  Using the keyboard, tab to the splitbutton and use alt-down to expand it.  Works great.

2.  Destroy the toolbar with .destroy(), and empty the containing DOM element.

3.  Create a toolbar with a splitbutton in the same (now empty) DOM.

4.  Tab to the splitbutton and press alt-down.  The splitbutton expands and immediately closes.

Demonstrated here:  http://dojo.telerik.com/@richm/odATu