2012-11-16 21 views
5

İlk olarak, genel olarak programlama için yeni ve Jinja2 için yeni bir tanım var. Bu yüzden sunucu tarafı şeyler için GAE ile python kullanıyorum. Temel olarak web'den bazı veriler alıyorum ve daha sonra bunu bir web sayfası üzerinde göstererek görüyorum. Doğru şekilde görüntülemek için jinja2'yi kullanarak farklı öğeler arasında geçiş yapıyorum. kullanıcıyaHer bir öğenin üzerinde bir döngü içinde onclick olayı sağlamak için Jjaery ile Jinja2'yi kullanma

$(#button).each(function(){ 
    $(this).click(function(){ 
     $(description).toggle(); 
    }); 

}); 

Bu html benim ana html sayfası için Ajaxed oluyor ayrı sayfası tarafından tıklanan kadar

{% for new in news %} 
    <div>{{new}}</div> 
    <button id = "button"></button> 
    <div id ="description"> {{new.description}}</div> 
{% endfor %} 

açıklama kısmı gizlidir. Yani temel olarak, tek tek açıklamaları göstermek için döngüdeki her öğeyi seçmeyi bilmiyorum. Jquery'deki .each() işlevinin kullanılması, başlamak için iyi bir yer gibi görünüyordu, ancak düzgün çalışmıyordu. Div kimliğini değiştirmek için bir sayı eklemek gibi bir şey mi yoksa her biri ayrı ayrı bir şey yapmak için bir şey var mı?

cevap

9

Yardım için şimdiden teşekkür ederiz.

Muhtemelen bildiğiniz gibi, Jinja2'deki döngüler dışında ayarlanan değişkenler döngü içinde çalıştırılamaz. Jinja2'nin kapsamı bazen biraz kafa karıştırıcıdır, ancak bunun şablondan çok fazla mantık tutmaya çalıştığı kasten şüpheleniyorum.

Her halükarda, her bir haber girdisi için bir id değerine sahibim.

{% for entry in news %} 
    <div>{{entry.subject}}</div> 
    <button id="button_{{entry.id}}" class="clickme">Click Me!</button> 
    <div id="description_button_{{entry.id}}">{{entry.description}}</div> 
{% endfor %} 

HTML kimliğinin benzersiz olması gerektiğini unutmayın. jQuery için bir şey gibi:

$('.button').each(function(){ 
    $(this).click(function(){ 
     $('#description_'+$(this).attr('id')).toggle(); 
    }); 
}); 

Ne bunu yapar o düğmenin kimlik değerini alır ve açıklama div kimliği seçicinin bunu ekler olduğunu.

Düzenleme, işte bir örnek: http://jsfiddle.net/VQKee/

+0

Çok zeki. Bunu takdir ediyorum. Bu çizgiler boyunca bir şey yapmam gerektiğini biliyordum. – David

İlgili konular