javascript - Laravel Form Validation using Ajax and Bootstrap Modal issue -

i' got bootstrap modal allow user update password :

    <div class="modal fade" id="settingmodal">     <div class="modal-dialog">         <div class="modal-content">             <div class="modal-header">                 <button type="button" class="close" data-dismiss="modal" aria-label="close"><span aria-hidden="true">&times;</span></button>                 <h4 class="modal-title">change password</h4>             </div>             {!! form::open(array('url' => '/users/updatepassword', 'method' => 'post', 'id'=>'passupdate')) !!}             <div class="modal-body">                 @if(session::has('error'))                     <div class="alert-box success">                         <h2>{{ session::get('error') }}</h2>                     </div>                 @endif                  <div id="password-group" class="form-group has-feedback @if ($errors->has('password')) has-error @endif">                     {!! form::password('password', array('id'=>'password', 'class' => 'text input form-control', 'placeholder'=>'new password')) !!}                     <span class="glyphicon glyphicon-lock form-control-feedback @if ($errors->has('password')) has-error @endif"></span>                     @if ($errors->has('password')) <p class="help-block">{{ $errors->first('password') }}</p> @endif                     <div id ="password_error"></div>                 </div>                  <div id="password_confirmation-group" class="form-group has-feedback @if ($errors->has('password_confirmation')) has-error @endif">                     {!! form::password('password_confirmation', array('id'=>'password_confirmation', 'class' => 'text input form-control', 'placeholder'=>'confirm new password')) !!}                     <span class="glyphicon glyphicon-lock form-control-feedback @if ($errors->has('password_confirmation')) has-error @endif"></span>                     @if ($errors->has('password_confirmation')) <p class="help-block">{{ $errors->first('password_confirmation') }}</p> @endif                     <div id ="password_confirm_error"></div>                 </div>             </div>              <div class="modal-footer clearfix">                 <button type="button" class=" pull-left btn btn-default btn-flat" data-dismiss="modal">close</button>                 {!! form::submit('submit', array('class'=>' pull-right btn btn-primary btn-flat'))!!}             </div>             {!! form::close()!!}          </div><!-- /.modal-content -->     </div><!-- /.modal-dialog --> </div><!-- /.modal --> 

this js code :

<script type="text/javascript">  $('#passupdate').submit(function(e){     var $form = $(this);      e.preventdefault(); //keeps form behaving normal (non-ajax) html form     var url = $form.attr('action');     var formdata = {};     //submit post request form data     $form.find(':input').each(function()     {         formdata[ $(this).attr('name') ] = $(this).val();         console.log($(this).val());     });     console.log('before submit');     //submits array of key-value pairs form's action url     $.post(url, formdata, function(response) {         //handle successful validation         console.log("success");     }).fail(function(response) {         //handle failed validation         console.log("failed");         associate_errors(response['errors'], $form);     });  });  function associate_errors(errors, $form) {     //remove existing error classes , error messages form groups     $form.find('.form-group').removeclass('has-errors').find('.help-text').text('');     errors.foreach(function(value, index)     {         //find each form group, given unique id based on form field's name         var $group = $form.find('#' + index + '-group');          //add error class , set error text         $group.addclass('has-errors').find('.help-text').text(value);     } } 

and here's part of laravel controller :

    $validator = validator::make($data, $rules);     if ($validator->fails()){         // if validation fails redirect login.         return response::json(array(             'fail' => true,             'errors' => $validator->getmessagebag()->toarray()         ));     } 

so got issue :

• in firebug console : syntaxerror: missing ) after argument list } : in last line of js code
• also js function $('#passupdate').submit never called.

nb laravel returning json response correctly.

update i've fixed the first part of issue, form submitted , json response recived form validation doesn't work, error not shown on modal.

you missed ) of foreach:

function associate_errors(errors, $form) {     //remove existing error classes , error messages form groups     $form.find('.form-group').removeclass('has-errors').find('.help-text').text('');     errors.foreach(function (value, index) {         //find each form group, given unique id based on form field's name         var $group = $form.find('#' + index + '-group');          //add error class , set error text         $group.addclass('has-errors').find('.help-text').text(value);     }); } 

note second last line above.

});