He estado luchando con este problema durante más de cuatro días. He mirado muchas documentaciones pero nada me ayudó. Estoy trabajando en el desarrollo de aplicaciones web Django. El problema es que tengo que obtener el contenido (es decir, el texto dentro) de un elemento div a través de un envío de formulario (enviado con un botón). El problema es que el contenido dentro del elemento div no es fijo. Inicialmente está vacío, cambia y muestra la información de las acciones realizadas en la página. Estoy tratando de guardar esa información en una lista en el lado del servidor, una por una. La solución ideal será " cada vez que hago clic en el botón Guardar información y la información se agrega a una lista de información presente en views.py (la página web no se actualiza al hacer clic en el botón) "
Investigué sobre la publicación de elementos div en el servidor usando JQuery y lo intenté, pero no pude tener éxito. ¿Puede alguien sugerir cómo logro la tarea?
Mi esfuerzo:
<form method="POST" id = 'notes_form' action="##" > {% csrf_token %} <div id="notes" cols="5" rows="2"></div> <input type="submit" id="note_btn_id" value="save info"> </form> <script> $(document).ready(function(){ $('#notes_form').submit(function(event){ event.preventDefault(); var notesForm = $(this); var posting = $.post(notesForm.attr('action'),notesForm.serialize()); posting.done(function(data){ console.log("SUCCESS"); }); posting.fail(function(data){ console.log("Try again"); }) }); }); </script>views.py Función de vista completa:
def annotate_view(request): try: request.session.clear_expired() except: print("Error clearing exp sessions") img_path = request.session.get('img_path_loc') #prev session data data_pos = [] if request.method == "POST": print("request method is POST") print("posted contents",request.POST) if request.POST.get("note_btn_id"): content = request.POST['notes'] data_pos.append(content) print(f"Contents received**: {content}") return render (request, "workpage/testtemplate.html",{ 'image_locs': img_path, #show the data in page when rendered 'data_pos': data_pos, }) Aún así, el lado del servidor no puede obtener el elemento "notas". Muestra un error que muestra que las "notas" no están presentes (MultiDictKeyError). Además, si comento request.POST['notes'] , la declaración if request.POST.get("note_btn_id"): siempre es falsa. ¿Qué tengo que hacer?
Esta es una forma de lograr lo que creo que quieres con el enfoque django-braces y Jquery .
Primero, instale django-braces . Esta biblioteca es imprescindible en todos mis proyectos de django, porque te brinda algunos mixins útiles, principalmente relacionados con los permisos.
En urls.py :
path('post/asjson/', views.PostCreateAsJSON.as_view(), name='post-asjson'), En views.py :
from braces.views import JSONResponseMixin class PostCreateAsJSON(JSONResponseMixin): def post(self, request, *args, **kwargs): # Whatever you want to do to create the post. # You will have your data on request.POSTEn su plantilla, no creo que realmente necesite un formulario. Está tratando de obtener el contenido de un DIV cuando hace clic en un botón, por lo tanto, tal vez solo necesite esto:
<div id="notes">{{ current_content|safe }}</div> {% csrf_token %} <button id="note_btn_id">{% trans 'Save' %}</button> Si agrega {% csrf_token %} en cualquier parte de su plantilla, se mostrará esta entrada oculta:
<input type="hidden" name="csrfmiddlewaretoken" value="your_csrf_token_value">En su archivo javascript:
$( '#note_btn_id' ).on('click', function(e) { e.preventDefault() const csrf_token = $( 'input[name=csrfmiddlewaretoken]' ).val() const contents = $( '#notes' ).text() $.ajaxSetup({ beforeSend: function(xhr, settings) { xhr.setRequestHeader('X-CSRFToken', csrf_token) } }) $.ajax({ type: 'post', url: 'your_PostCreateAsJSON_URL', data: { contents: contents }, success: function(data, status, jqXHR) { console.log('Here you could update your frontend if needed') } }) }Tal vez no sea la mejor manera de usar csrf_token, pero funciona para el ejemplo. Puede echar un vistazo a una explicación más detallada en la documentación de Django CSRF .