title: External Javascript file that has events for a Kendo Grid
body: <p>Is there a correct way of reading a Kendo Event from an external Javascript file?</p>
  <p>On my view, <strong>.cshtml</strong></p>
  <pre><code>@(Html.Kendo().Grid&lt;Model&gt;()
          .Name(&quot;EmployeeGrid&quot;)
          .Columns(cols =&gt; { })
          .Events(evt =&gt; evt.DataBound(&quot;afterGridLoaded&quot;))
          .DataSource(dataSource =&gt; dataSource.Ajax()
                                      .Batch(true)
                                      .PageSize(10)
                                      .Read(read =&gt; read.Action(&quot;GetEmployeeList&quot;, &quot;EmployeeDetail&quot;))
                                     )
        )
  </code></pre>
  <p>The <strong>&quot;afterGridLoaded&quot;</strong> is sitting in an external Javascript that is loaded on the top of the page.</p>
  <p><strong>External JavaScript File</strong> -</p>
  <pre><code>$(function () {
    function afterGridLoaded(e) {
    $(&quot;.k-button.xxx&quot;).click(function () {
      debugger;
      var idEmployee = $(this).attr('tag');
      myJsFunc(idEmployee);
      });
    }
  });
  </code></pre>
  <p><strong>And the way the Javascript is called</strong> - This is done at the top of the page</p>
  <pre><code>@section scripts
  {
      &lt;script src=&quot;~/Scripts/Views/EmployeeDetail/EmployeeList.js&quot; &gt;&lt;/script&gt;    
  }
  </code></pre>
  <p>The external Javascript file is loaded as I can see it on the DEV tools in Chrome under the network tab,</p>
  <p><img src="https://i.stack.imgur.com/7dtfj.png" alt="External Javascript loaded" /></p>
  <p>When I try to load the page I get the following error message on the console which prevents the page from loading further,</p>
  <p><img src="https://i.stack.imgur.com/gUbyf.png" alt="Error message" /></p>
  <p>Is there a way to get the kendo event to work using the external Javascript file?</p>