Jak vzít data z tabulky? – JavaScript, AJAX, jQuery – Fórum – Programujte.com
 x   TIP: Přetáhni ikonu na hlavní panel pro připnutí webu

Jak vzít data z tabulky? – JavaScript, AJAX, jQuery – Fórum – Programujte.comJak vzít data z tabulky? – JavaScript, AJAX, jQuery – Fórum – Programujte.com

 
Hledat
Vybavení pro Laser Game
Spuštěn Filmový magazín
Laser Game Brno
Pergoly a střechy Brno

Toto vlákno bylo označeno za vyřešené — příspěvek s řešením.
fix0
Stálý člen
1. 4. 2021   #1
-
0
-

Ahoj lidi, používám DataTables knihovnu/framework. A potřeboval bych data z té již vygenerované tabulky s doselekcířádkl přes JS exportovat do CSV. Vůbec netuším jak by se to dalo.

1. PHP+SQL vyplní tabulku daty z databáze,
2. Uživatel na své straně klienta přes JS využije různé selekce a filtry.
3. Počet řádků tabulky je nyní po JS selekci třeba poloviční oproti původním PHP výpisu.
4. Jak teď vytvořit pole, které bude obsahovat všechna ID (první sloupec tabulky) výsledného výpisu k vygenerování CSV exportu? Potřebuji alespoň v tom javescriptu mít pole: array toCSV(3,9,15,45,25,...);
5. Dál si s tím polem asi udělám tlačítko pro předání toho pole přes POST zpět serveru nebo přes AJAX, to už nejak zmáknu, který po stisknutí tlačítka jen vrátí vygenerované CSV z toho vstupního pole toCSV. Jen neumím naplnit to pole tím prvním sloupcem. :-)
 

V kódu to vypadá takto:

<php? 
$vypisZaznamy= new Data();
$vypisZaznamy= $vypisZaznamy->vypisServery($sql="all");    
?>
<table id='table_id' class='display'>
    <thead>
        <tr>
            <th>ID</th>
            <th>Name</th>
            <th>Date of create</th>
            <th>Actions</th>
        </tr>
    </thead>
    <tbody>
        $vypisZaznamy
    </tbody>
</table>

Máte pro mě prosím někdo nějaký tip? Jak Ty id odselektované javascriptem získat? Případně asi můžu uělat něco jako toto: http://live.datatables.net/ akorát já mám v prvním sloupci ještě to ID záznamu.

Nahlásit jako SPAM
IP: 31.30.170.–
peter
~ Anonymní uživatel
3662 příspěvků
1. 4. 2021   #2
-
0
-

Zalezi na tom, jakym zpusobem s tim pracujes.

1. Pokud data z php vycucas do js pole a to pak filtrujes a zobrazujes jako tabulku, tak misto zobrazeni tabulky to posles do csv (js kod, ktery ti array prepise do csv a nabidne ke stazeni, urcite se to da najit googlem, takovy js)
2. Pokud generujes pres php primo html kod tabulky, tak je reseni 1 trochu problem. Pak ti zbyvaji 2 moznosti. Ziskat data z tabulky javascriptem. Nebo kliknutim na odkaz Stahnout CSV si odesli filtry do php. Tam uz si to znova vyfiltrujes a vygenerujes mu csv, coz se dela programove lip a neni treba shanes js kod na csv. Navic muzes upravit ten kod, aby ti generoval xml, json, pdf (na pdf je treba knihovku, ale) nebo jine formaty :)
3. Moznost z 2. Ziskat data pomoci js z html tabulky.

// Principialne...

table = document.getElementByTagsName('TABLE')[0]
th_list = table.getElementByTagsName('TH');
td_list = table.getElementByTagsName('TD');

y = 0
pole[y] = []
k = 0 az td_list.length
{
x = 0 az th_list.length // vybere prvni radek
{
pole[y][x] = td_list[k].innerHTML // obsah bunky tabulky
}
y++; // zvysi cislo radku
pole[y] = [];
}

// Za predpokladu, ze tam nemas colspan

A mozna bys jako prvni tam mohl zapsat zahlavi.

Nahlásit jako SPAM
IP: 193.84.197.–
Kit+14
Guru
1. 4. 2021   #3
-
0
-

#1 fix
Můžeš mi prosím sdělit, proč přepisuješ objekt $vypisZaznamy novým obsahem? Tohle rozhodně nedělej. 

<php? 
$data = new Data();
$zaznamy = $data->vypisServery($sql="all");header('Content-Type: application/json');echo json_encode($zaznamy);
Nahlásit jako SPAM
IP: 81.19.2.–
Komentáře označují místa, kde programátor udělal chybu nebo něco nedodělal.
peter
~ Anonymní uživatel
3662 příspěvků
1. 4. 2021   #4
-
0
-

#3 Kit
Hele, to je fixos. Clovek, ktery vlastni kod nikdy neposkladal. Takze ani ma rada mu k nicemu nebude, pac si to neumi dat dohromady.
Muzes mu sim te pridat i ten dalsi kod, jakym zpusobem se ten tvuj pouziva? Obavam se, ze na ajaxovy request by proste neprisel nebo script src :) Pripadne mu tam udelej upravy pro include

Nahlásit jako SPAM
IP: 193.84.197.–
Kit+14
Guru
1. 4. 2021   #5
-
0
-

#4 peter
Kód, který jsem mu napsal, je kompletní. Jenom si ho z klienta zavolá ajaxem.

Nahlásit jako SPAM
IP: 81.19.2.–
Komentáře označují místa, kde programátor udělal chybu nebo něco nedodělal.
gna
~ Anonymní uživatel
1419 příspěvků
1. 4. 2021   #6
-
0
-
Nahlásit jako SPAM
IP: 213.211.51.–
Kit+14
Guru
1. 4. 2021   #7
-
0
-

#6 gna
Tohle vypadá zajímavě, může se to hodit pro severless aplikace.

Ovšem tím events.prepend() to docela pohnojili.

Nahlásit jako SPAM
IP: 213.175.43.–
Komentáře označují místa, kde programátor udělal chybu nebo něco nedodělal.
fix0
Stálý člen
6. 4. 2021   #8
-
0
-

Mám pocit, že se nechápe, že jsem to špatně vysvětlil, uvedu tedy ukázku s příkladem.

Mám toto: http://live.datatables.net/saxivebu/1/edit?…

1. Do instant search napíši "London"

2. Vrátí to dvě stránky 10+3 (celkem 13 nalezených  záznamů).

3. Pro těchto 13 záznamů potřebuji tlačítko "do CSV".

Dá se to nějak?

Jak si moje amatérská hlava přestavuje, že to může fungovat:

A) Nějak z klienta (prohlížeče) dostat těch 13 záznamů převést do JSON, ten pak poslat nějak přes tlačítko nad tabulkou AJAXem zpět do PHP, který ho zpracuje, vytvořit z něj CSV na straně PHP už zvládám.

B) Nějak z klienta (prohlížeče) dostat těch 13 záznamů uložit do pole, to pole použít jako vstup pro javascript funkci generujCSV($pole), přes tlačítko v tabulce.

C) Odchytit nějak to klíčové slovo, které vepíšu do instant search, a poslat ajaxem jen to klíčové slovo funkci, terá bude mít neco jako SELECT * FROM zaznamy WHERE jmeno LIKE "%$searchkw%" OR city LIKE "%$searchkw%", což bude sloužit jako data pro generátor CSV, mělo by to fungovat stejně, ale jak to klíčové slovo přes javascript z té tabulky dostat. Možná přes input.change event by se upravovalo URL tlačíka "do CSV" na /csvexport.php?kw=<kw>, myslíte, že je to reálné?

@peter

1. Data z PHP vycucám do pole je k ničemu. Vznikly by dvě verze:

A) 1:1 data v PHP v poli

B) Tabulka přes JS odfiltruje jen některé záznamy a o ty jde, ne o všechny v tom poli v A)

2.Ano generuji z PHP do HTML tabulky, a ta HTML tabulka se poté přes JS filtruje. Do CSV potřebuji přímo ten odfiltrovaný výstup, který je vytvořen někde na pozadí v datatables.

Získat data z tabulky přes javascript a ty data poslat přes AJAX do PHP právě chci, jen nevím jak to udělat. TO je ale asi nerealizovatelné, protože tabulka má paginaci (stránkování), fungovalo by to jen pro první stránku, prvních 10 záznamů, další by to ignorovalo. Proto mi přijde logické to udělat přímo na straně klieta, a nevracet to nijak zpět do PHP.

Odešli filtry do PHP nechápu jak myslíš. Filtry jsou součástí datatables.

3. Ten tvůj psudokod bych asi nějak zvládl dát dohromady aby fungoval, ale podle mě to bude brát právě jen první stránku té tabulky.

@Peter Jo, asi jsem máslo, ale AJAX jsem už dohromady jednou dal, jen jsem přes něj neposílal žádná pole, jen spustil PHP funkci na smazání záznamu nebo co to bylo.

@kit Jo, asi se tomu říká přetěžov\ání, dělám to rád, jen proto, že neznám důvod proč to nedělat, když si umím v hlavě vybavit posloupnost kodu, šetří to paměť ne? :-)

@gna Ne nevyhovuje, funguje to úplně jinak. Bavíme se o doselekci přes instant search, když budu chtít vyselektovat všechny Londýny z example a bude jich tisíc, tak budu muset tisíckát kliknout a všechny je označit. Má to poslat celý obsah tabulky po odfiltrování záznamů přes instant search. Resp vlastně by to asi nějak šlo, kdyby se namísto označování ty záznamy poslaly všechny (celá již odselektovaná tabulka).

@kit Kdepak, to přece nebude fungovat, to pošle zpět do PHP 1:1 to stejné, co PHP poslalo klientovi. Nemělo by to přece žádný význam.

Nahlásit jako SPAM
IP: 92.240.177.–
fix0
Stálý člen
6. 4. 2021   #9
-
0
-

Teoreticky jsem našel řešení: http://live.datatables.net/farozutu/1/edit?…

jsbin sice dole ukazuje 5 errors a 1 warning, ale funguje to. :-D

Má to ale jeden háček funguje to dost jinak, a to tak, že zprostředkovatl dat z databáze je zřejmě ten "ajax": "/ssp/objects.php", v rámci server-side, tomu jsem se chtěl vyhnout, protože potom je všechna logika jako i to vyhledávání apod. řešena přímo na serveru a celá ta logika je nakydaná v tom object.php, kde je obrovský moloch v podobě tisíci řádkového generátoru SQL dotazu. Tomu bych se tedy rád vyhnul.

Nahlásit jako SPAM
IP: 92.240.177.–
gna
~ Anonymní uživatel
1419 příspěvků
6. 4. 2021   #10
-
0
-

#9 fix
Mně nešlo konkrétně o ten příklad se selected: true, ale obecně o tu funkci, které těch voleb podporuje více, třeba search: 'applied'...

Nahlásit jako SPAM
IP: 213.211.51.–
fix0
Stálý člen
6. 4. 2021   #11
-
0
-

To by vlastně fungovalo, ale špatně, pokud to dobře chápu, tak by to exportvovalo správně JEN v případě použití instant filteru. Já ale potřebuji aby to fungovalo vždy. Zkrátka nějakou API funkci, která vrátí všechny záznamy, které v tabulce v ten okamžik reálně jsou (ať už je nějaký filtr aktivní nebo není). Nacházím jen server-side řešení, ale client-side řešení přece musí existovat taky. Javascript umí určitě všechno.

Je to jednoduchý pokyn, ale realizace už je těžší vymyslet: Vezmi všechny aktuálně vypsané záznamy, a pošli je nějak XML/JSON přes AJAX (POST) generátoru /csv.php po kliknuttí na tlačítko "generuj CSV".

Chápu to tak, že jestli to datatables API neumí, tak s tím prostě nic nezmůžu a budu muset používat server-side zpracování.

Nahlásit jako SPAM
IP: 31.30.170.–
gna
~ Anonymní uživatel
1419 příspěvků
6. 4. 2021   #12
-
0
-

Já ti nevím. Chápu to tak, že máš komplet data na klientu, filtrování i stránkování ti taky běží na klientu, tak nevidím v čem by měl být problém a co chceš řešit na serveru. Ale pokud to potřebuješ/chceš, tak holt vezmi obsah toho pole a pošli ho na server.

Nahlásit jako SPAM
IP: 213.211.51.–
fix0
Stálý člen
6. 4. 2021   #13
-
0
-

Zde nastává ten problém. Kde to poje vzít, když zdrojový kód přidaný na stránku je jen toto:

$(document).ready( function () {
  var table = $('#example').DataTable();
} );

Žádné pole v tom nevidím, to je ten problém a forkovat a překopávat knihovnu datatablesu není podle mě dobrá cesta.

Vůbec nechápu jak se k tomu poli dostat, to je celé jádro mého problému. V PHP udělám skoro cokoliv, sice amatérským způsobem, ale k výsledku se vždy doberu. Zatímco v případě JS vůbec nevím co mám dělat.

Juhů, konečně, přesně takhle je to TOP: https://jsfiddle.net/do2ntz79/

Díky, všem.

Nahlásit jako SPAM
IP: 31.30.170.–
7. 4. 2021   #14
-
0
-

Možná nějaký javascript vepisuje tabulku. Osobně si myslím, že ji tvoří pomocí html elementů <table> <tr> a <td> (sám takto u jedné aplikace postupuji). Takže bych hledal javascriptem tabulku úplně stejně jako by byla vytvořena v html, akorát až po proběhnutí javascriptu který tabulku generuje.

hu

Nahlásit jako SPAM
IP: 193.86.81.–
Řešení
fix0
Stálý člen
7. 4. 2021   #15
-
0
-
Vyřešeno Nejlepší odpověď
Nahlásit jako SPAM
IP: 31.30.170.–
peter
~ Anonymní uživatel
3662 příspěvků
11. 4. 2021   #16
-
+1
-
Zajímavé
fix +

Jak jsi tam psal, ty zadas pozadavek a db ti vrati vysledky ala json, treba. Tak ti to muze vracet jako csv, ten samy php kod. Tak jsem to myslel. Prijde mi to jednodussi nez se drbat s javascriptem, kdyz uz mas vlastne vse hotove.
Pokud to ale nasledne jeste nejak filtrujes u uzivatele, i tak by bylo jednodussi poslat ty filtry php. Hlavne jde o to, ze php ma na csv funkce. 

$filters = $_POST['filters']; // samozrejme bys pridal kontroly proti hackingu a tak
$q = "SELECT ... WHERE ".$filters;
$data = ... fetch();

// https://stackoverflow.com/…array-to-csv
function array2csv($data, $delimiter = ',', $enclosure = '"', $escape_char = "\\")
{
    $f = fopen('php://memory', 'r+');
    foreach ($data as $item) {
        fputcsv($f, $item, $delimiter, $enclosure, $escape_char);
    }
    rewind($f);
    return stream_get_contents($f);
}

$list = array (
    array('aaa', 'bbb', 'ccc', 'dddd'),
    array('123', '456', '789'),
    array('"aaa"', '"bbb"')
);
var_dump(array2csv($list));

// ---NEBO---

 $f=fopen('php://memory','w');
 $header=array("asdf ","asdf","asd","Calasdflee","Start Time","End Time" );      
 fputcsv($f,$header);
 fputcsv($f,$header);
 fputcsv($f,$header); 
 fseek($f,0);
 header('content-type:text/csv'); 
 header('Content-Disposition: attachment; filename="' . $filename . '";');
 fpassthru($f);```

Tuhle jsem delal pro nejaky program, export csv, json, xml, html table, php array().
 

<?php
// --- class ExportData ---

class classExportData
{
private $vars;

function __construct()
	{
	$this->vars = array();
	$this->vars['name']    = 'classExportData';	// evid3 form name / what, template / htx file prefix
//	$this->config = array('debug' => true);
	}

private function isDebug()
	{
	return isset($this->config['debug']) && $this->config['debug']===true ? true : false;
	}

private function errorDebug($fn='')
	{
	return !$this->isDebug() ? '' : 'class'.$this->vars['name'].'::'.$fn.' ';
	}

private function errorAdd($fn='', $text='')
	{
	global $REPORT;
	$REPORT[] = $this->errorDebug($fn).$text;	//$app->errAdd('', $this->errorDebug($fn).$text)
	}

// function defination to convert array to xml
public function arrayToXml( &$data_xml, $data_list=array() )
	{
	foreach( $data_list as $key => $value )
		{
        	if (trim($key)=='')
	  		{continue;}
	 	if (is_array($value))
			{
			if (is_numeric($key))
				{
				$key = "item".$key; //dealing with <0/>..<n/> issues
				}
			$new_child = $data_xml->addChild($key);
			$this->arrayToXml($new_child, $value);
			}
		else	{
			if (is_numeric($key))// if the key is an integer, it needs text
				{
				$key = "key".$key;
				}
			$new_child = $data_xml->addChild("$key", htmlspecialchars("$value"));
			}
		}
	}

public function csvStrToCsv($input=array(), $delimiter = ',', $enclosure = '"')
	{
	if (!is_array($input))
		{return false;}
	foreach($input as $key=>$value)
		{
		if (is_array($value))
			{
			$input[$key] = $this->csvStrToCsv($value, $delimiter, $enclosure);
			}
		}
//	if (is_array($input))
//		{
//		}
        $fp = fopen('php://temp', 'r+');	// Open a memory "file" for read/write...
        fputcsv($fp, $input, $delimiter, $enclosure);
        rewind($fp);
        $data = fread($fp, 1048576);	// limit 1MB per csv line
        fclose($fp);
        return rtrim($data, "\n");
	}


public function format($data=array(), $format='')	// output format php array (/ json / xml / csv - not implement)
	{
	if ($format=='')
		{
		return $data;
		}
	elseif ($format=='csv')
		{
		$content = '';
		$valenc = "\"";
		$coldel = ";";
		$rowdel = "\n";
//		$rowdel = "<br>";	// for html/text
		foreach ($data as $row)
			{
			$content .= $this->csvStrToCsv($row, $coldel) . $rowdel;	// excel csv, del=; enc=" row=\n
			}
		return $content;
		}
	elseif ($format=='json')
		{
		return json_encode($data);
		}
	elseif ($format=='xml')
		{
		$xml = new SimpleXMLElement('<?xml version="1.0"?><data></data>');
		$this->arrayToXml($xml, $data);
		return $xml->asXML();
		}
	elseif ($format=='html')
		{
//var_dump($data); die();
		$pad_table = "\n";
		$pad_tbody = "\n  ";
		$pad_tr    = "\n    ";
		$pad_td    = "\n      ";
		$out = "$pad_table<table>$pad_tbody<tbody>";
		foreach ($data as $row)
			{
//var_dump(is_array($row), $row);
//die();
			if (!is_array($row))
				{
				$out .= "$pad_tr<tr>$pad_td<td>".((string) $row)."</td>$pad_tr</tr>";
				continue;
				}
			$out .= "$pad_tr<tr>";
			foreach ($row as $col)
				{
				$out .= "$pad_td<td>".((string) $col)."</td>";
				}
			$out .= "$pad_tr</tr>";
			}
		$out .= "$pad_tbody</tbody>$pad_table</table>";
		return $out;
		}
	}

}

Nahlásit jako SPAM
IP: 193.84.197.–
fix0
Stálý člen
12. 4. 2021   #17
-
0
-

peter, děkuji ti, ale já už třikrát psal, že to mám hotovo. Řešení je  dokonce označené. Snad sis s tím nedal zbytečně moc práce. Řešení, které mi posíláš (na straně PHP) jsemjsem zvládl dát do kupy už před pár lety. Podobně to mám už roky hotové. To ale v mém případě nešlo použít kvůli tomu, že v mém případě neexistuje
$_POST['filters']

Je to vyřešené, ale děkuji všem moc za váš čas a snahu mi pomoci.

Nahlásit jako SPAM
IP: 31.30.170.–
peter
~ Anonymní uživatel
3662 příspěvků
12. 4. 2021   #18
-
0
-

$_POST['filters'], tam dosadis vlastni nazev promenne :)
Jj, cetl jsem, jen se mi zdalo, ze jsme se uplne nepochopili. Coz s mou slabou vysvetlovaci schopnosti neni nic noveho :)

Nahlásit jako SPAM
IP: 193.84.197.–
Zjistit počet nových příspěvků

Přidej příspěvek

×Vložení zdrojáku

×Vložení obrázku

Vložit URL obrázku Vybrat obrázek na disku
Vlož URL adresu obrázku:
Klikni a vyber obrázek z počítače:

×Vložení videa

Aktuálně jsou podporována videa ze serverů YouTube, Vimeo a Dailymotion.
×
 
Podporujeme Gravatara.
Zadej URL adresu Avatara (40 x 40 px) nebo emailovou adresu pro použití Gravatara.
Email nikam neukládáme, po získání Gravatara je zahozen.
-
Pravidla pro psaní příspěvků, používej diakritiku. ENTER pro nový odstavec, SHIFT + ENTER pro nový řádek.
Sledovat nové příspěvky (pouze pro přihlášené)
Sleduj vlákno a v případě přidání nového příspěvku o tom budeš vědět mezi prvními.
Reaguješ na příspěvek:

Uživatelé prohlížející si toto vlákno

Uživatelé on-line: 0 registrovaných, 3 hosté

 

Hostujeme u Českého hostingu       ISSN 1801-1586       ⇡ Nahoru Webtea.cz logo © 20032021 Programujte.com
Zasadilo a pěstuje Webtea.cz, šéfredaktor Lukáš Churý