Extraction fichier CSV

**zozotitou** · 10/09/2013, 10h43

Bonjour tout le monde,
Je n'arrive pas à afficher une liste environ 50 lignes, le script affiche tout le tableau CSV.
Je cherche de l'aide pour y arriver
Voici le script.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
 
<!DOCTYPE html>
<html lang="fr">
<head>
	<meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=iso-8859-1">	
 
	<title>Extraction fichier CSV</title>
 
 
 
	<link rel="stylesheet" href="css/csvtable.css" type="text/css" />
 
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/jquery-ui-1.10.3.custom.min.js"></script>
	<script type="text/javascript" src="js/jquery.csvToTable.js"></script>
	<!--<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>-->
	<!--<script type="text/javascript" src="js/jquery.tablesorter.dev.js"></script>-->
	<!--<script type="text/javascript" src="js/jquery-latest.js"></script>-->
 
	<script>
	$(function() 
	{
		$('#CSVTable').CSVToTable('Test_2013.csv', 
			{ 
				loadingImage: 'images/loading.gif', 
				startLine: 0
				,headers: ['Action', 'Date', 'Région','Caisse','Valeur']
			}
		  ).bind("loadComplete",function() { 
			  <!--$('#CSVTable').find('TABLE').tablesorter();-->
			$('#CSVTable').find('table').tablesorter();
		  });;
 
			$("#table") 		
			.tablesorter({widthFixed: true, widgets: ['zebra']}) 
			.tablesorterPager({container: $("#pager")}); 
 
 
	});
 
 </script>
</head>
<body>
 
<br>
CSV To Table:<br>
<div id="CSVTable">
 
</div>
<div id="pager" class="pager">
	<form>
		<img src="images/first.png" class="first"/>
		<img src="images/prev.png" class="prev"/>
		<input type="text" class="pagedisplay"/>
		<img src="images/next.png" class="next"/>
		<img src="images/last.png" class="last"/>
 
		<select class="pagesize">
			<option selected="selected"  value="10">10</option>
			<option value="20">20</option>
			<option value="30">30</option>
			<option  value="40">40</option>
		</select>
	</form>
</div>
 
</body>
</html>

Il faudrait que je puisse afficher un page par date.

Merci de votre aide.
Zozotitou

**Kaamo** · 11/09/2013, 13h52

Qu'est-ce que :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
$("#table") 		
.tablesorter({widthFixed: true, widgets: ['zebra']}) 
.tablesorterPager({container: $("#pager")});

Fais placé là ? N'importe où ? As-tu un id "table" dans ton code ? C'est bie nde récupérer des codes de plugins, encore faut-il lire correctement la documentation et l'adapter à ses besoins

Il faut appliquer le tablesorter dans ta fonction post récupération des données du CSV !

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
// blabla
.bind("loadComplete",function() { 
  $('#CSVTable').find('table')
  .tablesorter({widthFixed: true, widgets: ['zebra']}) 
  .tablesorterPager({container: $("#pager")});
});

**zozotitou** · 11/09/2013, 14h42

Bonjour Kaamo et tout le monde,

J'ai changé le bout de code mais je n'ai plus rien à l'affichage.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
 
<!DOCTYPE html>
<html lang="fr">
<head>
	<meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=iso-8859-1">	
 
	<title>Extraction fichier CSV</title>
 
 
 
	<link rel="stylesheet" href="css/csvtable.css" type="text/css" />
 
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/jquery-ui-1.10.3.custom.min.js"></script>
	<script type="text/javascript" src="js/jquery.csvToTable.js"></script>
	<!--<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>-->
	<!--<script type="text/javascript" src="js/jquery.tablesorter.dev.js"></script>-->
	<!--<script type="text/javascript" src="js/jquery-latest.js"></script>-->
 
	<script>
		$(function() 
			{
				$('#CSVTable').CSVToTable('ASUR_2013.csv', 
				{ 
					loadingImage: 'images/loading.gif', 
					startLine: 0
					,headers: ['Action', 'Date', 'Région','Caisse','Valeur']
				}
				.bind("loadComplete",function() { 
				$('#CSVTable').find('TABLE')
				.tablesorter({widthFixed: true, widgets: ['zebra']}) 
				.tablesorterPager({container: $("#pager")});
				});
			)};
 
 </script>
</head>
<body>
 
<br>
CSV To Table:<br>
<div id="CSVTable">
 
</div>
<div id="pager" class="pager">
	<form>
		<img src="images/first.png" class="first"/>
		<img src="images/prev.png" class="prev"/>
		<input type="text" class="pagedisplay"/>
		<img src="images/next.png" class="next"/>
		<img src="images/last.png" class="last"/>
 
		<select class="pagesize">
			<option selected="selected"  value="10">10</option>
			<option value="20">20</option>
			<option value="30">30</option>
			<option value="40">40</option>
			<option value="50">50</option>
		</select>
	</form>
</div>
 
</body>
</html>

Merci de voir ce problème, je me tiens à ta disposition.
Zozotitou

**Kaamo** · 11/09/2013, 14h43

La coloration syntaxique ne te mets pas sur la voie ?
Il manque une ' à Région

EDIT : et sûrement une ou deux accolades. Indente bien ton code et tu verras facilement où est l'erreur

**zozotitou** · 11/09/2013, 15h18

J'ai modifié et toute la liste qui s'affiche à nouveau.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
 
<!DOCTYPE html>
<html lang="fr">
<head>
	<meta HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=iso-8859-1">	
 
	<title>Extraction fichier CSV</title>
 
 
 
	<link rel="stylesheet" href="css/csvtable.css" type="text/css" />
 
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/jquery-ui-1.10.3.custom.min.js"></script>
	<script type="text/javascript" src="js/jquery.csvToTable.js"></script>
	<!--<script type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>-->
	<!--<script type="text/javascript" src="js/jquery.tablesorter.dev.js"></script>-->
	<!--<script type="text/javascript" src="js/jquery-latest.js"></script>-->
 
	<script>
	$(function() 
	{
		$('#CSVTable').CSVToTable('Test_2013.csv', 
			{ 
				loadingImage: 'images/loading.gif', 
				startLine: 0
				,headers: ['Action','Date','Région','Caisse','Valeur']
			}
			).bind("loadComplete",function() { 
				$('#CSVTable').find('table')
				.tablesorter({widthFixed: true, widgets: ['zebra']}) 
				.tablesorterPager({container: $("#pager")});
 
			});;
 
			$("#table") 		
			<!--.tablesorter({widthFixed: true, widgets: ['zebra']}) 
			<!--.tablesorterPager({container: $("#pager")}); 
 
 
	});
 
 </script>
</head>
<body>
 
<br>
CSV To Table:<br>
<div id="CSVTable">
 
</div>
<div id="pager" class="pager">
	<form>
		<img src="images/first.png" class="first"/>
		<img src="images/prev.png" class="prev"/>
		<input type="text" class="pagedisplay"/>
		<img src="images/next.png" class="next"/>
		<img src="images/last.png" class="last"/>
 
		<select class="pagesize">
			<option selected="selected"  value="10">10</option>
			<option value="20">20</option>
			<option value="30">30</option>
			<option  value="40">40</option>
		</select>
	</form>
</div>
 
</body>
</html>
 
Je ne vois pas quand tu parles du ID=table ??

**SpaceFrog** · 11/09/2013, 15h19

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
{ 
					loadingImage: 'images/loading.gif', 
					startLine: 0
					,headers: ['Action', 'Date', 'Région','Caisse','Valeur']
				}

curieuse façon d'indenter un json ... clea ne m'étonne pas que tu te perdes dans ton code ...
les virgules en fin de ligne ... pas au début !

**Bovino** · 11/09/2013, 15h23

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<!--.tablesorter({widthFixed: true, widgets: ['zebra']})

Renseigne-toi sur la façon de commenter en JavaScript ! En faisant ça, tu provoques une erreur (qui devrait du reste te sauter aux yeux dans Firebug ou toute autre console JavaScript).

**Kaamo** · 11/09/2013, 15h27

Ou au début ... et pas en fin de lignes

En tout cas, il faut choisir ... je fais parti des 10%

(npm coding style)

Extraction fichier CSV

jQuery

Vue hybride

Discussions similaires

Partager

Partager