title: Javascript code is not working inside blade template Laravel
body: <p>I'm using laravel-5.3. I am trying to put some code in my blade template. But it seems that the JavaScript code is not working properly. Here is my blade template.</p>
  
  <pre><code>@extends('layouts.app')
  @section('scripts')
  
      &lt;script type="text/javascript"&gt;
          $(document).ready(function() {
              var members = {!!  json_encode($member)  !!};
              var arr = [];
              var cities = new Bloodhound({
                  datumTokenizer: Bloodhound.tokenizers.obj.whitespace('text'),
                  queryTokenizer: Bloodhound.tokenizers.whitespace,
                  local: members
              });
              cities.initialize();
              var elt = $('#researcher');
  
              elt.tagsinput({
                  itemValue: 'value',
                  itemText: 'text',
                  allowDuplicates: false,
                  interactive:true,
                  typeaheadjs: {
                      name: 'cities',
                      displayKey: 'text',
                      source: cities.ttAdapter()
                  }
              });
              console.log(members);
              var elt1 = $('#advisor');
              elt1.tagsinput({
                  itemValue: 'value',
                  itemText: 'text',
                  allowDuplicates: false,
                  interactive:true,
                  typeaheadjs: {
                      name: 'cities',
                      displayKey: 'text',
                      source: cities.ttAdapter()
                  }
              });
  
              $("#submit").click(function(event){
                  $.ajax({
                      type: "POST",
                      url: '/storeresearch',
                      data: { _token: "{{ csrf_token() }}"},
                      success: function( msg ) {
                          console.log(msg);
                          window.location.replace('/researches');
                      }
                  });
              });
  
          });
      &lt;/script&gt;
  @endsection
  
  @section('content')
      &lt;form id="hu" action="/storeresearch" method="POST"&gt;
          {!! csrf_field() !!}
          &lt;label&gt;Researcher&lt;/label&gt;
          &lt;input type="text" class="R_a" id="researcher" name="researchsupervisor_1"&gt;
          &lt;label&gt;Advisor&lt;/label&gt;
          &lt;input type="text" class="R_a" id="advisor" name="researchsupervisor_1"&gt;
          &lt;input type="button" name="submit" id="submit" class="btn btn-primary" value="Add"&gt;
      &lt;/form&gt;
  @endsection
  </code></pre>
  
  <p>The tagsinput is not working. what should i do. If I do this without extending any layouts it works fine. In the app layout i have yield the scripts section in the header part.</p>