Php sayfa düğmesini kullanarak göster / gizle tablo

2 Cevap php

Ben aynı php sayfada bir düğmeye tıkladığınızda bir veri tablosunu görüntülemek istiyorum. Düğme, bazı metin gibi diğer girişler ile bir formda kullanılır. Veri tablosu varsayılan gizlemek olduğunu. Ve bu formdan değerleri almak ve sonra veritabanında bir sorgu yapmak ve bunları görüntüleyebilirsiniz.

Nasıl ekran / gizlemek fonksiyon elde edebilirsiniz?

Eğer herhangi bir çözüm var mı?

Teşekkürler.

2 Cevap

Javascript kullanarak tamam iseniz, sizin table etiketlemek bir id niteliğini verir. Sonra, CSS değiştirir butonuna bir onclick olay var table olmak display:none. Bu tıklandığında bir sonraki sefer, table CSS olmaya geçiş yapar, böylece düğmeye Javascript Alter display:table. Siz de bunu yapmak için, bu gibi Prototype gibi, bir Javascript kütüphanesi kullanabilirsiniz.

<table id="myTable">
</table>

<input id="toggleButton" type="button" onclick="hideTable(true);" value="Toggle Table" />

Ve Javascript olabilir:

function toggleDisplay(var hide) {
  if (hide) {
    document.getElementById('myTable').style.display = "none";
    document.getElementById('toggleButton').onclick = hideTable(false);
  } else {
    document.getElementById('myTable').style.display = "table";
    document.getElementById('toggleButton').onclick = hideTable(true);
  }
}

Inanmayarak ile bu Javascript alın; Ben bir süre içinde herhangi bir yazılı değil.

Javascript kullanmak istemiyorsanız, o zaman düğme normal bir HTML formu göndermek var. Bir değeri ile formunda bu tür hide_table, bazı giriş adı boyunca geçmek true. Sunucuda, eğer $_POST['hide_table'] == "true", tablo sayfa HTML olarak çıktı olmaya izin vermez. Ayrıca, tuşuna false bir değerle hide_table sunacak şekilde formu geçiş.

<form method="post" action="the_same_page.php">
  <input type="hidden" name="hide_table" value="<?php echo $_POST['hide_table'] == "true" ?>" />
  <input type="button" value="Toggle Table" />
</form>

<?php if ($_POST['hide_table'] != "true") { ?>
  <table>
  </table>
<?php } ?>

Eğer kullanıcı bunu göstermek için karar yalnızca tablo içerik yüklemek için AJAX kullanmak istedim, incelikle bu aşağılamak yapmak güzel olurdu. Bir kullanıcı Javascript sahip değilse, formu aslında sunucuya göndermek ve sayfayı yeniden yükleyin, tablo gösterme ya da gizleme gerekir. Kullanıcı Javascript var yoksa Ancak, bir AJAX çağrısı yapılabilir, masa yük ve yerinde göstermek.

Eğer bu istemci tarafında yapmak istiyorum varsayarsak (yani tüm veri sayfa yük istemciye gönderilir) yapmanız gereken tüm bu suretle bir şeydir: (kısalık için prototip ile yapılan)

...
<input type="button" id="showTableBtn" value="Show Table">
<table id="dataTable">
    ...
</table>

<script type="text/javascript">
<!--
Event.observe($("showTableBtn"), "click", toggleTable);

function toggleTable() {
    if ($("showTableBtn").value == "Show Table") {
         $("dataTable").show();
         $("showTableBtn").value = "Hide Table";
    } else {
         $("dataTable").hide();
         $("showTableBtn").value = "Show Table");
    }
}

//-->
</script>
...

etiketler