Edit Kendo Window Diagram Shape Edit

2 posts, 1 answers
  1. Jan
    Jan avatar
    30 posts
    Member since:
    Mar 2014

    Posted 10 Oct Link to this post

    Hello,

    I have a Diagram Widget with a ShapeTemplate (Html.Kendo().Diagram().Editable.ShapeTemplateName("NodeEditTemplate")

    @model Web_Anlageneditor.ViewModels.Diagram.DiagramEditNodeVm
     
    @Html.ValidationSummary(true, "", new { @class = "text-danger" })
    @Html.AntiForgeryToken()
    <div class="form-group row">
        @Html.LabelFor(m => m.Title, new { @class = "col-sm-10 " })
        <div class="col-sm-10">
            @Html.EditorFor(m => m.Title, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(m => m.Title, "", new { @class = "text-danger" })
        </div>
    </div>
    <script>
        //Kendo Validation
        $(function() {
            $("form").kendoValidator();
        });
    </script>

     

    How can I access the window's Title-bar, Width, etc. build around this Template when editing/creating the shape? (s. attachment)

  2. Answer
    Stefan
    Admin
    Stefan avatar
    1394 posts

    Posted 12 Oct Link to this post

    Hello, Jan,

    Regarding the requirements:

    1) The title can be changed with jQuery on the edit event of the Diagram:

    https://docs.telerik.com/kendo-ui/api/javascript/dataviz/ui/diagram#events-edit

    2) The width can be controlled with CSS:

      <style>
        .k-window{
          width:1000px;
        }
    </style>

    I made an example demonstrating this:

    http://dojo.telerik.com/OQAKID

    I hope this is helpful.

    Regards,
    Stefan
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top