Add New Item (MVC)

4 posts, 1 answers
  1. Alex
    Alex avatar
    54 posts
    Member since:
    May 2015

    Posted 07 Dec 2016 Link to this post

    I'm trying to set up a MultiSelectFor to be used NoDataTemplate, but the pop-up just never seems to appear. There is an HTML5 version on the site,but not one for MVC: http://demos.telerik.com/kendo-ui/multiselect/addnewitem

    Here is what I have wrriten, but the template never appears

     

    <script id="@noDataTemplateID" type="text/x-kendo-tmpl">
        <div>
            No data found. Do you want to add new item - '#: instance.input.val() #' ?
        </div>
        <br />
        <button class="k-button" onclick="addNew('#: instance.element[0].id #', '#: instance.input.val() #')">Add new item</button>
    </script>
     
     
    <script>
        //the actual data won't get synced to the server, but that's okay because when we save this new item on the update of the parent model, we presumably will grab that newly added item on the next read
        function addNew(widgetId, value) {
            var widget = $("#" + widgetId).getKendoMultiSelect();
            var dataSource = widget.dataSource;
     
            if (confirm("Are you sure?")) {
                dataSource.add({
                    ProductID: 0,
                    ProductName: value
                });
     
                dataSource.one("requestEnd", function (args) {
                    if (args.type !== "create") {
                        return;
                    }
     
                    var newValue = args.response[0].ProductID;
     
                    dataSource.one("sync", function () {
                        widget.value(widget.value().concat([newValue]));
                    });
                });
     
                dataSource.sync();
            }
        }
    </script>
     
    @(
     Html.Kendo().MultiSelectFor(m => m)
            .DataTextField(descriptionField)
            .DataValueField(IDFIeld)
            .NoDataTemplate(noDataTemplateID)
            .DataSource(source =>
            {
                source.Read(read => {
                    read.Action("Read", "List", new { ListType = ListType, Param1 = Param1, Param2 = Param2, Param3 = Param3 });
                })
                .ServerFiltering(true);
            })
    )

     

     

  2. Peter Milchev
    Admin
    Peter Milchev avatar
    258 posts

    Posted 09 Dec 2016 Link to this post

    Hello Alex,

    The NoDataTemplate is used when the template is passed as a string while NoDataTemplateId property is used when you pass the template by Id which is your case. 

    .NoDataTemplateId(noDataTemplateID)

    Also, I would like to recommend you to review the jQuery Plug-Ins Widget Initialization where in the Duplicate Initialization the correct way to obtain a widget reference is demonstrated.

    <input id="autocomplete" />
       <script>
           // initialization code here...
           $("#autocomplete").kendoAutoComplete(["Apples", "Oranges", "Grapes"]);
     
           // ...
           // correct - instance reference is obtained:
           var autocomplete = $("#autocomplete").data("kendoAutoComplete");
     
           // INCORRECT - instance reference is obtained while creating a duplicate instance:
           var duplicate = $("#autocomplete").kendoAutoComplete().data("kendoAutoComplete");
       </script>

    Regards,
    Peter Milchev
    Telerik by Progress
    Telerik UI for ASP.NET MVC is ready for Visual Studio 2017 RC! Learn more.
  3. Alex
    Alex avatar
    54 posts
    Member since:
    May 2015

    Posted 09 Dec 2016 Link to this post

    Changing to NoDataTemplateId, did not change anything. I still get the default of "No Data Found", instead of the custom message. Is there something I can do to try and narrow down the issue?
  4. Answer
    Peter Milchev
    Admin
    Peter Milchev avatar
    258 posts

    Posted 13 Dec 2016 Link to this post

    Hello Alex,

    Please find attached a sample runnable project implementing the MultiSelect with custom NoData template.

    Would you please modify the attached project so that it reproduces the issues you are encountering and send it back to us? Also, would you please double check if you are using the latest version of the server-side wrappers (2016.3.1118)?

    Regards,
    Peter Milchev
    Telerik by Progress
    Telerik UI for ASP.NET MVC is ready for Visual Studio 2017 RC! Learn more.
Back to Top