ブートストラップバリデータでSPPeoplePickerを検証する方法

Question

1000hz bootstrap-validatorでSPPeoplePickerコントロールを検証しようとしていますが、動作しないようです。誰かがそれを検証するのを助けることができますか？

HTML

<div id="myPicker" class="form-group has-feedback"> 
     <div class="col-xs-4"> 
      <label for="peoplePickerDiv" class="control-label">Username</label> 
      <div class="input-group"> 
       <span class="input-group-addon"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></span> 
       <div id="peoplePickerDiv"></div> 
      </div> 
      <span class="glyphicon form-control-feedback"></span> 
      <span class="help-block with-errors"></span> 
     </div> 
    </div> 

活字体：

は、ここに私のコードです

$('#peoplePickerDiv_TopSpan_HiddenInput').attr('data-user', 'user'); 
$('#aspnetForm').validator({ 

     custom: { 

      user: function ($el) { 

       var peoplePickerElement: SPClientPeoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict['peoplePickerDiv_TopSpan']; 
       var user: ISPClientPeoplePickerEntity[] = peoplePickerElement.GetAllUserInfo(); 

       if (user[0].IsResolved == true) { 

        $('myPicker').attr('has-success'); 
        return "IT WORKS"; 

       } 
       else if (user[0].IsResolved == false) { 

        $('myPicker').attr('has-danger'); 
        return "Invalid User"; 
       } 
      } 
     } 
    }); 
}); 

Answer 1

私はClientPickerを検証するためのカスタム関数を記述することによって私の目標をachievするために管理しました。ここでは、コードは次のようになります。

HTML：

<div id="myPicker" class="row has-feedback"> 
     <div class="col-xs-4"> 
      <label for="peoplePickerDiv" class="control-label">Username</label> 
      <div class="input-group"> 
       <span class="input-group-addon"><span class="glyphicon glyphicon-user" aria-hidden="true"></span></span> 
       <div id="peoplePickerDiv"></div> 
      </div> 
      <span id="ppFeedIcon"class="glyphicon form-control-feedback"></span> 
      <span id="ppFeedMsg" class="help-block with-errors"></span> 
     </div> 
    </div> 

活字体：

var peoplePickerElement: SPClientPeoplePicker = SPClientPeoplePicker.SPClientPeoplePickerDict['peoplePickerDiv_TopSpan']; 

    $('#myPicker').bind('DOMNodeInserted DOMNodeRemoved DOMSubtreeModified', function() { 

     if (peoplePickerElement.GetAllUserInfo().length == 0) { 
      $('#myPicker').removeClass('has-success').addClass('has-error'); 
      $('#ppFeedIcon').addClass("glyphicon-remove").removeClass("glyphicon-ok"); 
      $('#ppFeedMsg').html('Invalid user.'); 
     } 

     else if (peoplePickerElement.GetAllUserInfo().length > 0) { 
      $('#myPicker').addClass('has-success').removeClass('has-error'); 
      $('#ppFeedIcon').addClass("glyphicon-ok").removeClass("glyphicon-remove"); 
      $('#ppFeedMsg').html(""); 
     } 
    });