bind to ENTIRE view model

2 posts, 0 answers
  1. Stacey
    Stacey avatar
    56 posts
    Member since:
    Aug 2013

    Posted 03 Nov 2013 Link to this post

    I have a situation where I am wanting to observe the behavior of a view model as I am populating a form. I can do this with defining a lot of fields that look kind of like the model, and binding to them, but that is kind of messy.

    I am currently accomplishing this with the following code;

    (function ($) {
        $.printJSON = function(value){
            return JSON.stringify(value, undefined, 2);
        }
    })(jQuery);
    var viewModel = kendo.observable({
                        // other fields etc
        update: function (e) {
            e.preventDefault();
            $("#json_result").html($.printJSON(this));
        }
    });
    <div style="width: 400px; float: left; padding-left: 15px;" >
        <button data-bind="click: update" value="Update" >Update</button>
        <pre id="json_result">
        </pre>
    </div>
    So you click the button, and it runs the function to draw the view model JSON to the screen, all nice and formatted.

    But this still requires a button click. While that isn't that big of a problem for me, since this isn't something I need for a lot of situations, is there any way to actually do this and have it update when the view model changes in any way? I tried to just bind to the function and it never updates without an explicit call, I tried binding right to the view model, and that didn't work either. 
  2. Alexander Valchev
    Admin
    Alexander Valchev avatar
    2895 posts

    Posted 04 Nov 2013 Link to this post

    Hello Stacey,

    The ViewModel itself is instance of kendo.data.ObservableObject.
    You can bind to the change event of the whole ViewModel.

    Regards,
    Alexander Valchev
    Telerik
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Back to Top