http post不会调用ASP.NET MVC动作

时间:2015-04-05 23:40:14

标签: angularjs

我是棱角分明的新手。我试图将表单数据传递给操作,但它不起作用,它不会给我任何错误。请帮帮我。

下面是我的js文件

var aboutmeApp = angular.module('aboutmeApp', ['ui.router']);

var configFunction = function ($stateProvider, $httpProvider, $locationProvider) {
    $locationProvider.hashPrefix('!').html5Mode(true);

    $stateProvider
    .state('Default', {
        url: '/',
        views: {
                "aboutmeview": {
                templateUrl: 'Home/Home'
            }
        }
    })
    .state('Home', {
        url: '/Home',
        views: {
            "aboutmeview": {
                templateUrl:'/Home/Home'
            }
        }
    })

    .state('About', {
        url: '/About',
        views: {
            "aboutmeview": {
                templateUrl: '/Home/About'
            }
        }
    })
    .state('CV', {
        url: '/CV',
        views: {
            "aboutmeview": {
                templateUrl: '/Home/CV'
            }
        }
    })
    .state('Projects', {
        url: '/Projects',
        views: {
            "aboutmeview": {
                templateUrl: '/Home/Projects'
            }
        }
    })
    .state('Blog', {
        url: '/Blog',
        views: {
            "aboutmeview": {
                templateUrl: '/Home/Blog'
            }
        }
    })
     .state('Contact', {
         url: '/Contact',
         views: {
             "aboutmeview": {
                 templateUrl: '/Home/Contact'
             }
         }
     });

}
configFunction.$inject = ['$stateProvider', '$httpProvider', '$locationProvider'];
aboutmeApp.config(configFunction);

aboutmeApp.controller("ContactController", function ($scope,$http) {

    $scope.alphabet = /^[A-z]+$/;

   // $scope.emailaddress = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;

    $scope.submitForm = function () {
debugger
        // check to make sure the form is completely valid
        $http({
            method: "POST",
            headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
            url: "/Home/Sendmail"


        });



    };

});

cshtml文件

html

<--form name="myForm"  ng-controller="ContactController" ng-class="{true:'error'}[submitted]" ng-submit="submitForm()">

        <p class=" username">
            <input type="text" name="user" ng-model="user" placeholder="NAME" required ng-pattern="alphabet" oninvalid="this.setCustomValidity('Please Enter UserName')" oninput="setCustomValidity('')" />
            <label for="name">Name</label>
            <span style="color:red" ng-show="myForm.user.$dirty && myForm.user.$invalid">
                <span ng-show="myForm.user.$error.required">Username is required.</span>
            </span>
            <span style="color:red" class="error" ng-show="myForm.user.$error.pattern">
                Alphabets only
            </span>
        </p><br />

        <p class="mails">
            <input type="email" name="email" id="email" ng-model="email" placeholder="EMAIL" required oninvalid="this.setCustomValidity('Please Enter Email')" oninput="setCustomValidity('')" style="background-color:white" />
            <label for="mails">Email</label>
            <span style="color:red" ng-show="myForm.email.$dirty && myForm.email.$invalid">
                <span ng-show="myForm.email.$error.required">Email is required.</span>
                <span ng-show="myForm.email.$error.email">Invalid email address.</span>
            </span>
        </p><br />

        <p class="web">
            <input type="text" name="web" id="web" placeholder="SUBJECT" />
            <label for="web">Subject</label>
        </p><br />

        <p class="text">
            <textarea name="text" placeholder="WRITE SOMETHING TO ME" />
        </p><br />

        <p class="submit">
            <input type="submit" value="Send" ng-click="submitted=true" />
        </p>



    </form>

1 个答案:

答案 0 :(得分:1)

您没有将任何数据传递给您的帖子操作,只是通过帖子传递它。为了更好的代码,我将创建一个模型对象,它将保存表单的所有值,并将其发布到服务器端动作。

<强> HTML

<form name="myForm" ng-controller="ContactController" ng-class="{true:'error'}[submitted]" ng-submit="submitForm(model)">
    <p class=" username">
        <input type="text" name="user" ng-model="model.user" placeholder="NAME" required ng-pattern="alphabet" oninvalid="this.setCustomValidity('Please Enter UserName')" oninput="setCustomValidity('')" />
        <label for="name">Name</label>
        <span style="color:red" ng-show="myForm.user.$dirty && myForm.user.$invalid">
                <span ng-show="myForm.user.$error.required">Username is required.</span>
        </span>
        <span style="color:red" class="error" ng-show="myForm.user.$error.pattern">
                Alphabets only
            </span>
    </p>
    <br />
    <p class="mails">
        <input type="email" name="email" id="email" ng-model="model.email" placeholder="EMAIL" required oninvalid="this.setCustomValidity('Please Enter Email')" oninput="setCustomValidity('')" style="background-color:white" />
        <label for="mails">Email</label>
        <span style="color:red" ng-show="myForm.email.$dirty && myForm.email.$invalid">
                <span ng-show="myForm.email.$error.required">Email is required.</span>
        <span ng-show="myForm.email.$error.email">Invalid email address.</span>
        </span>
    </p>
    <br />

    <p class="web">
        <input type="text" name="model.web" id="web" placeholder="SUBJECT" />
        <label for="web">Subject</label>
    </p>
    <br />

    <p class="text">
        <textarea name="text" ng-model="model.comment" placeholder="WRITE SOMETHING TO ME" />
    </p>
    <br />

    <p class="submit">
        <input type="submit" value="Send" ng-click="submitted=true" />
    </p>

</form>

<强>代码

aboutmeApp.controller("ContactController", function($scope, $http) {
    $scope.alphabet = /^[A-z]+$/;
    $scope.model = {};
    // $scope.emailaddress = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$/;
    $scope.submitForm = function(mdoel) {
        // check to make sure the form is completely valid
        $http({
            method: "POST",
            headers: {
                'Content-Type': 'application/x-www-form-urlencoded'
            },
            url: "/Home/Sendmail",
            data: {
                mdoel: mdoel
            }
        });
    };
});