I have a Kendo Editor defined as below:

      @(Html.Kendo().Editor()
      .Name("RestrictionsEditor")
      .Tag("div")
      .Tools(tools => tools
            .Clear()
            .Bold().Italic().Underline().Strikethrough()
            .JustifyLeft().JustifyCenter().JustifyRight().JustifyFull()
            .CreateLink().Unlink()
            .InsertImage()
            .TableEditing()
            .FontColor().BackColor()
      )
      .Value(@<text><p>This is readonly editor initially and only gets in edit mode after button is clicked</p></text>))
        

Below is how I am making the Editor as readonly:

           <script type="text/javascript">
                $(function () {
                    var editor = $("#RestrictionsEditor").data("kendoEditor"),
                    editorBody = $(editor.body);

                    // make readonly
                    editorBody.removeAttr("contenteditable").find("a").on("click.readonly", false);
                })
                   
            </script>

I want to get editor in 'Edit' mode only when a button is clicked. Below is how I am defining my button:

                         <button class="btn-sm" id="edit">Edit</button>

I have defined my button just before initializing Kendo Editor.

And below is how I am trying to get the editor to edit mode:

         <script type="text/javascript">
                $("#edit .btn").click(function () {

                var editor = $("#RestrictionsEditor").data("kendoEditor"),
                editorBody = $(editor.body);
                
                editorBody.attr("contenteditable", true).find("a").off("click.readonly");
                })
            </script>

Now, when I run application my editor is in read only and when I click 'Edit' button, editor doesn't gets in edit mode and instead as soon as I click button, I m directed to the original page. Forgot to mention, my editor is inside a tab, which is inside of a modal.

Can you tell  me where I am doing wrong and how can I acheive th

Thanks!

I've tested in Chrome (49.0.2623.112 m), Firefox (45.0.2), IE 11 (11.212.10586.0), and MS Edge (25.10586.0.0).

I'm having to programmatically resize some parent panes and a vertical splitter, it would be nice to bind that event and call my resize function there.

And while the contentLoad event doesn't appear to be working, the resize event does fire.

I'd also like to note that the kendoSplitter loads beautifully in IE 11.

Thanks!

Is it possible to have jQuery run inside of an inline template?

Here's what I'm trying to accomplish.  I have an inline template that contains a form that the user fills out to submit back to my controller.  I have a set of radio buttons on the form.  If they click on the last radio button, I need my textarea to appear and be required for form submission.  

Here's my template:

How can I use jQuery to show/hide the answer textarea field depending on if the last radio button is checked or not?  If jQuery isn't possible, can it be done via regular JavaScript?

I have a Gird which has a number of editable fields as well as some standardized auditing fields (LastUpdatedBy, LastUpdatedOn).

The later are intended to be read only.  So they are marked as Editable(false)

            model.Field(a => a.LastModifiedBy).Editable(false);
            model.Field(a => a.LastModifiedOn).Editable(false);

For the inline edit I am doing an Ajax call to controller action which processes the edit, updates the modified fields and passes the updated record back to the grid.  The grid displays the editable changes however I assume because they are non-editable the modified fields are not updated.  Doing a refresh of the page displays correct information but that is not desirable.

How can the behavior of Grid be override so that it will update the display of all model fields even the ones marked non-editable after an update?

Please read from here: http://stackoverflow.com/questions/36495655/get-column-name-from-container-or-create-generic-function-for-any-column

(There is also a support ticket open, so no admin has to sweat over here if they don't want to).

Because I'm using a lot of kendo grids spread in the whole web app, I start to introduce some redundant code that causes me a lot of troubles. Imagine to have something like:
//MVC:...

columns.Bound(c => c.Column1).Filterable(f => f.Extra(false).Operators(o => o.ForString(str => str.Clear().Contains("Contains"))).Cell(c => .ShowOperators(false).Template("column1Filter"))).Title("Column One");

...

//JS:

function column1Filter(container) {

container.element.kendoAutoComplete({

filter: "contains",

dataTextField: "Column1",

dataValueField: "Column1",

valuePrimitive: true,

dataSource: container.dataSource

});

}

Then, having this method reproduced for each single columns in each single grids. Is there any way where I can I have only one method that creates the kendo autocomplete?

E.G:

function genericAutocompleteFilter(container) {

var columnsName = //...Meh!

container.element.kendoAutoComplete({ filter: "contains", dataTextField: columnsName, dataValueField: columnsName, valuePrimitive: true, dataSource: container.dataSource });

}

Hello,

i have a tabstrip with 5 tabs all with LoadContentFrom

How can i check if a tab is loaded or not with jquery?

My problem is, that i have a dropdownlist outside the tabstrip and if i change the entry of the list i want to reload only the tabstrips with content inside.

Thanks!

Hi,

I'm working with Angular and Kendo UI. I want to update an extising grid through an ajax call. I had to iterate over all items in datasource and compare them with the result of ajax call. If i got the item from the response, i had to update, if not i had to delete the item from the grid. Update works fine, if I doesnt use the getter and setter from the model. Now i only got problems with removing the items.

At first I changed the change event for the grid like preventDefaults, if im updating. Now my execution time was shrinking from ~100s to 13s. I tried the same for the datasource but it doesnt work.

Over all I got ~ 1200 items in my grid. I had to delete ~ 600. The average time per removing is 20ms, so the whole update takes 13sec and the most impact is located at the remove.

Is there any way to speed up the remove without recreate the datasource. If I recreate the datasource, i loose the focus and cant easyily reselect the items.

Thanks for your help.

refer URL mentioned below

http://dojo.telerik.com/AMemE

I have added a focusout event for the textbox in which i disable the cap color drop down.

When we focusout from texttbox by clicking on Cap color drop down list, the list is shown in IE11 (not in chrome).

Please suggest a way to avoid this problem.