2

I took sample code for the IonicPopup and I've modified the wifi password entry to be a username and password entry. It works as expected, but if you click the Login button without entering a username or password, all that happens is e.preventDefault().

Is there a way I can add an animation to the popup, perhaps a "shake" animation, if either field is left blank?

$scope.promptLogin = function() {

    $scope.data = {};

    // An elaborate, custom popup
    var myPopup = $ionicPopup.show({
        template: '<input type="text" placeholder="Username" ng-model="data.user"><br><input type="password" placeholder="Password" ng-model="data.pass">',
        title: 'Enter Credentials',
        subTitle: '',
        scope: $scope,
        buttons: [
        { text: 'Cancel' },
        {
            text: '<b>Login</b>',
            type: 'button-positive',
            onTap: function(e) {
            if (!$scope.data.user || !$scope.data.pass) {
                //don't allow the user to close unless he enters a user and pass
                e.preventDefault();
            } else {
                //console.log($scope.data.user + " - " + $scope.data.pass);
            }
            }
        }
        ]
    });

};
Chad
  • 1,531
  • 3
  • 20
  • 46
  • I'm having the same problem. Did you get the answer? – Ronald Araújo Aug 25 '15 at 15:23
  • Nope I moved on since this was more UX than functionality, might have to include some sort of animation library to shake the box. I've read many posts advising against including jQuery but I know the jQuery UI has a lot of animations, might have luck with that or something else... – Chad Aug 25 '15 at 16:26
  • But I have not found a way to do it natively with Ionic, which is a shame. – Chad Aug 25 '15 at 16:26
  • Thanks for the answer. – Ronald Araújo Aug 25 '15 at 16:41

0 Answers0