2016-05-25 5 views
0

Я пытаюсь создать контактную форму, в которой кнопка «Отправить» отключена, если не введено действительное письмо и сообщение. По какой-то причине он работает обратным образом, когда действительный адрес электронной почты и сообщение введено, кнопка отключается. Я новичок в ember и can not, кажется, отрицает это.отключить кнопку отправки, когда два условия не выполняются в ember.js

Контакт контроллер

export default Ember.Controller.extend({ 

email: '', 

message: '', 

hasValidEmailAddress: Ember.computed.match('email', /^[email protected]+\..+$/), 
hasEnteredMessage: Ember.computed.notEmpty('message'), 

isDisabled: Ember.computed.and('hasValidEmailAddress', 'hasEnteredMessage'), 

actions: { 

    saveMessage() { 
     this.set('responseMessage', `Thank you, your message has been sent. We will get back to you as soon as possible.`); 
     this.set('email', ''); 
     this.set('message', ''); 
    } 
} 

}); 

Контакт Шаблон

<div class='row'> 

    <h2>Contact</h2> 

    <div class='col-md-2'></div> 
    <div class='col-md-8'> 

     <br/><br/> 

     <form> 
      <div class='form-group form-group'> 
       <label for='email' class=''>Email</label> 
       {{input type='email' value=email class='form-control' id='email' placeholder='Email'}} 
      </div> 
      <br/> 
      <div class='form-group form-group'> 
       <label for='message'>Message</label> 
       {{textarea value=message class='form-control' id='message' placeholder='Message'}} 
      </div> 
      <br/> 
      <button class='btn btn-primary btn-default pull-right' disabled={{isDisabled}} {{action 'saveMessage'}}>Send</button> 
     </form> 

    </div> 
</div> 

Я попытался отрицая isDisabled в шаблоне, отрицая аргументы в контроллере как внутри, так и вне скобки для isDisabled и попытался n включая всю линию.

Любая помощь будет высоко оценена.

Приветствия

ответ

1

В вашем коде isDisabled свойство на самом деле следует назвать IsEnabled, так вот и результат вы даете его. Потому что когда hasValidEmailAddress = true И hasEnteredMessage = true => isDisabled = true, который затем отключит вашу кнопку.

Вы можете сделать другое вычисленное свойство, сделать reallyDisabled: Ember.computed.not('isDisabled') и использовать его в своем шаблоне.

Или вы можете установить уголек-истина-хелперы аддон (https://github.com/jmurphyau/ember-truth-helpers), а затем в вас шаблон сделать disabled={{not isDisabled}}

Смежные вопросы