angularjsangularjs-ng-modelng-submittrumbowyg

Textarea with ng-model is not submitting when using wysiwyg


I tried to make a form using ng-submit. In the form there's a textarea that call wysiwyg (it's trumbowyg). When submit it, all form data are submitted but that textarea.

<div ng-controller='contactCtrl'>
   <form id="inquiryForm" ng-submit="contact()">
   <div class="form-group">
      <label>Name</label>
      <input type="text" ng-model="formData.name" name="name" class="form-control" required="" />
   </div>
   <div class="form-group">
      <label>Email</label>
      <input type="text" ng-model="formData.email" name="email" class="form-control" required="" />
   </div>
   <div class="form-group">
      <label>Message</label>
      <textarea ng-model="formData.message" name="message" class="form-control editor" required=""></textarea>
   </div>
   <button type="submit" class="btn btn-success">Submit</button>
</form>

In app.js

.controller('contactCtrl', function ($scope, $http) {
   $scope.formData = {};
      $scope.contact = function (){
      console.log($scope.formData);
   }
}

As you see, I call trumbowyg by editor class in textarea. When the form is submitted, textarea is not sent while other are. When I remove editor from the class, it's working well. Why is it not submitted when using trumbowyg?


Solution

  • trumbowyg is updating your html out side the scope of angularJs so use some plugin in like

    github.com/lizardK/trumbowyg-ng

    so that angularJs knows what changes have been done to your Html.