Using k-min and k-max with Angular

8 posts, 0 answers
  1. Tim
    Tim avatar
    2 posts
    Member since:
    Sep 2014

    Posted 07 Oct 2014 Link to this post

    Hi,

    I'm setting the min and max values with Angular, they set fine first time but don't update if 'items' values' change (as if there's a one-time bind rather than a two-way bind).

    This means that if I set one item to 5, and then the next item along should have its min/max values changed accordingly.

    Is there a way to do this out-the-box with Kendo UI? It works as expected with a standard HTML number input.

    Here's what I have currently:

        <div ng-repeat="item in items">
            <input data-kendo-numeric-text-box
                data-k-min="items[$index + 1].value"
                data-k-max="items[$index - 1].value"
                data-k-format="'n0'"
                data-k-ng-model="item.value" />
        </div>

    Thanks!
  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 09 Oct 2014 Link to this post

    Hi Tim,

    I believe that the widget does not allow item.value, because it is out of the defined <k-min, k-max> range. Defining a more conditional setting of the min/max range solves the problem. Here is a Dojo demo that I've prepared for better understanding.

    As a side note, I would suggest you check the "Notes for ng-repeat" help topic, as there are several important points you need to be aware of.

    Regards,
    Georgi Krustev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Tim
    Tim avatar
    2 posts
    Member since:
    Sep 2014

    Posted 11 Dec 2014 in reply to Georgi Krustev Link to this post

    Hi Georgi,

    Thanks for your reply and apologies it's taken so long to get back to you.

    That's close to what I'm getting at but in your demo the min and max values don't change when the values change. E.g. if I change the last input value to 9, the penultimate input's 'max' value is still 5.

    This happens even if I make the array an Observable Array with `new kendo.data.ObservableArray($scope.items)`. Do I need to attach a change listener to each one and update the min and max values that way?

    Thanks,
    Tim
  5. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 13 Dec 2014 Link to this post

    Hello Tim,

    In general, k-min/k-max attributes will just set the min/max options of the widgets. They will not update the values dynamically like for instance k-ng-model, because they are just a short-hand for declarative widget declaration (they are not directives). If you would like to update the min/max values dynamically then you will need either wire the change event and update the corresponding options manually or write a custom directive that will basically do the same thing.

    Regards,
    Georgi Krustev
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  6. Ken
    Ken avatar
    6 posts
    Member since:
    Aug 2014

    Posted 30 Dec 2014 in reply to Georgi Krustev Link to this post

    Is there any chance you have sample code of an Angular Directive that would do this?  I am running into the same problem and my Angular Skills are just not as good as I want them to be now.  A little sample code would be very helpful.
  7. Ken
    Ken avatar
    6 posts
    Member since:
    Aug 2014

    Posted 31 Dec 2014 in reply to Ken Link to this post

    I found a solution...  I set the k-max value using the k-options and using a $scope var in the controller.  I then added k-rebind on the same thing that k-options was.

    That way, when I change the max value in the Options, it updates.

  8. Craig
    Craig avatar
    4 posts
    Member since:
    Sep 2015

    Posted 20 Nov 2015 in reply to Georgi Krustev Link to this post

    So, I've been through this demo, and I don't see that it rebinds the min/max as the values in the other boxes change.  The min/max are staying constant, even though the values in the other boxes are changing.  I'm hitting this issue as well.  I can't dynamically change the max value in my instance.  I'm setting a scope var, but it just doesn't affect the control itself.
  9. Craig
    Craig avatar
    4 posts
    Member since:
    Sep 2015

    Posted 20 Nov 2015 in reply to Craig Link to this post

    Ken's k-options solution worked great.
Back to Top
Kendo UI is VS 2017 Ready