Implementé Ajax Search con éxito y los resultados se cargan en una tabla que se encuentra en un archivo de plantilla. Mis TH son estáticos y agrego cada resultado en < tr > < td >... en un bucle foreach.
if (data.length === 0) { tableOutput.innerHTML = '<h3>Aucun résultat.</h3>'; } else { nbResults.style.display = "block" nbResults.innerHTML = data.length + " produits trouvés" data.forEach((item) => { my_url = "{% url 'auto-product-details' ${item.id} %}" if (item.etat__etat == "Echange Standard") { var etat = "ES"; } else { var etat = item.etat__etat; } if (item.cau == "0.00") { var cau = "nc"; } else { var cau = item.cau; } tableBody.innerHTML += ` <tr> <td>${item.sku}</th> <td>${item.etat}</td> <td ${item.nom}</td> <td>${item.sst1}</td> <td>${item.sst2}</td> <td>${item.sst3}</td> <td>${item.pua}</td> <td>${item.cau}</td> <td><a href="/facture/auto-product-details/${item.id}"> <button type="button" class="btn btn-sm btn-labeled btn- info"> <span style="color: #fff;" class="btn-label"><i class="fas fa-sign-in-alt"></i></span></a></td> </tr> `;Mi problema es que tuve (arriba) que "codificar" mi URL "auto-producto-detalles" porque cuando trato de respetar la sintaxis de la plantilla Django como esta:
<td><a href="{% url 'auto-product-details' ${item.id} %}">...pero la URL se transforma en
/factura/%7B%%20url%20'auto-producto-detalles'%2036%20%%7D
Traté de construir pieza por pieza mi URL en JS, intenté reemplazar el {item.id} después de la creación de una URL base (var) sin PK... sin éxito. Parece que los caracteres especiales se transforman en HTML.
¿Hay alguna manera de lograr lo que quiero hacer?
Podrías usar una variable intermedia:
my_url = "{% url 'auto-product-details' ${item.id} %}" tableBody.innerHTML += ' <tr> <td>${item.sku}</th> <td>${item.etat}</td> <td ${item.nom}</td> <td>${item.sst1}</td> <td>${item.sst2}</td> <td>${item.sst3}</td> <td>${item.pua}</td> <td>${item.cau}</td> <td><a href="'+my_url+'"> <button type="button" class="btn btn-sm btn-labeled btn- info"> <span style="color: #fff;" class="btn-label"><i class="fas fa-sign-in-alt"></i></span></a></td> </tr> ';