Home/ Questions/Q 7675601
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-31T16:59:55+00:00

I have a problem with Javascript that keeps bugging me for quite a while

  • 0

I have a problem with Javascript that keeps bugging me for quite a while now. I have an external file called search.js which is in the same folder as the .html file it’s loaded into.

The piece of code I use in th HTML to load the javascript file is:

<script type="text/javascript" src="search.js"></script>

From all the websites I’ve read I can’t find an issue here with the code.

Also, I know that the syntax in the javascript file has to be correct in order for it to work, so here is my Javascript code from search.js:

$(document).ready(function(){
    $('#searchForm').submit(function(){
        var lookfor = $("#billSearched").val();
        alert(lookfor);
        var a = $(this).attr('action');
        alert(a);
        a = a.replace("__search_term__",lookfor);
        alert(a);
        window.location.href = a;
        return false;
    });
});

I’ve runned this code in another project and it has worked just fine, all that I’ve changed was the names of the fields, i.e. billSearched.

If there are any other reasons for why Javascript doesn’t load in my page please leave a message or a comment.

Thanks in advance!

EDIT

Full html code:

<html>
<head>
    <title>Bills</title>
    <script type="text/javascript" src="/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="/search.js"></script>
    <link rel="stylesheet" href="style.css"> 
</head>
<body bgcolor="#0066CC" color="FFFFFF">
    <table>
        <tr>
            <td style="color:white"><b>Products</b></td>
            <td style="color:white">Price</td>
            <form method="POST" id="searchForm"  action="{% url ps.views.search searchTerm='__search_term__' %}">
                {% csrf_token %}
                <td><input type="text" id="billSearched"></td>
                <td><input type="submit" value="Search"></td>
            </form>
        </tr>
        {% for x in products %}
        <tr>
        <td style="color:white">{{ x.name }}</td>
        <td style="color:white">{{ x.price }}</td>
        </tr>
        {% endfor %}
    </tr>
</table>
</body>

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I had to make a mix of your answers in order to fix the problem but eventually it was fixed. I had to make the following modifications:

    • Add the ‘/static/’ folder to STATIC_URL and STATICFILES_DIRS in the settings.py file

    • Import the .js files (search.js and the jQuery source) with the following commands, in this order:

      <script type="text/javascript" src="/static/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="/static/search.js"></script>

    • And make the according file structure, placing the “static” file in the project’s root directory.

      i.e.
      Psroot:

    • psApp
    • static
    • templates
    • and the rest of the files (settings.py, urls.py, manage.py, etc.)
    • 0