UPDATE. I think I need to use input type='number' for this to work. Trying it now.

Hi everybody,

I'm not sure why the following markup is not working for me. When I inspect the element in Google Chrome I'm seeing the following

<input type="text" name="pcSplitPercent2" ng-model="currentItem.pcSplit2" 
class="form-control ng-valid ng-scope ng-valid-sm-number ng-dirty ng-valid-parse ng-touched" 
placeholder="Allocation 2" data-sm:number="" data-sm:number-format="" 
min="0" max="100" ng-blur="calculateRemainingPercent()" data-accuracy="2" ng-if="(currentItem.splitType == 0)">

I've entered a big value (33333) and I expect it to generate the max error and ng-invalid. But it doesn't do that for some reason.

Here is what I have for the control:

 <div class="col-md-6 col-lg-6">
                <div class="input-group">
                    <input type="text" name="pcSplit2" ng-model="currentItem.pcSplit2" class="form-control"
                           placeholder="Allocation 2" data-sm:number data-sm:number-format
                           data-accuracy="2" ng-if="(currentItem.splitType != 0)">

                    <input type="text" name="pcSplitPercent2" ng-model="currentItem.pcSplit2" class="form-control"
                           placeholder="Allocation 2" data-sm:number data-sm:number-format
                           min="0" max="100" ng-blur="calculateRemainingPercent()"
                           data-accuracy="2" ng-if="(currentItem.splitType == 0)">

                    <span class="input-group-addon" ng-show="(currentItem.splitType == 0)">%</span>
                    <div class="field-validation-error">
                        <span ng-show="(form.editItemProfitCenterForm.pcSplitPercent2.$error.max || form.editItemProfitCenterForm.pcSplitPercent2.$error.min) && form.editItemProfitCenterForm.pcSplitPercent2.$dirty">
                            @String.Format(Messages.mustBeBetweenXandY, Labels.percent, "0", "100")
                        </span>
                    </div>
                </div>               
            </div>

Do you see a reason why min/max attributes are not working here? I believe in other cases where we use sm-number directive and min/max it's working fine (although I am going to verify).

Could it be ng-if interfering or ng-blur method?

Thanks a lot in advance.