CODEWITHSUNDEEP
asp.net-mvcasp.net-mvc-3asp.net-mvc-4viewcontroller
user964960
user964960

Reputation: 35

Prevent submitting of a form in asp.net mvc

I'm using MVC Http.BeginForm to create a search form.

Now I want to add create button, which opens Popup, but when I press it HttpPost event in controller fires up. How can I prevent HttpPost event to fire up when popup is pressed?

@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>  
}

Open function:

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());
        });
    };
};

And ModalDemoCtrl function:

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');
    };
};

Upvotes: 1

Views: 1070

Answers (1)

user1883184
user1883184

Reputation: 106

Change code from

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

To:

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

Upvotes: 3

Related Questions