Ek HTML satırları ekleme: nereye kodu koymak için?

2 Cevap php

Ben şu durum var:

<table><tr><td width="50">
<select name="angle">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
</select>
</td><td>
<input type="text" name="what" value="" />
</td></tr></table>
<a href="">+ Add Row</a>

Yani, planın kullanıcı ilk sayfaya gelince, onlar 1 satır göreceksiniz olmasıdır. Onlar verileri girin ve tüm verileri girmek için "satır eklemek" birden çok kez tıklayabilir olacaktır. Daha sonraki bir tarihte, onlar geri gelip herhangi bir satır düzenlemek veya kaldırmak gerekir.

Benim soru / sorun: javascript, ben her satır oluşturmak veya sunucudan yeni bir satır almak için bir AJAX isteği gerçekleştirmek için tam HTML olması gerekir. Sunucuda ben kullanıcıların düzenlemek geri geliyor ya da ben bir json dizi kullanarak değerleri geçirdiğinizde satırları oluşturmak için HTML olması gerekir.

Ben 2 yerde HTML zorunda kalmamak için çalışıyorum olarak ne yapacağını merak ediyorum. Eğer JS tüm HTML koymak istiyorsunuz? Yoksa sunucu (PHP) üzerindeki tüm HTML koymak ve AJAX ile çağırır? Yoksa sadece 2 yerde HTML olurdu? (Btw, vaka ben 5 sütun ve daha bir çok HMTL sahip olan çalışıyorum.)

Ben kullanıyorum: PHP + MySQL + jQuery

2 Cevap

Açıklandığı gibi, bu sorunun çeşitli yaklaşımlar, dengeler her vardır. Ben bir kaç tecrübe ettik. Bu gelecekte korumak için daha fazla iş olacaktır beri ben, iki yerde HTML sahip önleyeceğini.

Bir yaklaşım ilk sayfasındaki HTML tutmak için - Eğer gizli bir satırda bir 'şablon' oluşturabilirsiniz. PHP ya da her neyse - - kaydedilen veri satırları oluşturmak için, artı gizli şablon satır sonra web dili kullanabilirsiniz. Bir kullanıcı ekleme satır bağlantı / düğmesini tıkladığında, bu satırı klonlamak ve tablonun sonuna eklemek, veya sağ şablon satırı önce olabilir. Bunun yararı kullanıcı ajax arama ek satırları yüklemek için beklemek zorunda olmamasıdır. Ayrıca, kolayca tasarımını değiştirebilirsiniz. Bir potansiyel aşağı tarafı bu gizli satır sahip çalışır nasıl gizlediğini.

Başka bir yaklaşım ajax ve her HTML satır isteyen aracılığıyla yükleme tüm yapmaktır. Bu durumda, ben de tavsiye ederim ilk sayfasında yer veya ajax çağrı yoluyla yüklenen edilebilir bir şablonda HTML'nizi koyarak. Tek bir yerde tüm HTML. Eğer ajax gecikme yok, böylece de fazladan bir satır önceden yükleyebilirsiniz. Kullanıcı satır ekle 'tıkladığında, gizli önceden yüklenmiş satır görüntülemek ve ek, gizli satır yükleyin.

Son olarak, başka bir yaklaşım yukarıda açıklanan şablon satır yöntemi (ilk seçenek) kullanmanızı ve sayfa yük JSON için bir ajax isteği yapmaktır. Daha sonra js ve JSON veri üzerinden kaydedilen verinin gerekli satırları doldurabilirsiniz. Kullanıcı verileri yüklemek için beklemek zorunda kalacak, ama şeyler biraz kolaylaştırabilirsiniz.

Jquery öğretici güzel bir örnek var bunu yapmak için kullanabilirsiniz.

Canlı örneklerde (örnek C) var

$("div.contentToChange p:not(.alert)")
  .append("<strong class="addedtext"> This text was just appended to this paragraph</strong>")});

Neden yerine "

Eğer adını değiştirmek javascript ile oldukça fazla can sen ekleme yaptığınız bir dize, bu nedenle kolayca kontrol edebilirsiniz gibi.

Gibi

.append("<input type=\"text\" name=\"row_"+id+"\">.....

Ben bunu bu şekilde yapardı :)

Bu şekilde bir satır eklemek web sayfası her şey yenilemek zorunda kaçınmak gerekir. "Row_id" ayrıştırma, sen kaç satır gönderdikten sonra da php tarafında algılayabilir

Umarım yardımcı olur

Edit: Yorumlarınız ve soru kalanına Cevap

Ben append tarafından üretilen tüm HTML, bu sunucu üzerinde biraz daha az yük olur (o kadar değil rağmen) ve şeyler organize etmek kolay olurdu koymak istiyorum. Oh ve yenileme sahip önleyeceğini :) (Bu eklenti satır için)

Satırlar veritabanından yükleme olduğunuzu ekledi için, o sunucu tarafında olmalıdır.