Is it possible to refresh the page when the submit button is clicked in AngularJS?

Question

Is it possible to refresh the page when the submit button is clicked in AngularJS?

Hey there! I'm currently working on an application using the MEAN stack with AngularJS for the front-end. Can anyone provide me with a solution on how to reload the page when clicking the submit button?

I've tried the following code snippet to achieve this:

Within the Controller:

sryarnpayment.$save(function(response) {
  $location.path('sryarnpayments/' + response._id, {}, { reload: true });

     $scope.name = '';
      }, function(errorResponse) {
        $scope.error = errorResponse.data.message;
     });
   };

In the HTML file:

<div class="controls">

      <input type="submit" class="btn btn-default">

  </div>

html css angularjs meanjs

Answer 1

Answer №1

Simply include the code onClick or Sumitform when clicking on a button.

onclick="window.location.reload()"

Answer 2

Simply include the code onClick or Sumitform when clicking on a button.

onclick="window.location.reload()"

Answer 3

Answer №2

Revise

$location.path('sryarnpayments/' + response._id, {}, { reload: true });

to

utilizing ui-router :

$state.go('STATE_NAME', { id: response._id});

or using ng-route :

$location.path('/sryarnpayments/' + response._id);

If you have defined a route (example provided below), the above changes should be effective.

Example - Route Definition

Utilizing ui-router :

$stateProvider
.state('STATE_NAME', {
  url: "/sryarnpayments/:id",
  templateUrl: "partials/myPage.html",
  controller: newController
})

Using ng-route :

config(['$routeProvider', function ($routeProvider) {
    $routeProvider.when('/sryarnpayments/:id', {
        templateUrl: 'path/myPage.html',
        controller: newController
    });
}]);

The parameter can then be accessed in newController as shown below:

For ui-router :

var id = $stateParams.id;

And for ng-route :

var id = $routeParams.id;

Answer 4

Revise

$location.path('sryarnpayments/' + response._id, {}, { reload: true });

to

utilizing ui-router :

$state.go('STATE_NAME', { id: response._id});

or using ng-route :

$location.path('/sryarnpayments/' + response._id);

If you have defined a route (example provided below), the above changes should be effective.

Example - Route Definition

Utilizing ui-router :

$stateProvider
.state('STATE_NAME', {
  url: "/sryarnpayments/:id",
  templateUrl: "partials/myPage.html",
  controller: newController
})

Using ng-route :

config(['$routeProvider', function ($routeProvider) {
    $routeProvider.when('/sryarnpayments/:id', {
        templateUrl: 'path/myPage.html',
        controller: newController
    });
}]);

The parameter can then be accessed in newController as shown below:

For ui-router :

var id = $stateParams.id;

And for ng-route :

var id = $routeParams.id;

Answer 5

Answer №3

If you want to redirect a page either on click or on submit, you can use the following code in your controller:

 app.controller('controller', function ($scope, $http, $window) {

$scope.method = function () {

    //Form Submission
        $http({
            method: 'POST',
            url: url,
            data: data,
        })
          .success(function (response) {
            if (response.status == true)
            {
                $window.location.href = base_url;
            }

        });
     };

    // For onClick:
      $scope.method = function() {
       $window.location.href = base_url;
     }
 });

Make sure to add the dependency $window in your controller.

This solution should assist you with redirecting pages as needed.

Answer 6

If you want to redirect a page either on click or on submit, you can use the following code in your controller:

 app.controller('controller', function ($scope, $http, $window) {

$scope.method = function () {

    //Form Submission
        $http({
            method: 'POST',
            url: url,
            data: data,
        })
          .success(function (response) {
            if (response.status == true)
            {
                $window.location.href = base_url;
            }

        });
     };

    // For onClick:
      $scope.method = function() {
       $window.location.href = base_url;
     }
 });

Make sure to add the dependency $window in your controller.

This solution should assist you with redirecting pages as needed.

Is it possible to refresh the page when the submit button is clicked in AngularJS?

Answer №1

Answer №2

Answer №3

Similar questions

Angular and Express: Automatically redirecting to the previous page after user login

Routes are not functioning properly on Ionic Angular

The transition effects between iOS5 and jquery-mobile can cause brief flickering

Ways to display Div contents based on selected options in an Angular 2/4 list

The requested command is not being recognized

Is it possible to precisely position multiple children in a relative manner?

Adjust the wait time for sliding on the jQuery rcarousel

Show inline-block elements within a div that has a variable width, allowing for horizontal scrolling

Creating multiple lines with kineticjs in a HTML5 environment can be a

Simple method to toggle visibility of forms using an AngularJS Button

The autocomplete selection box is not appearing correctly

Why isn't the show/hide feature in Jquery functioning properly?

code snippet for callback function in javascript

Tips for displaying HTML tags in a chatbot using JavaScript or jQuery

Is there a way to assign a unique scrollTop value for a specific scrollspy location?

What is the best way to conceal the outline in a popup window?

Replace the image source with a list of images

Reset all modifications made by jQuery animations before initializing a fresh animation

Switching between divs using buttons

AngularJS: ng-model not reflecting changes in entire object, only specific field within the object is being updated