Kendo MVC Editor button with action

[Chris Womack]

I need to be able to add a form button in the content using the editor. Using the "view html" tool, I am able to create a button. However, I need this button to have an "onclick" property. This was possible in pervious rad editor. Is this a possibility in the current editor? 

Currently, that "onclick" property value gets stripped out when pressing "update". 

<inupt type="button" onclick="myfunction()" value="here" /> 

[Aleksandar]

Hello Chris,

In it's classic mode the Editor renders the content in an iframe. To attach a click handler to an element in the iframe you can follow the approach in this SO thread, for example. That said, you can achieve the desired result the following way:

    <div id="example" class="demo-section k-content wide editor">
        @(Html.Kendo().Editor()
                  .Name("editor")
                  .HtmlAttributes(new { style = "width: 100%; height:840px" })
                  .StyleSheets(css => css
                    .Add(Url.Content("~/shared/web/editor/editorStyles.css"))
                  )
                  .Tools(tools => tools
                        .Clear()
                        .Bold().Italic().Underline()
                        .JustifyLeft().JustifyCenter().JustifyRight()
                        .InsertUnorderedList().InsertOrderedList()
                        .Outdent().Indent()
                        .CreateLink().Unlink()
                  )
                .Value(@<text>
                          <button type="button" id="btn" value="Button clicked" >Button</button> 
                </text>)
        )
    </div>
    <script>
        $(document).ready(function(){
            var editor = $("#editor").getKendoEditor();
            $(editor.body).find("#btn").click(function(){
                    alert($(this).attr("value"))
            })

        })
    </script>

 

Here is a sample REPL.

Regards,
Aleksandar
Progress Telerik