<script>
function change(evt) {
console.log($(evt).val());
}
</script>
<textarea id="editor" style="height: 340px;"
kendo-editor="editorWidget" ng-model="sfModel"
k-scope-field="editorWidget"
sf-toggle-commands="strikethrough, justifyFull, subscript, superscript, fontName, fontSize, foreColor, backColor, print"
k-encoded="false"
k-stylesheets='[getPackageResourceUrl("/ResourcePackages/Bootstrap/assets/dist/css/styles.min.css")]',
k-tools='[
"formatting",
"bold", "italic", "underline", "trikethrough",
"justifyLeft", "justifyCenter", "justifyRight", "justifyFull",
"insertUnorderedList", "insertOrderedList", "indent", "outdent",
{
name: "custom",
template: "<select onchange=\"change(this);\"><option value=\"volvo\">Volvo</option><option value=\"saab\">Saab</option><option value=\"mercedes\">Mercedes</option><option value=\"audi\">Audi</option></select>"
},
{
name: "createLink",
template: "<a href=\"\" class=\"k-tool k-group-start\" ng-click=\"openLinkSelector()\" title=\"@(Res.Get<ClientComponentsResources>().InsertHyperlink)\"><span class=\"k-tool-icon k-createLink\">@(Res.Get<ClientComponentsResources>().InsertHyperlink)</span></a>"
},
"unlink",
{
name: "insertImage",
template: "<a href=\"\" class=\"k-tool k-group-start\" ng-click=\"openImageSelector()\" title=\"@(Res.Get<ClientComponentsResources>().InsertImage)\"><span class=\"k-tool-icon k-insertImage\">@(Res.Get<ClientComponentsResources>().InsertImage)</span></a>"
},
{
name: "insertFile",
template: "<a href=\"\" class=\"k-tool k-group-start\" ng-click=\"openDocumentSelector()\" title=\"@(Res.Get<ClientComponentsResources>().InsertFile)\"><span class=\"k-tool-icon k-insertFile\">@(Res.Get<ClientComponentsResources>().InsertFile)</span></a>"
},
{
name: "insertVideo",
template: "<a href=\"\" class=\"k-tool custom-tool\" title=\"@(Res.Get<ClientComponentsResources>().InsertVideo)\" ng-click=\"openVideoSelector()\"><span class=\"glyphicon glyphicon-facetime-video\"></span></a>"
},
"createTable", "addColumnLeft", "addColumnRight", "addRowAbove", "addRowBelow", "deleteRow", "deleteColumn",
"cleanFormatting",
"strikethrough", "subscript", "superscript","fontName", "fontSize", "foreColor", "backColor", "print",
{
name: "showAll",
template: "<a class=\"k-tool custom-tool show-all-button\" title=\"@(Res.Get<ClientComponentsResources>().AllTools)\" ng-click=\"toggleAllTools()\"><span class=\"glyphicon glyphicon-option-horizontal\"></span></a>"
},
{
name: "fullscreen",
template: "<a class=\"k-tool js-custom-tool custom-tool\" title=\"Fullscreen\" ng-click=\"toggleFullScreen()\"><span class=\"js-fullScreen glyphicon\"></span></a>"
},
{
name: "htmlView",
template: "<button class=\"custom-tool btn btn-default btn-xs pull-right js-htmlview js-custom-tool\" ng-click=\"toggleHtmlView()\">\{\{htmlViewLabel\}\}</button>"
}
]'>
</textarea>
<sf-link-selector-modal id="linkSelectorModal"></sf-link-selector-modal>
<div class="mediaPropertiesModal"
template-url="{{mediaPropertiesDialog}}"
modal
size="normal"
existing-scope="true"
window-class="sf-designer-dlg sf-timespan-selector-dlg"
dialog-controller="{{sfMediaPropertiesController}}">
</div>