Estoy tratando de enviar la identificación del objeto que seleccionamos para editar en la acción del formulario.
let edit_buttons = document.querySelectorAll(".edit-modal"); for(var i = 0; i < edit_buttons.length; i++) { edit_buttons[i].addEventListener("click", function(e) { console.log(`${this.getAttribute("data-id")}`) console.log(`{% url 'users:edit' pk=1 %}`) document.querySelector("form").setAttribute("action", `{% url 'internal-users:edit-product' pk=${this.getAttribute("data-id")} %}`); }) } <tr> <td class="border-0 size-13 text-gray-dark"> <button class="btn btn-gray text-gray size-13 edit-modal" data-id="1" data-toggle="modal" data-target="#editModal">Edit</button> </td> </tr> <tr> <td class="border-0 size-13 text-gray-dark"> <button class="btn btn-gray text-gray size-13 edit-modal" data-id="2" data-toggle="modal" data-target="#editModal">Edit</button> </td> </tr> {% endfor %} <form method="POST" action=""> {% csrf_token %} <input type="hidden" id="object_id"> </form>Entonces, si elegimos la primera entrada para editar, quiero que la acción del formulario sea /usuarios/1/editar/
Si trato de agregar con javascript me sale el siguiente error
Could not parse the remainder: '${this.getAttribute("data-id")}' from '${this.getAttribute("data-id")}'Si alguien me puede ayudar sera muy feliz, gracias de antemano!
Delegar
document.querySelector("#myTable tbody").addEventListener("click", function(e) { const tgt = e.target; if (tgt.classList.contains("edit-modal")) { document.getElementById("postForm").action = `someurl?id=${tgt.dataset.id}`; console.log(document.getElementById("postForm").action) } }) <table id="myTable"> <tbody> <tr> <td class="border-0 size-13 text-gray-dark"> <button class="btn btn-gray text-gray size-13 edit-modal" data-id="1" data-toggle="modal" data-target="#editModal">Edit</button> </td> </tr> <tr> <td class="border-0 size-13 text-gray-dark"> <button class="btn btn-gray text-gray size-13 edit-modal" data-id="2" data-toggle="modal" data-target="#editModal">Edit</button> </td> </tr> </tbody> </table> <form method="POST" id="postForm" action=""> </form>