表格提交不在angularJS?

时间:2016-05-10 15:21:40

标签: angularjs forms

我正在使用Ionic框架开发一个angularJS应用程序来进行布局设计。由于某种原因,我的表格没有提交。该函数应该提交用户名和密码并将其POST到在线PHP文件中。这是我的代码:

模板:

<ion-view title="Login">
    <ion-content overflow-scroll="true" padding="true" class="has-header">
<?php include '../lib/init.php'; ?>
        <form class="list validate" ng-submit="submit()">
          <input type="hidden" name="action" value="login">
            <ion-list>
                <label class="item item-input">
                    <span class="input-label">Username</span>
                    <input type="text" ng-model="username" name="username" placeholder="">
                </label>
                <label class="item item-input">
                    <span class="input-label">Password</span>
                    <input type="password" ng-model="password" name="password" placeholder="">
                </label>
            </ion-list>
            <div class="spacer" style="height: 40px;"></div>
            <button type="submit" id="login-button4" class="button button-royal  button-block">Log in</button>
            <a ui-sref="register" id="login-button5" class="button button-royal  button-block button-clear">Dont have an account?</a>
            <a ui-sref="forgotPassword" id="login-button6" class="button button-royal  button-block button-clear">Forgot password?</a>
        </form>
    </ion-content>
</ion-view>

控制器:

.controller('loginCtrl', function($scope, $state, $stateParams, $ionicPopup, $timeout) {

  //popup alert starts here
   $scope.showAlert = function(status,message) {
   var alertPopup = $ionicPopup.alert({
     title: status,
     template: message,
   });
 };
 //popup alert ends here


  $scope.submit = function() {
        if ($scope.username && $scope.password) {
          var url = 'my PHP file url';
          var username= $scope.username;
          var password= $scope.password;

          $scope.list = [];


          var dataString = 'username='+ username  + '&password=' + password;
          $scope.list.push(dataString);
          $scope.text = '';

          $http({
            type: "POST",
            url: url,
            data: dataString,
            success: function(data) {
            try 
            {
              alert(data);
            } 
            catch(e) 
            {
              alert(data);
            }   
            }
            });


        }
      };

})

路线:

  .state('login', {
    url: '/login.php',
    templateUrl: 'templates/login.php',
    controller: 'loginCtrl'
  })

有谁知道最近发生了什么?

1 个答案:

答案 0 :(得分:3)

试试这个:

<强> HTML

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/action_search"
        android:icon="@android:drawable/ic_menu_search"
        app:showAsAction="always|collapseActionView"
        app:actionViewClass="android.support.v7.widget.SearchView"
        android:title="@string/search_label"/>
</menu>

<强>的Javascript

<form class="list validate" ng-submit="submit(username, password)">