2011-03-12 12 views
5

Django formunun <input..> alanına bir CSS sınıfı özniteliği eklemek için bir çözüm arıyoruz. Biz bir <div>http://docs.djangoproject.com/en/1.2/topics/forms/#customizing-the-form-template alanına kaydırmak anlaşılacağı tavsiye gördüm ama bu tavsiye ağırlıklı değil <input ...> var, bir alanlar etikete uygulamak gibi görünüyor.Django <input ..> alan oluşturmak için sınıf ekleyin

Bu özel öneri, <input> alanının etrafında bir kenarlık oluşturmaya çalışıyorsanız çalışmaz. Bu durumda, sınırlayıcı kutuya uygulanacak ve gerçek giriş alanı değil. Örneğin .wrapper { border: 1px solid #666;line-height:22px;height:22px;padding:3px 5px;width:205px;}, varsayılan <input ...> kenarlık yerine, alanın etrafında bir kutu oluşturur.

Sınıfı, sınıf uygulamasına uygulanan bir parçacık aracılığıyla uygulamaya geri döndük, ancak bu, belirli miktarda kod zarafetinden yoksun (ve DRY'yi ihlal ediyor). Örneğin, bu ihtiyacı çözmektedir.

class ContactUsForm(forms.Form): 
    name = forms.CharField(widget=forms.TextInput(attrs={'class':'form_text'})) 

Ancak Tabi ki bu, Formu CSS'ye çok sıkı şekilde bağlar. Form, yeni forms.ModelForm sistemlerine dayanıyorsa, <input ..> alanlarına sınıf özniteliklerini uygulamak istiyorsanız, daha da karmaşıklaşır.

İki gün boyunca bu sorunla (ve Django kaynak kodunu okuyarak) daha iyi bir kısmı harcadık ve bu özel bir sorun için Django'nun en uzak kenarlarına ulaşabileceğimiz anlaşılıyor. Başka birinin içgörüsü olup olmadığını görmek için StackOverflow'ta bir kez geçmek.

Herhangi bir fikir için teşekkürler.

Son yorum: Sorun (yerine django yerine) anlayışımız CSS ise bu konuda bizi doğrudan ayarlamak için çekinmeyin. CSS seçenekleriyle uğraşmak için oldukça fazla zaman harcadık, ancak bunların hiçbiri istenen efekti elde etmemize izin vermiyor. Bu, varsayılan <input...> sınırının yerini alıyor.

cevap

8

Böyle çocuk seçici kullanabilirsiniz:

.fieldWrapper > input {border: 1px solid #666;line-height:22px;height:22px;padding:3px 5px;width:205px;} 
+0

Parlak çözüm! Genellikle tarihsel uyumluluk sorunları nedeniyle çocuk seçicileri hakkında düşünmüyorum, ancak modern tarayıcıları hedeflemeyi düşünmüyorsanız - bu bir sorun değil. Harika çözüm için teşekkürler. – user590028

İlgili konular