mercredi 29 mai 2019

ReferenceError when running javascript in a Laravel Blade

I am trying to run a simple javascript function from app.js in a blade but I am getting a ReferenceError that the function is not defined.

The "app.js" was compiled with "npm run dev".

The file "app.js" in binded and I can see my function there.

app.js

require('./bootstrap');

function myTest()
{
    alert(1);
}

index.blade.php

@extends('layout')

@section('title', 'Some Title')

@section('content')
    Welcome
@endsection

@section('scripts')
    <script>myTest();</script>
@endsection

Source code

<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="csrf-token" content="DeUaExASeRzE1Wl0OUAyVFhmHQ7DZNfbZR7kETJ7">
    <script src="http://127.0.0.1:8000/js/app.js"></script>
    <link rel="stylesheet" href="http://127.0.0.1:8000/css/app.css">
    <title>WOG</title>
</head>
<body>
    <!-- ######### NavBar ######### -->
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
      <div class="container">
      <a class="navbar-brand" href="/">WOG</a>
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
          <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarNavDropdown">
          <ul class="navbar-nav">
            <li class="nav-item">
              <a class="nav-link active" href="/">Home</a>
            </li>
            <li class="nav-item dropdown">
              <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Module</a>
              <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
                <a class="dropdown-item" href="/modules/alphanum">Alphanumerisch</a>
                <a class="dropdown-item" href="/modules/num">Numerisch</a>
              </div>
            </li>
          </ul>
        </div>
        </div>
      </nav>

    <!-- ######### Content ######### -->
    <div class="container">
            <h1>Willkommen</h1>
            <script>myTest();</script>
    </div>
  </body>
</html>

I was expecting to get a simple alert, but instead i am getting a "ReferenceError: myTest is not defined".

What can i do?

Thanks in advance



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire