mardi 6 août 2019

Disabled on buttons does not seem to take effect

I just started learning ember today. (Trying to do yoember.com) tutorial. Please excuse my newbie questions.

I'm experiencing some issues and I am not sure what I am doing wrong.

Issue:

  • Disabled does not work (it always enables the button)

What I am doing:

  • I have a contact page which has email, message and submit button.
  • I want to disable the button initially (When there is no email, message)

This is what I've done so far:

contact.hbs:

<h1>Contact Page</h1>
<form>
  <div class="form-group">
    <label for="exampleInputEmail1">Email address</label>
    
    <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
  </div>
  <div class="form-group">
    <label for="text">Text</label>
    <textarea type="textarea" class="form-control" id="text" placeholder="Text" rows="4" cols="50" value=></textarea>
  </div>
  <button disabled=  type="submit" class="btn btn-primary">Submit</button>
</form>

Contact.js

import Route from '@ember/routing/route';
import { match, not } from '@ember/object/computed';

export default Route.extend({
    emailAddress: '',
    message: '',
    isValid: match('emailAddress', /^.+@.+\..+$/),
    isDisabled: not('isValid'),

    actions: {
        submitButton () {
            alert(`Saving of the following email address is in progress:`);
        }
      }
});

Questions:

1) What am I doing wrong? Why is the button always enabled?

2) What is the difference when I do value=emailAddress vs value=




Aucun commentaire:

Enregistrer un commentaire