Merhaba arkadaşlar,
Bazı sitelerde sıkça gördüğümüz "tıkla-değiştir" tipi sayfaların kolayca hazırlanmasına olanak sağlayan bir betik yazdım ve paylaşmak istedim. Ayrıca resimlerin de bu şekilde hızlıca güncellenebilmesine imkan veriyor.
Demolar
http://amplio-vita.net/JSLib/demos/quickEdit
http://amplio-vita.net/JSLib/demos/quickEdit_2
http://amplio-vita.net/JSLib/demos/quickEdit_3
Her klasörde inital ve final şeklinde iki
HTML dosyası var. Initial o dosyanın orijinal hali, final ise betiğin entegre edilmiş hali.
Betiğin kullanımının kolay olması için oldukça uğraştık. Şu an tek yapmanız gereken hangi elemanların düzenlenebilir olduğunu
CSS kurallarıyla (örn. #profile>ul>li) belirtip, bu elemanların düzenlenme özelliklerini yine
CSS benzeri bir yazımla bildirmek. Gerisini kod hallediyor.
İlk demoda satır içi - inline özellik atama şekli var, elemanın içerisinde quickEdit şeklinde bir özellik yazarak veriyoruz özelliklerini.
İkinci demoda ek olarak hem resim değiştirme görülüyor hem de kurallar harici bir dosyadan(editableRules.txt) alınıyor.
Üçüncü örnek ikinci örneğin aynısı, tek farkı bu sefer kuralları head kısmında tanımlanan özel bir style etiketinden alması.
Kod tamamen ücretsiz ve hala geliştirildiği noktalar var, LÜTFEN yorum ve önerilerinizi paylaşın, kullanmaktan da çekinmeyin.
Not: İkinci ve üçüncü demolarda resmi değiştirmek için tıkladığınızda ne yollarsanız yollayın önceden belirlenmiş bir resim geliyor. Bunun sebebi kötü kullanımı engellemek. Aynı şekilde yazılar da sayfayı tekrar açtığınızda eski hallerinde görünecekler ama siz değiştirdiğinizde arkada bir
PHP dosyasına gönderiliyor hem yeni resim hem de yazılar, yani kod kalıcı değişiklik için
(Firebug ile takip edebilirsiniz
)
Ayrıca
http://code.google.com/p/av-jslib/wi...ckEditTutorial adresinde İngilizce bir "nasıl yapılır" yazısı bulunuyor.