2017-03-29 1 views
0

Je dois créer une URL en JavaScript avec url_for parce que je devrais utiliser une ligne de table entière comme un lien que je ne peux pas faire en HTML. Exemple ci-dessous:Meilleure méthode pour construire dynamiquement une URL avec Flask url_for

{% for x in last_orders %} 
<tr id="x"> 
    <td>something here</td> 
    <td>something here</td> 
</tr> 
{% endfor %} 

Et Flask:

@app.route("/some/page/<int:id>/", methods=['POST', 'GET']) 
def xxx_page(id): 

Je peux faire ligne de la table comme un lien en utilisant la fonction Jquery .cliquez() mais avec cette méthode, je ne peux pas utiliser url_for de manière appropriée.

J'ai vu dans un autre sujet que je peux envoyer des variables avec Post mais je ne veux pas changer mon système d'URL parce que c'est plus convivial.

Peut-être que je peux créer une URL fictive avec url_for (/ some/page/0), puis modifier cette chaîne avec JavaScript, mais je ne suis pas sûr que cette méthode est la meilleure.

Edit: Ma méthode est comme ceci:

$(".row").click(function() { 
    var id = $(this).attr("id"); 
    var where = `{{ url_for('xxx_page', id=0) }}`; 
    where = where.slice(0,-2).concat(id + "/"); 
    window.location = where; 
    }); 

Répondre

0

Si les éléments de last_orders contiennent le préfixe utilisé dans la fonction xxx_page (s), vous pouvez juste faire une balise a dans le td.

<td><a href={{ url_for('{}_page'.format(x)) }}>something here</a></td> 

EDIT: Après avoir relu votre question, vous cherchez à faire l'ensemble cliquable cellulaire. Il y a quelques options en JavaScript. Vous pouvez écouter les clics sur tous les éléments td, puis déclencher un clic sur leur enfant a.

# Don't actually use an anonymous function. Define it elsewhere. 
$('body').off('click.order') 
    .on('click.order', 'td', function(e) { 
     $(this).find('a').trigger('click'); 
    }); 

OU (et j'aime cette option beaucoup moins que la première) vous pouvez définir un élément de données sur les éléments td avec l'adresse.

<td data-url='{{ url_for('{}_page'.format(x)) }}'>something here</td> 

Ensuite, dans votre programme d'écoute click, faites ceci.

window.location.href = $(this).attr('data-url');