0
votes

Pourquoi après avoir déplacé un script .js du html vers un fichier .js, il ne charge pas les valeurs?

J'ai une liste déroulante qui chaque fois que je change ses valeurs, un script js transmet ses réponses à une autre liste déroulante. Ce script fonctionne lorsqu'il se trouve à l'intérieur du fichier .html, mais une fois que je le déplace vers un fichier .js , il ne fonctionne pas. c'est le code:

path('myapp/post/ajax/ajax_load_subtags', load_subtags, name='ajax_load_subtags'),

Il y a une autre fonction dans le même fichier qui est correctement chargée dans ce fichier html, donc je pense que le problème ne vient pas du chargement. Je ne sais pas ce qui cause ce bug.

L'erreur que je reçois est:

GET failed, ajax_load_subtags 404 (Not Found),

url.py:

$("#id_subtag-tags").change(function () {
  var tagId = $(this).val();  // get the selected tag ID from the HTML input
  console.log(tagId);

  $("#displaytags").html('');

  $.ajax({                       // initialize an AJAX request
    url: '{% url "ajax_load_subtags" %}',                    // set the url of the request (= localhost:8000/app/ajax/load_subtags/)
    data: {
      'tags': tagId       // add the tag id to the GET parameters
    },
    success: function (data) {   // `data` is the return of the `load_subtags` view function
      $("#id_subtag-subtags").html(data);  // replace the contents of the subtags input with the data that came from the server
    }
  });
});

Je suppose que le problème est dans le chargement de l' url , comme en html j'avais {% load static%} mais je ne sais pas quel est l'équivalent dans les fichiers .js !!

javascript django jquery html

2 commentaires

Duplicata de stackoverflow.com/questions/298772/...

@Jonas Ils ont l'air liés, mais cela vise une URL plutôt qu'un dictionnaire qui nécessite des vérifications supplémentaires.

3 Réponses :

0
votes

Pour ceux qui travaillent avec django et qui ont le même problème. Je viens d'utiliser directement l'url plutôt que le nom de l'url et cela fonctionne:

$("#id_subtag-tags").change(function () {
  var tagId = $(this).val();  // get the selected tag ID from the HTML input
  console.log(tagId);

  $("#displaytags").html('');

  $.ajax({                       // initialize an AJAX request
    url: "/myapp/post/ajax/ajax_load_subtags",                     // set the url of the request (= localhost:8000/app/ajax/load_subtags/)
    data: {
      'tags': tagId       // add the tag id to the GET parameters
    },
    success: function (data) {   // `data` is the return of the `load_subtags` view function
      $("#id_subtag-subtags").html(data);  // replace the contents of the subtags input with the data that came from the server
    }
  });
});

2 commentaires

Cela fonctionnera, mais il est préférable d'éviter de coder en dur les URL.

@DeanElliott Merci

2
votes

Dans l'url AJAX, vous essayez d'utiliser la syntaxe du modèle Django dans JS avec {% url "ajax_load_subtags" %} . Cela signifie que vous allez faire une requête à une URL vide et donc recevoir un 404.

Je recommanderais d'ajouter l'url à un attribut de données comme ci-dessous:

HTML
<div id="someElement" data-subtags-url="{% url 'ajax_load_subtags' %}">

JS
$.ajax({
    url: $('#someElement').data('subtags-url'),
    ...,
});

0 commentaires

0
votes

Le meilleur moyen est de mettre un static folder sur le répertoire principal. Ensuite, sur votre fichier .html en haut, vous pouvez simplement ajouter {% load static %} . Ensuite, allez dans votre settings.py et en bas, collez ceci

{% static 'filename.js' %}

Maintenant sur votre fichier .html puisque le <script> fonctionne correctement en bas, alors faites ceci

STATICFILES_DIRS = [os.path.join(BASE_DIR, "static")]

Cela devrait fonctionner

0 commentaires