防止在asp.net mvc中提交表单

时间:2014-07-03 08:07:49

标签: asp.net-mvc asp.net-mvc-3 asp.net-mvc-4 view controller

我正在使用MVC Http.BeginForm来创建搜索表单。

现在我想添加创建按钮,它会打开Popup,但是当我按下它时,控制器中的HttpPost事件会激活。如何在按下弹出窗口时阻止HttpPost事件触发?

@using (Html.BeginForm())
{
    <table border="0">
        <tr>
            <td style="padding: 5px;">A:</td>
            <td style="padding: 5px;">@Html.TextBox("slicplate", "", new { style="width:120px; height:25px;" })</td>
            <td style="padding: 5px;">B:</td>
            <td style="padding: 5px;">@Html.TextBox("smodelis", "", new { style="width:120px; height:25px;" })</td>
            <td style="padding: 5px;">C:</td>
            <td style="padding: 5px;">@Html.TextBox("suzsakovas", "", new { style = "width:120px; height:25px;" })</td>
            <td style="padding: 5px;">D:</td>
            <td style="padding: 5px;">@Html.TextBox("svairuotojas", "", new { style = "width:120px; height:25px;" })</td>

            <td style="padding: 5px;" rowspan="3" valign="top"><input type="submit" value="Search" style="height:59px;" /></td>
            <td style="padding: 5px;" rowspan="3">
                <button class="btn btn-primary" style="height:50px; width:100px;" ng-click="open('new_tp')">Popup button</button>
            </td>
        </tr>            
    </table>  
}

打开功能:

var ModalDemoCtrl = function ($scope, $modal, $log) {

    $scope.items = ['item1', 'item2', 'item3'];
    $scope.open = function (size, id) {
        var modalInstance 
        if (size == "new_tp") {
            modalInstance = $modal.open({

                templateUrl: '/Transport/Create',
                controller: ModalInstanceCtrl,
                size: size,
                resolve: {
                    items: function () {
                        return $scope.items;
                    }
                }

            });
        }
        modalInstance.result.then(function (selectedItem) {
           $scope.selected = selectedItem;
        }, function () {
            $log.info('Modal dismissed at: ' + new Date());
        });
    };
};

和ModalDemoCtrl功能:

var ModalInstanceCtrl = function ($scope, $modalInstance, items) {
    $scope.items = items;
    $scope.selected = {
        item: $scope.items[0]
    };
    $scope.ok = function () {
        $('.modal-dialog').close;
        $modalInstance.close($scope.selected.item);
    };
    $scope.delete = function (id) {
        $('.modal-dialog').close;
        $modalInstance.close($scope.selected.item);
    };
    $scope.cancel = function () {
        $modalInstance.dismiss('cancel');
    };
};

1 个答案:

答案 0 :(得分:3)

更改代码
<button class="btn btn-primary" style="height:50px; width:100px;" ng-click="open('new_tp')">Popup button</button>

要:

<button class="btn btn-primary" type="button" style="height:50px; width:100px;" ng-click="open('new_tp')">Popup button</button>