Yücel Alkan

Jquery ile HTML Tablosunu Excel'e Aktarma

Merhabalar. Bu yazımızda HTML'de oluşturulan bir tablonun Javascript/Jquery yardımıyla nasıl Excel dosyasına aktarılacağını inceleyeceğiz. Bu işlemleri yaparken table2excel kütüphanesini kullacağınız. 

Öncelikle Jquery ve table2excel kütüphanelerimizi sayfamızın head tagları arasına ekleyerek sayfamıza dahil ediyoruz.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/rainabba/jquery-table2excel/1.1.0/dist/jquery.table2excel.min.js"></script>

Ardından sayfamızın body tagları arasında bir tablo oluşturuyoruz. Tablomuzun altında ise tıklandığı zaman bu tabloyu Excel'e aktarmakta kullanacağım bir span elementim var. Tablomun id değerine veriler, span elementinin id değerine ise aktar ismini veriyorum. Siz farklı değerler kullanabilirsiniz ama aşağıdaki jquery kodlarında bu isimleri değiştirmeyi unutmayın.

<table id="veriler" cellspacing="0">
    <tr>
		<td>Ad</td>
		<td>Soyad</td>
		<td>Yaş</td>
		<td>Cinsiyet</td>
		<td>Maaş</td>
	</tr>
	<tr>
		<td>Orkide</td>
		<td>Akın</td>
		<td>25</td>
		<td>Kadın</td>
		<td>2596</td>
	</tr>
	<tr>
		<td>Cüneyt</td>
		<td>Göktürk ince</td>
		<td>36</td>
		<td>Erkek</td>
		<td>2435</td>
	</tr>
	<tr>
		<td>Nurdoğan</td>
		<td>Başdaş</td>
		<td>45</td>
		<td>Kadın</td>
		<td>3486</td>
	</tr>
	<tr>
		<td>Enver</td>
		<td>Günbattı</td>
		<td>49</td>
		<td>Kadın</td>
		<td>2377</td>
	</tr>
	<tr>
		<td>Köksal</td>
		<td>Elbir</td>
		<td>46</td>
		<td>Kadın</td>
		<td>2758</td>
	</tr>
	<tr>
		<td>Elfida</td>
		<td>Karaçayır</td>
		<td>48</td>
		<td>Kadın</td>
		<td>3521</td>
	</tr>
</table>
    
<span id="aktar">Excel'e Aktar</span>

Tekrar sayfamızın head tagları arasında dönüyoruz. Id değeri aktar olan elemente tıklandığı zaman id değeri veriler olan tabloyu Excel'e aktaran kodlar aşağı gibi. Bu kodları alıp, head tagları arasına, kütüphaneleri eklediğimiz kodların hemen altına ekliyoruz.

<script>
    $(document).ready(function(){
        
        $("#aktar").click(function(){
            $("#veriler").table2excel({
                name: "İşçiler", // Çalışma sayfası adı - Worksheet
                filename: "dosya.xlsx" // Dosya Adı
            });
        })
        
    })
</script>

İşlemlerimiz bu kadar. Çalışmanın son halini bu linkten indirebilirsiniz.

Soru görüş ve önerilerinizi yorum olarak belirtebilirsiniz.
Hayırlı çalışmalar dilerim.

Diğer İçerikler
Yorumlar
Ali Salim (02 Şubat 2022 - 14:08)
Excel Dosyayı bozuk diye açmıyor hocam. Sıkıntı eski olmasında mı ?
Cevapla
Yorum Yapın