AngularJS ajax form submit with submit input

У меня есть форма, которая имеет степенного мастера. Для работы stepy wizard необходимо использовать кнопку ввода отправки, а не кнопку. Так что я использую кнопку отправки, но при нажатии кнопки отправки она перенаправление на главную страницу. Мой кодAngularJS ajax form submit with submit input

<form action="#" id="wizard" class="form-horizontal" ng-submit="abc($event)"> 
    <!-- Step 1 --> 
    <fieldset title="Step 1"> 
     <legend>Registration</legend> 
     <div class="form-group"> 
     <label for="" class="col-md-2 control-label"><?php echo $this->lang->line('label_house_number'); ?></label> 
     <div class="col-md-3"><input type="text" class="form-control" required="required" ng-model="newItem.housenumber"/></div> 
     <label for="" class="col-md-2 control-label"><?php echo $this->lang->line('label_house_name'); ?></label> 
     <div class="col-md-3"><input type="text" class="form-control" required="required" ng-model="newItem.housename"/></div> 
     </div> 
    </fieldset> 
    <fieldset title="Step 2"> 
     <legend>Registration</legend> 
     <div class="form-group"> 
     <label for="" class="col-md-2 control-label"><?php echo $this->lang->line('label_place'); ?></label> 
     <div class="col-md-3"><input type="text" class="form-control" required="required" ng-model="newItem.place"/></div> 
     <label for="" class="col-md-2 control-label"><?php echo $this->lang->line('label_land_mark'); ?></label> 
     <div class="col-md-3"><input type="text" class="form-control" ng-model="newItem.language"/></div> 
    </fieldset> 
    <fieldset title="Step 3"> 
     <legend><?php echo $this->lang->line('label_fac'); ?></legend> 
     <div class="form-group"> 
     <label class="col-sm-3 control-label"></label> 
     <div class="col-sm-6"> 
      <label class="radio-inline"> 
      <input type="checkbox" ng-model="newItem.electricity" value="electricity" /><?php echo $this->lang->line('label_electricty'); ?> 
      </label> 
     </div> 
     </div> 
    </fieldset> 
    <fieldset title="Step 4"> 
     <legend>Agriculture</legend> 
     <div class="form-group"> 
     <label class="col-sm-3 control-label"></label> 
     <div class="col-sm-6"> 
      <label class="radio-inline"> 
      <input type="checkbox" ng-model="newItem.cocunut" value="cocunut" /><?php echo $this->lang->line('label_cocunut'); ?> 
      </label> 
     </div> 
     </div> 
    </fieldset> 
    <fieldset title="Step 5"> 
     <legend> Other</legend> 
     <div class="form-group"> 
     <label for="" class="col-md-2 control-label"><?php echo $this->lang->line('label_get_any_help'); ?></label> 
     <div class="col-md-3"><input type="text" class="form-control" ng-model="newItem.help"/></div> 
     <label for="" class="col-md-2 control-label"><?php echo $this->lang->line('label_source'); ?></label> 
     <div class="col-md-3"><input type="text" class="form-control" ng-model="newItem.source"/></div> 
     </div> 
    </fieldset> 
    <input type="submit" class="finish btn-success btn" value="Submit"/> 
</form>

и это мой контроллер

mahalPlus.controller('familyRegistrationController', function($scope) { 

    $scope.abc = function(event){ 
    event.preventDefault(); 
    alert('submitted'); 
    }; 

});

источник

2014-01-26 Nisham Mahsin

Верите вы можете просто удалить действие на форме.

источник

2014-01-26 06:45:15 shaunhusain

Теперь форма не перенаправляется. Но предупреждение тоже не работает ..! Любая идея? –

Вы добавили ссылку на контроллер в свой тег формы?

<form id="wizard" class="form-horizontal" ng-submit="abc($event)" 
ng-controller="familyRegistrationController">

источник

2014-01-26 07:08:34 Jay

Да, у меня это в самом теле html –

, пожалуйста, напишите полный код, в противном случае его очень сложно ответить вопрос. – Jay

Я использую маршрутизацию для своего приложения .when ('/ family-registration', {templateUrl: 'api/index.php/templates/family_registr ation ', controller:' familyRegistrationController '}), и у меня есть функция, определенная внутри контроллера. Все работает, кроме этого. –

preventDefault является излишним, см the docs. Вам просто нужно удалить атрибут action.

Кроме того, он предотвращает действие по умолчанию (которое для формы означает отправку запроса на сервер и перезагрузку текущей страницы), но только в том случае, если форма не содержит атрибута действия.

Вместо этого добавьте ng-app в соответствующий элемент HTML и убедитесь, что ваш контроллер правильно загружен.

Я создал рабочий пример here, где вы можете увидеть изменения, которые я предложил.

источник

2014-01-26 07:10:53 SomeKittens

Я использую маршрутизацию для своего приложения, '.when ('/ family-registration', { templateUrl: 'api/index.php/templates/family_registration', Контроллер: 'familyRegistrationController' })' 'и я имеют функцию, определенную внутри контроллера. Все работает, кроме этого. –

1- удалить действие

2- удалить $ событие от нг подать = "ABC ($ событий)"

3- Лучше думать о вашем использовании PHP в тегах, это не Хорошая идея :(

источник

2014-06-10 16:36:17 Milad

AngularJS ajax form submit with submit input

ответ

Смежные вопросы