javascript - Call Knockout Validation Extender on Button Click -

i've been reading many questions ask how call knockout validation extender on button click event. answers come close answering question, involve workarounds using knockout-validate library. i'm not using knockout-validate library. want validate input field on button click event using validation rules defined in knockout extender.

for simplicity i'm going use required extender knockout documentation , apply simple use case. use case takes input , on button click event value user entered. or updates view show validation message if no value entered.

knockout code:

ko.extenders.required = function (target, overridemessage) {     target.haserror = ko.observable();     target.validationmessage = ko.observable();      function validate(value) {         target.haserror(value ? false : true);         target.validationmessage(value ? "" : overridemessage || 'value required');     }      return target; };  function myviewmodel() {     self = this;     self.userinput = ko.observable().extend({ required: 'please enter value' });      /**      * event handler button click event      */     self.processinput = function () {         //validate input field         //how call validate function in required extender?          //if passes validation, input value         dosomething(self.userinput());     }; } 

markup:

<input type="text" data-bind="value: userinput, valueupdate: 'afterkeydown'" /> <span data-bind="visible: userinput .haserror, text: userinput .validationmessage" class="text-red"></span> <button data-bind="click: processinput ">do something</button> 

how can trigger validation on button click event , show validation message if doesn't pass validation?

i believe looking @ example here - http://knockoutjs.com/documentation/extenders.html

you can not call validate directly, subscribe watches value , runs validate function on change , updates observable can check - haserror.

ko.extenders.required = function (target, overridemessage) {      target.haserror = ko.observable();      target.validationmessage = ko.observable();        function validate(value) {          target.haserror(value ? false : true);          target.validationmessage(value ? "" : overridemessage || 'value required');      }            //initial validation      validate(target());         //validate whenever value changes      target.subscribe(validate);         //return original observable      return target;  };    function myviewmodel() {      self = this;      self.userinput = ko.observable().extend({ required: 'please enter value' });        /**       * event handler button click event       */      self.processinput = function () {          if(self.userinput.haserror()){            console.log('has error');          }else{            console.log('no error');          }      };  }    // activates knockout.js  ko.applybindings(new myviewmodel());

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>  <input type="text" data-bind="value: userinput, valueupdate: 'afterkeydown'" />  <span data-bind="visible: userinput .haserror, text: userinput .validationmessage" class="text-red"></span>  <button data-bind="click: processinput ">do something</button>