Intermittent Angular Data Binding Problems

3 posts, 0 answers
  1. Russell
    Russell avatar
    8 posts
    Member since:
    Apr 2015

    Posted 13 Jan Link to this post

    In an Angular 1.4.8 application I am using several similarly configured Dropdowns and Combo Boxes (version 2015.3.1111) that will intermittently fail to initialize existing numeric values correctly and result in Angular form validation errors. I am only seeing this behavior in IE 11, maybe 1 out of 10 times the form loads. The data source in each case is the same $http service call (differing only by parameter) to another local machine located on the same network subnet.

    Below is a sample of the markup and controller code, and attached are screenshots that show what is in the DOM when loading fails and succeeds. Note in the screenshots how in the failed view option value 27 (the pre-existing value) is marked as selected, while in the success screenshot, value 29, the pre-existing value is not a selected option value. I have seen this symptom repeatedly when examining the output when this condition occurs. In the UI screenshot, the "Description of Duties" label is showing an error style, despite the fact that the DDL is displaying the correct value.

    Please advise how this behavior could be eliminated. I have tried k-ng-delay on the options elsewhere in the codebase without success, and would prefer not to use primitives since it would require substantial modifications to the application, and this works already most of the time (and apparently always in Chrome).

     

    //Duty Description DDL configuration
    vm.dutyOptions = {
       dataValueField: "dynamicListID",
       dataTextField: "dynamicListValue",
       dataSource: new kendo.data.DataSource({
          type: "json",
          transport: {
             read:
                function (e) {
                   var listId = myConstants[0].dutyDescriptionListNameID;
                   itrsDataService.getDynamicListData(listId)
                      .then(function (data) {
                         e.success(data);
                      });
                }
          }
       }),
       optionLabel: " ",
       autoBind: true,
    };

     

    <div class="form-group" ng-class="{'has-error': insVM.form.dutyDescription.$invalid, 'required' : insVM.insurance.fundingSourceID === 1}">
    <label for="dutyDescription"
           class="col-sm-3 control-label">Description Of Duties
    </label>
    <div class="col-sm-7">
      <select kendo-drop-down-list
              name="dutyDescription"
              ng-required="insVM.insurance.fundingSourceID === 1"
              k-options="insVM.dutyOptions"
              ng-model="insVM.insurance.dutyDescription"
              style="width:100%" />
    <div class="help-block"
         ng-messages="insVM.form.dutyDescription.$error"
         ng-if="insVM.form.dutyDescription.$touched &&
            insVM.form.dutyDescription.$invalid">
         <div ng-messages-include="app/shared/validationMessages.html"></div>
    </div>
    </div>
    </div> 

  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3706 posts

    Posted 18 Jan Link to this post

    Hello Russell,

    The described issue is really strange. For some reason, the value of the underlying SELECT element causes a form errors. Could you try bind the SELECT without using Kendo widget? Thus we will be able sure that the problem is caused by the widget itself. If the issue appears only with Kendo widget, then we will need a repro demo. Thus we will be able to further investigate the erroneous behavior locally and find a resolution much faster.

    Looking forward to hearing from you.

    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. Russell
    Russell avatar
    8 posts
    Member since:
    Apr 2015

    Posted 20 Jan in reply to Georgi Krustev Link to this post

    Hello, thanks for your reply. As you can imagine from my problem description, it will probably be very difficult to create a repro version of the problem since it is a full-blown Enterprise application that only fails periodically in our TEST environment. Do you think any of the enhancements in the 2016 Q1 release could possibly have any affect on the performance?
Back to Top