Django-crispy-forms und jQuery

Django, Flask, Bottle, WSGI, CGI…
Antworten
naheliegend
User
Beiträge: 439
Registriert: Mittwoch 8. August 2018, 16:42

Hi,

irgendwie lädt mein Formular beim Submitten die ganze Seite neu, obwohl ich das in jQuery eigentlich verhindere. Jeder andere normale Button reagiert mit dem alert, aber wenn ich das Formular abschicke, dann kommt der alert nicht, als ob jQuery das Click-Event nicht findet.

Code: Alles auswählen

<form id="formID" class="form-group">
    {% csrf_token %}
    {{ form|crispy }} 
    <input type="submit"  class="btn btn-secondary" value="Submit"> 
 </form>
                            
                            
                            
<script>
  $( document ).ready(function() {
    $("#formID").on('submit', function (e) {
        e.preventDefault(); //so that we stop normal form submit.
        alert("TEST")
    });
  });
</script>
Ist das irgendwie ein generelles Problem mit crispy-forms?

LG
__backjack__: "Jemand der VB oder PHP kann, der also was Programmieren angeht irgendwo im negativen Bereich liegt (...)"
rogerb
User
Beiträge: 878
Registriert: Dienstag 26. November 2019, 23:24

@naheliegend,

muss es unbedingt "submit" sein? Vielleicht klappt es wenn du einen einfachen Click-Event nimmst. Du willst ja anscheinend nicht das Form, wie üblich, abschicken, sondern etwas anderes mit den Daten im Formular machen. Dafür sollte jeder Click-Event reichen.
naheliegend
User
Beiträge: 439
Registriert: Mittwoch 8. August 2018, 16:42

Danke.

Noch eine Frage:

wie kann man denn dynamisch geränderte IDs im jQuery abgreifen?

Also wenn ich sowas wie:

Code: Alles auswählen

{% for item in items %}

	<button id="{{ item.id }}"> Klick</button>

{% endfor %}
Wie kommt man dann im

Code: Alles auswählen

$( document ).on('click', 'item.id' , function(e) 
(....)
an die entsprechende item id?
'item.id' wird ja wohl nicht funktionieren
__backjack__: "Jemand der VB oder PHP kann, der also was Programmieren angeht irgendwo im negativen Bereich liegt (...)"
__deets__
User
Beiträge: 14493
Registriert: Mittwoch 14. Oktober 2015, 14:29

Genauso wie in dem anderen Teil? Das ist dem Template System doch Wurscht, ob es nun in HTML oder Js einsetzt.
naheliegend
User
Beiträge: 439
Registriert: Mittwoch 8. August 2018, 16:42

hm, aber wenn ich 5 Buttons habe, woher weiß das JS welcher Button gedrückt wurde?

Ich möchte ja nicht für jeden Button einen eigenen "statischen" Listener anlegen. Geht das nicht mit einem, der dann anhand der id schaut, welcher Button gedrückt wurde?
__backjack__: "Jemand der VB oder PHP kann, der also was Programmieren angeht irgendwo im negativen Bereich liegt (...)"
__deets__
User
Beiträge: 14493
Registriert: Mittwoch 14. Oktober 2015, 14:29

Du musst auch die for Schleife machen. Wie sonst soll das gehen?
naheliegend
User
Beiträge: 439
Registriert: Mittwoch 8. August 2018, 16:42

Ja, äh, gut. Meistens gibt es ja für solche Art von "Problemen" immer eine schlaue Lösung, aber nun gut. Danke dir. Dann hack ich die in die Schleife.
__backjack__: "Jemand der VB oder PHP kann, der also was Programmieren angeht irgendwo im negativen Bereich liegt (...)"
__deets__
User
Beiträge: 14493
Registriert: Mittwoch 14. Oktober 2015, 14:29

Alternativ kannst du deinen Buttons eine Klasse geben, die nur die Buttons haben, und die mit jQuery als Selektion zugrunde legen. Und die ID im Handler aus dem Element abfragen. Ist das "schlau"?
naheliegend
User
Beiträge: 439
Registriert: Mittwoch 8. August 2018, 16:42

Ja gut. Dann wird das wohl so gemacht.

Eine weitere Frage habe ich auch noch:

Wenn ich jetzt per Ajax beispielsweise die Straße des Users update, wie bekomme ich das Users.street im template dann geupdatet? Wird dann quasi der direkte Straßennahme im view als JSON in Form eines strings an das template übergeben und der Inhalt des divs/p überschrieben, oder wird das Usersobjekt nochmal als Ganzes an das Template übergeben, um dort dann per {{Users.street}} als Text gerendert zu werden?
__backjack__: "Jemand der VB oder PHP kann, der also was Programmieren angeht irgendwo im negativen Bereich liegt (...)"
rogerb
User
Beiträge: 878
Registriert: Dienstag 26. November 2019, 23:24

@naheliegend,

das Template wird vom Server zusammengebaut und dann zum Browser gesendet. Jetzt wo die Seite längst beim Browser angekommen und geladen ist, macht es keinen Sinn mehr rückwirkend das Template zu verändern.
Mit Ajax updatest du die Daten(bank) auf dem Server, und mit JavaScript im Browser passt du die sichtbaren Elemente im HTML-Code an.
Der Sinn von Ajax ist ja gerade, dass man nicht die komplette Seite neu vom Server anfragt, sondern nur begrenzte Teilmengen überträgt.
naheliegend
User
Beiträge: 439
Registriert: Mittwoch 8. August 2018, 16:42

super. Danke dir. Das hilft mir enorm.
__backjack__: "Jemand der VB oder PHP kann, der also was Programmieren angeht irgendwo im negativen Bereich liegt (...)"
Antworten