Access Parent Methods from Child Template When Using Array Of Primitive Values As Source

2 posts, 0 answers
  1. Santiago
    Santiago avatar
    1 posts
    Member since:
    Oct 2015

    Posted 30 Aug Link to this post

    Hi there. I have a problem here... Suppose the following scenario:

    I have this model:

     

    var vm = kendo.observable({

       values: ["orange", "apple", "etc"],

       remove: function(e) { console.log("this is working"); }

    });

    and then something like this in my markup:

    <div data-template="diosTeAyude" data-bind="source: values"></div>
    <script id="diosTeAyude" type="text/x-kendo-template">
            <div class="input-group">
                <input data-bind="value: this">
                <span class="input-group-addon" data-bind="click: remove">-</span>
            </div>
    </script>

     

    "remove" method is not accessible, cause I'm using primitive types in my array, nothing outside the actual primitive value is there. If I change my model to:

    var vm = kendo.observable({
    values: [{theValue: "orange"}, {theValue: "apple"}, {theValue: "etc"}],
    remove: function(e) { console.log("this is working"); }
    });

    and my template to:

    <script id="diosTeAyude" type="text/x-kendo-template">
            <div class="input-group">
                <input data-bind="value: theValue">
                <span class="input-group-addon" data-bind="click: remove">-</span>
            </div>
    </script>

    then the viewModel prototypes fine and remove function is there, even when convert my array of strings to objects is unnecessary from the model point of view.

     

    Is there any other way to accomplish what I need without having to do that?

     

    Thanks in advance!

  2. Stefan
    Admin
    Stefan avatar
    270 posts

    Posted 01 Sep Link to this post

    Hello Santiago,

    The first example is not working correctly because the template is receiving just a string array, not a model. When there is a function like in this case remove, the model will know for its parent, and can call the function. If the first example does not have a function it will populate the inputs correctly.

    Please check our demo which is demonstrating the recommended way of using MVVM source binding with templates:

    http://demos.telerik.com/kendo-ui/mvvm/source

    Also, please check the information in our documentation for source binding:

    http://docs.telerik.com/kendo-ui/framework/mvvm/bindings/source#source-binding

    Let me know if you need additional information on this matter.

    Regards,
    Stefan
    Telerik by Progress
     
    Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
     
  3. Kendo UI is VS 2017 Ready
Back to Top