title: KnockoutJS Required / Disabled attributes not removed
body: <p>So I have a knockout prototype where you add inputs dynamically and then set each of their own settings. Think of its as a form builder is such. However, I noticed that disabled and required doesn't work that great. It sets the value to disabled or required but when I turn it into false it still remains on the element without its state, causing it to still function. Please can anyone help or give guidance. </p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div class="leftpanel"&gt;
                  &lt;div class="input-row" data-bind="foreach: inputItems"&gt;                 
                      &lt;div class="input-row-item"&gt;                
                          &lt;div class="input-item"&gt;    
                              &lt;label data-bind="text: label"&gt;&lt;/label&gt;                 
                              &lt;input data-bind="attr:{ name: name, placeholder: placeholder, disabled: disabled, value: value, type: type }"&gt;                 
                          &lt;/div&gt;
                          &lt;div class="input-settings"&gt;
                              &lt;input type="text" class="nb-remove" data-bind="value: label" placeholder="input label"&gt;
                              &lt;input type="text" value="text" class="nb-remove" data-bind="value: type" placeholder="input type"&gt;
                              &lt;input type="text" class="nb-remove" data-bind="value: name" placeholder="input name"&gt;
                              &lt;input type="text" class="nb-remove" data-bind="value: placeholder" placeholder="input placeholder"&gt;
                              &lt;input type="text" class="nb-remove" data-bind="value: disabled" placeholder="input disabled"&gt;
                              &lt;input type="text" class="nb-remove" data-bind="value: value" placeholder="input value"&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;                  
                  &lt;/div&gt;          
              &lt;/div&gt;
              &lt;div class="rightpanel"&gt;
                  Here be draggables!
                  &lt;br/&gt;
                  &lt;button data-bind="click: addInput"&gt;ADD TEXT INPUT&lt;/button&gt;
              &lt;/div&gt;
  </code></pre>
  
  <p>The JS</p>
  
  <pre><code>$(function(){
              var InputItem = function InputItem(label, type, name, placeholder, disabled, value) {
                  this.label          = ko.observable(label);
                  this.type           = ko.observable(type);
                  this.name           = ko.observable(name);
                  this.placeholder    = ko.observable(placeholder);
                  this.disabled       = ko.observable(disabled);
                  this.value          = ko.observable(value);
              }
  
              var ViewModel = function ViewModel() {
                var that = this;
  
                this.inputItems = ko.observableArray([]);
  
                this.addInput = function addInput() {
                  that.inputItems.push(new InputItem());
                };
  
              }
  
              ko.applyBindings(new ViewModel());
          });
  </code></pre>