שילוב קובץ javascript בקוד

שלום,
כאשר אני משלב קוד javascript ומשתמש בfastAPI אני מקבל שגיאת:

ובcmd כתוב : raise NoMatchFound()
starlette.routing.NoMatchFound

לא ברור לי למה,הרי שמתי את קובץ הjs בתוך תיקיית static,
אני תקוע על זה הרבה זמן, לא מצאתי תשובה באינטרנט, אשמח לעזרה.

קוד ה-python:

from fastapi import FastAPI, Request

from fastapi.responses import HTMLResponse

from fastapi.staticfiles import StaticFiles

from fastapi.templating import Jinja2Templates

app = FastAPI()

app.mount("/static", StaticFiles(directory="static"), name="static")

templates = Jinja2Templates(directory="templates")

@app.get("/items/{id}", response_class=HTMLResponse)

async def read_item(request: Request, id: str):

    return templates.TemplateResponse("item.html", {"request": request, "id": id})

קוד הHTML:

<!DOCTYPE html>

<html lang="en">

<head>

    <link href="{{ url_for('static', path='/styles.css') }}" rel="stylesheet">

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>Go_to_date</title>

</head>

<body>

    <h1>id: {{ id }}</h1>

    <button class="open-button" onclick="openForm()">Go to specific date</button>

    <div class="form-popup" id="myForm">

      <form action="/go_to_date/process" class="form-container">

        <h1>Enter the date in the format: dd.mm.yyyy</h1>

        <input type="text" placeholder="Enter date" name="date" required>

    

        <button type="submit" class="btn">Submit</button>

        <button type="button" class="btn cancel" onclick="closeForm()">Close</button>

      </form>

    </div>

    

    <script src="{{url_for('static', filename='popup.js')}}"></script>

</body>

</html>

נראה לי שהקריאה שלך לקובץ עצמו לא נכונה. קודם כל הmain שלך צריך להראות ככה (שזה מתיישר עם ה develop העדכני)

app.mount("/static", StaticFiles(directory=STATIC_PATH), name="static")

אם זה לא עובד נסה בפורמט הזה:

<script src="{{ url_for('static', path='/load_weeks.js') }}"></script>

מבחינת שיטת עבודה - אל תכניס את הקוד של הJS בתוך הקובץ html כמו פה למשל:

<button class="open-button" onclick="openForm()">

צריך שהכל ידע להיכנס מתוך הקובץ js עצמו אל הhtml יש המון דרכים בהם אתה יכול להגיע לאלמנטים האלה ולהכניס אליהם את הפונקציה:

  1. getElementById
  2. getElementsByClassName
  3. querySelector
    ועוד …
לייק 1

לא בדיוק הבנתי, את המשתנה STATIC_PATH, לרשום את הPATH המלא לתיקיית static בפרוייקט? פשוט ראיתי שככה גם כתוב במדריכים השונים, וגם בענף main, אגב בענף develop לא קיימת השורה של app.mount.

לא הכנסתי קוד javascript, שמתי בתוך קובץ הHTML קישור לקובץ הjavascript שבתיקיית static.

<script src="{{url_for('static', filename='popup.js')}}"></script>

נסה אולי ככה:

 <script type="text/javascript" src="{{ url_for('static', path='/popup.js') }}"></script>
לייק 1

בקובץ HTML שלך היום יש את השורה הזו ?

onclick="openForm()"

בנוגע ל:
directory=STATIC_PATH
זה משתנה סביבה הוא לוקח אותו מהdependencies
אתה צריך לעשתות pull ל develop אתה כנראה עובד בגרסא ישנה.

לייק 1

תודה לכולכם הבעיה נפתרה כשבמקום name כתבתי path.

    <script src="{{url_for('static', name='popup.js')}}"></script>
    <script src="{{url_for('static', path='popup.js')}}"></script>
לייק 1