login

login widget provides a user-friendly login interface for entering username, password and remember me. The login widget has social login links apart from traditional login interface.

  • Extends Observable

    • Syntax 

    <div data-juci="login" data-options="social: ['Facebook', 'Twitter']"></div>

    Attributes

    • data-juci {String}
      A string with value login.
    • data-options {Object} 
      data-options="social: ['Facebook', 'Twitter']"
      • showRememberMe {Boolean}
        false to hide the remember me checkbox.
      • showUsername {Boolean}
        false to hide the username control.
      • usernameLabel {String}
        Label for the username control.
      • usernamePlaceholder {String}
        Placeholder for the username control.
      • isEmail {String}
        If the username control is email or not. Default it is true.
      • passwordPlaceholder {String}
        Placeholder for the password control.
      • showPassword {Boolean}
        false to hide the password control.
      • rememberMeLabel {String}
        Label for the remember me checkbox
      • passwordLabel {String}
        Label for the password control.
      • loginLabel {String}
        Label for the login widget.
      • social {Array}
        Array of strings of social links.
      • forgotPassword {Boolean}
        true to enable forgot password button for the password control.

    Methods

    • reset()
      Resets the login widget to its original state.

    Events

    • forgotpassword()
      Fires when user taps on the forgot password button.
    • login(eventObj) Cancellable
      Fires when login is clicked with non-empty values for username and password.
      Parameters:
      • eventObj{EventObject}
        • password{String}
          Value of the password control.
        • rememberMe{Boolean}
          Value of the remember me checkbox.
        • username{String}
          Value of the username control.
    • passwordchange(eventObj)
      Fires when the password control is changed.
      Parameters:
      • eventObj{EventObject}
        • value
          {String} Value of the password control.
    • passwordempty(eventObj) Cancellable
      Fires when login is clicked with empty password. Default action sets a flag on the password control.
      Parameters:
      • eventObj{EventObject}
        • password{String}
          Value of the password control.
        • rememberMe{Boolean}
          Value of the remember me checkbox.
        • username{String}
          Value of the username control.
    • remembermechange(eventObj)
      Fires when the remember me checkbox is changed.
      Parameters:
      • eventObj{EventObject}
        • value
          {Boolean} Value of the remember me checkbox.
    • socialclick(eventObj)
      Fires when a social link is clicked.
      Parameters:
      • eventObj{EventObject}
        • social
          {String} The social link clicked.
    • usernamechange(eventObj)
      Fires when the username control is changed.
      Parameters:
      • eventObj{EventObject}
        • value
          {String} Value of the username control.
    • usernameempty(eventObj) Cancellable
      Fires when login is clicked with empty username. Default action sets a flag on the username control.
      Parameters:
      • eventObj{EventObject}
        • password{String}
          Value of the password control.
        • rememberMe{Boolean}
          Value of the remember me checkbox.
        • username{String}
          Value of the username control.