How to use ajax in laravel

PHP
1

I have a form that I would like a user to fill but during the filling of the form I want to populate some fields with data from the database .When a user clicks the select drop down and select something the select is suppose to trigger the ajax to call a control and populate part of the form.I have written this in straight php and it works now I want to translate it to laravel syntax here is my code so far tell me when you spot some thing wrong or out of the ordinary. code on the controller

public function getDriverNamePicture()
{ 

  if(isset($_POST['get_option']))
 { 

 $state = $_POST['get_option'];
 $sql = DB::table('driver')
        ->select('drvname')
        ->where('code', $state)
        ->first()
        ->drvname;
        $new_string = explode('', $sql);

 exit;
  }
 return Response::json( $sql);
}

code on the route

Route::post('spotCheck', 'SpotCheckController@getDriverNamePicture');

code on the blade

//the script

        <script type="text/javascript">

        function fetch_select(val)
         {
          $.ajax({
          type: 'post',
           url: 'spotCheck',
            data: {
              get_option:val
              },
                 success: function (response) {
               document.getElementById("new_select").innerHTML=response; 
                   }
                });
            }

                 </script>

//the html

                   {!! Form::Open(['url'=>'spotCheck','files' => true]) !!}
                                 {{ csrf_field() }}
                                <div class="form-group">
                                       <div class="row">
                                       <div class="col-xs-8">
                                        {!! Form::label ('Call Sign:',null, ['class'=>"control-label"])!!}
                                        {!! Form::select('call_sign', $drive, null, ['class' => 'form-control' , 'id' => 'sel','onchange' =>                        'fetch_select(this.value);' ]) !!}
                                        </div> 
                                           <div class="col-md-4">
                                          <label class="control-label">Picture</label>
                                                 <img src="Koala.jpg" alt="with responsive image feature" class="img-responsive img-circle">
                                        </div>
                                     </div>
                                        <div class="row">
                               <div class="col-xs-8">
                                 <label class="control-label">Start Time</label>
                                 <input type="text" class="form-control" name="stime" required />
                             </div> 
                                  </div>
                                   </div>
                                  <div class="form-group">
                                   <div class="row">
                                    <div class="col-xs-8">
                                      <label class="control-label">Driver First Name</label>
                                         <input type="text" class="form-control" name="First_Name" id="new_select" />
                                          </div> 
                                     </div>
2

Could you please fix the formatting on your code - it’s not displaying correctly. Place three backticks (`) on the line before the code and three backticks on the line afterwards. Or just highlight the entire section of code and select the </> icon from above the edit area.

3

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.