Question

我想用ember控件编写一个javascript代码来控制密码并确认密码字段与javascript的帮助相匹配。如果有可能与emberjs请让我知道我试过这个，但它不与我的代码。

http://jsfiddle.net/8MRcS/12/

我不知道何时将此代码放入我的控件中，而不是在注册控件中无法正常工作，如果我把它放在app.js控制器中而不是它的wokring但我需要在注册代码中。

这是我的模板代码。

 <script type="text/x-handlebars" data-template-name="signup">

        <h2>Sign Up</h2>
        {{outlet}}

    <form {{action "submit" on="submit" }}>
        <!-- //This connects to the controller, using the user object -->


        <p><label>Name: {{input type="text" value=user.name required="true"}}</label></p>
        <p><label>Username: {{input type="text" value=user.username required="true"}}</label></p>
        <p><label>Password: {{input  value=user.password type="password" id="password" required="true"}}</label></p>

        <p><label>Confirm Password: {{input value=user.confirm type="password" id="confirm" required="true"}}</label></p>
        </br>

        <p><label>Email: {{input type="email" value=user.email required="true"}}</label></p>
        <p><label>Address: {{input type="text" value=user.address required="true"}}</label></p>
        <p><label>Age: {{input type="number" value=user.age required="true"}}</label></p>
        <button id="submit" {{bind-attr disabled="cannot_submit"}}>Submit form</button>
        <button {{action "clear"}}>Clear</button>
        <p></p>
        <button> {{#link-to 'login'}}Already member{{/link-to}}</button>
    </form>

    {{message}}
</script>

注册控制器代码。

App.SignupController = Ember.ObjectController.extend({

    // User is the model used for binding the view and the controller
    // If you look at the view, you will see user.username, and user.password being
    // used as input values
    // BTW this is a JavaScript object, (i.e in JSON)

    user: {
        //These values are just place holders for the moment
        name: "",
        username: "",
        email: "",
        address: "",
        age: "",
        password: "",
        confirm: "",

    },



    // The functions called when and event is triggered from the view (i.e button click)
    actions: {
        // Action called when form is submitted, refer to form action attribute in view
        submit: function() {

            var self = this;
            var submitUser = {};

            submitUser.name = self.user.name;
            submitUser.username = self.user.username;
            submitUser.password = self.user.password;
            submitUser.cpassword = self.user.confirm;
            submitUser.email = self.user.email;
            submitUser.address = self.user.address;
            submitUser.age = self.user.age;



            // This is the API call to the web services, it uses the user (this.user) to send 
            // the login info, and recives either the logged in user info, or an error

                console.debug(this.user);
                console.debug(this.submitUser);


            $.post("http://herukoapp.com/users", JSON.stringify(this.user), function(data,status){
                data = JSON.parse(data);


                console.debug(data);
            });
        },

        // Called when the clear button is clicked, see button tag in view
        clear: function() {
            this.set('user.name', "");
            this.set('user.username', "");
            this.set('user.password', "");
            this.set('user.confirm', "");
            this.set('user.email', "");
            this.set('user.address', "");
            this.set('user.age', "");


        }
    },


});

Answer 1

您可以使用computed property来跟踪user.password和user.confirm是否相同。

在Coffeescript中：

confirmSame: (->
    password = @get('user.password')
    confirm = @get('user.confirm')

    if password == confirm
        return true
    else
        return false
).property('user.password', 'user.confirm')

或者常规javascript（我认为）：

confirmSame: function() {
    password = this.get('user.password')
    confirm = this.get('user.confirm')
    if password == confirm
        return true
    else
        return false
}.property('user.password', 'user.confirm')

您可以在模板中使用此条件：

{{#if confirmSame))
    <div>Password and Confirm Password are the same</div>
{{else}}
    <div>Password and Confirm Password are not the same</div>
{{/if}}

在提交操作中，您可以检查confirmSame是真还是假：

CoffeeScript的：

if @get('confirmSame')
    # do submit stuff

或者在javascript（我认为）中：

if (this.get('confirmSame') == true)
    // do submit stuff

使用ember js的javascript代码（密码确认密码匹配字段与emberjs）

1 个答案: