提交表单

Question

我有一个网站根据表单提交向地图添加标记。提交表单后，标记在用户刷新页面之前不会显示。因此，我试图这样做，以便在点击提交时，页面自动刷新。有很多这样的问题，但都包括PHP，我不知道如何将它们应用到我的代码中。这是我目前的情况：

（1）提交表格js文件时

function mainController($scope, $http) {
  $scope.formData = {};

  $http.get('/api/events')
    .success(function(data) {
      $scope.events = data;
      initMap(data);
      for(i = 0; i < data.length; i++){
        console.log(data[i].eventLocation);
      }
    })
    .error(function(data) {
      console.log('Error: ' + data);
    });

  // when submitting the add form, send the text to the node API
  $scope.createEvent = function() {
    $http.post('/api/events', $scope.formData)
      .success(function(data) {
        $scope.formData = {}; // clear the form so our user is ready to enter another
        $scope.events = data;
        console.log(data);
      })
      .error(function(data) {
        console.log('Error: ' + data);
      });
  };

  $scope.validateForm = function() { 
    if (!$scope.formData.eventName) {
      alert("Please give your event a name!");
      return false;
    }
    else if (!$scope.formData.eventType) {
      alert("Please choose an event type!");
      return false;
    }
    else if (!$scope.formData.eventLocation) {
      alert("Please choose a location!");
      return false;
    }
    else if (!$scope.formData.eventDetails) {
      alert("Please include some details about your event!");
      return false;
    }
    return true;
  }
}

（2）我的表格html文件

<!-- Event form -->
            <div class="col-lg-6">
              <!-- Validate form -->
              <form name="myForm" ng-submit="validateForm()">
               <div class="form-group">
                  <label>Event Name</label>
                  <input type="text" name="inputName" class="form-control" ng-model="formData.eventName" placeholder="Event name">
                </div>
                 <div class="form-group">
                   <label>Type</label>
                   <select class="form-control" id="inputType" ng-model="formData.eventType">
                     <option>Option 1</option>
                     <option>Option 2</option>
                     <option>Option 3</option>
                   </select>
                 </div>
                 <div class="form-group">
                   <label>Location</label>
                   <select class="form-control" id="inputLocation" ng-model="formData.eventLocation">
                     <option>Location 1</option>
                     <option>Location 2</option>
                     <option>Location 3</option>
                   </select>
                 </div>
                 <div class="form-group">
                   <label>Event Details</label>
                   <textarea class="form-control" name="inputDetails" ng-model="formData.eventDetails" rows="2" placeholder="Add details about your event"></textarea>
                 </div>
                <div class="text-center">
                  <button id="add-event"type="submit" class="btn btn-primary"  ng-click="createEvent()">Submit</button>
                </div>
              </form>

Answer 1

@MasNotsram的回答是正确的。在我的HTML文件的控制器中，我添加了行窗口位置，我在处理发布引脚到地图的函数之后添加了以下行。

＆＃13;

＆＃13;

location.href = "http://__DESIRED_WEB_PAGE_REFRESH__";

＆＃13;

＆＃13;

＆＃13;

以下是控制器的结果：

＆＃13;

＆＃13;

function mainController($scope, $http) {
  $scope.formData = {};

  $http.get('/api/events')
    .success(function(data) {
      $scope.events = data;
      initMap(data);
      for(i = 0; i < data.length; i++){
        console.log(data[i].eventLocation);
        //placeMarker(data[i]);
        //test(data);
      }
      //placeMarker(data);
    })
    .error(function(data) {
      console.log('Error: ' + data);
    });

  // when submitting the add form, send the text to the node API
  $scope.createEvent = function() {
    $http.post('/api/events', $scope.formData)
      .success(function(data) {
        $scope.formData = {}; // clear the form so our user is ready to enter another
        $scope.events = data;
        console.log(data);
      })
      .error(function(data) {
        console.log('Error: ' + data);

      });
      // SOLUTION LINE
      location.href = "http://__DESIRED_WEB_PAGE_REFRESH__";
  };

  $scope.validateForm = function() { 
    if (!$scope.formData.eventName) {
      alert("Please give your event a name!");
      return false;
    }
    else if (!$scope.formData.eventType) {
      alert("Please choose an event type!");
      return false;
    }
    else if (!$scope.formData.eventLocation) {
      alert("Please choose a location!");
      return false;
    }
    else if (!$scope.formData.eventDetails) {
      alert("Please include some details about your event!");
      return false;
    }
    return true;
  }
}

＆＃13;

＆＃13;

＆＃13;