Export Excel d'un tableau avec Javascript

Bonjour tout le monde, j'essaie sans réussir d'exporter un tableau sous Excel.

L'utilisateur rentre des valeurs et en fonction le tableau est plus ou moins rempli d'information. Ce que je souhaite c'est un bouton export qui me permette de transformer ce tableau pour l'ouvrir avec Excel. Le problème est que je n'ai réussi à faire fonctionner aucune des solutions trouvé sur le net.

Je vous joins le code pour m'aider svp.

Merci !!

Pièce jointe 407674

Code:

---

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 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795 796 797 798 799 800 801 802 803 804 805 806 807 808 809 810 811 812 813 814 815 816 817 818 819 820 821 822 823 824 825 826 827 828 829 830 831 832 833 834 835 836 837 838 839 840 841 842 843 844 845 846 847 848 849 850 851 852 853 854 855 856 857 858 859 860 861 862 863 864 865 866 867 868 869 870 871 872 873 874 875 876 877 878 879 880 881 882 883 884 885 886 887 888 889 890 891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921

<?php $this->titre = "Paiements"; $this->menu = "paiement";   date_default_timezone_set('Europe/Paris');   setlocale(LC_TIME,'fr_FR.utf8','fra');   ?> <div class="row cd-main-content"> <div class="col s12 m12 l10 offset-l1 cd-gallery" style="margin-top:50px;">   <div class="row" id="paiements_container">           <ul class="collection with-header" id="collection_virement"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements virement</h6></li> <? foreach($paiements_virement as $paiement): ?>       <li class="collection-item avatar" id="paiement_virement_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-action-payment yellow circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="date_virement_<?= $paiement['id'] ?>"><?= Date("d/m/Y",strtotime($paiement['date'])) ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_virement_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:22%;max-width:22%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifVirement(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'virement')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>     <ul class="collection with-header" id="collection_espece"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements espèce</h6></li> <? foreach($paiements_especes as $paiement): ?>       <li class="collection-item avatar" id="paiement_especes_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-editor-attach-money green darken-2 circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_especes_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span>   <span style="display:inline-block;min-width:22%;max-width:22%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span>   </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifEspeces(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'especes')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i>   </li>   <? endforeach; ?> </ul>       <ul class="collection with-header" id="collection_prelevement"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements prélèvement</h6></li> <? foreach($paiements_prelevement as $paiement): ?>       <li class="collection-item avatar" id="paiement_prelevement_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-content-redo blue circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_prelevement_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:22%;max-width:22%;"><?= $paiement['num_remise'] ?></span> <input type="hidden" id="num_remise_prelevement_<?= $paiement['id'] ?>" value="<?= $paiement['num_remise'] ?>" /> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifPrelevement(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'prelevement')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>       <ul class="collection with-header" id="collection_cesu_web"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements cesu web</h6></li> <? foreach($paiements_cesu_web as $paiement): ?>       <li class="collection-item avatar" id="paiement_cesu_web_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-action-receipt red circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_cesu_web_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:22%;max-width:22%;"><?= $paiement['num_remise'] ?></span>   <span style="display:inline-block;min-width:22%;max-width:22%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span>   <input type="hidden" id="num_remise_cesu_web_<?= $paiement['id'] ?>" value="<?= $paiement['num_remise'] ?>" /> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifCesuWeb(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'cesu_web')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>       <ul class="collection with-header" id="collection_cesu_papier"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements cesu papier</h6></li> <? foreach($paiements_cesu_papier as $paiement): ?>       <li class="collection-item avatar" id="paiement_cesu_papier_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-action-receipt red circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_cesu_papier_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:22%;max-width:22%;"><?= $paiement['num_remise'] ?></span>   <span style="display:inline-block;min-width:22%;max-width:22%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span>   <input type="hidden" id="num_remise_cesu_papier_<?= $paiement['id'] ?>" value="<?= $paiement['num_remise'] ?>" /> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifCesuPapier(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'cesu_papier')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>       <ul class="collection with-header" id="collection_cheque"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements chèque</h6></li> <? foreach($paiements_cheque as $paiement): ?>     <li class="collection-item avatar" id="paiement_cheque_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-av-subtitles green circle" ></i> <p style="font-weight:bold;margin-left:50px;"> <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:12%;max-width:12%;" id="montant_cheque_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:12%;max-width:12%;"><?= $paiement['numero_remise'] ?></span>   <span style="display:inline-block;min-width:12%;max-width:12%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span> <span style="display:inline-block;min-width:12%;max-width:12%;"><?= $paiement['num_cheque'] ?></span>     <input type="hidden" id="num_remise_cheque_<?= $paiement['id'] ?>" value="<?= $paiement['id_remise'] ?>" /> <input type="hidden" id="banque_cheque_<?= $paiement['id'] ?>" value="<?= $paiement['banque'] ?>" /> <input type="hidden" id="num_cheque_cheque_<?= $paiement['id'] ?>" value="<?= $paiement['num_cheque'] ?>" /> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifCheque(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'cheque')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>     </div>   </div>   <div class="cd-filter"> <form style="padding-bottom:0px;"> <div class="cd-filter-block"> <h4>Identité</h4>   <div class="row"> <div class="col s12"> <label>Type paiement</label> <select id="type_paiement"> <option value="0" >Tous</option> <option value="1" >Virement</option> <option value="2" >Prélèvement</option> <option value="3" >Espèce</option> <option value="4" >Cesu web</option> <option value="5" >Cesu papier</option> <option value="6" >Chèque</option> </select> </div> <div class="input-field col s12"> <input onkeyup="rechercher_num_remise();" type="text" id="recherche_num_remise"/> <label for="recherche_num_remise">Numéro remise</label> </div> <div class="input-field col s12"> <input onkeyup="rechercher_num_cheque();" type="text" id="recherche_num_cheque"/> <label for="recherche_num_cheque">Numéro chèque</label> </div>   <div class="input-field col s12"> <input onkeyup="rechercher_num_facture();" type="text" id="recherche_num_facture"/> <label for="recherche_num_facture">Numéro facture</label> </div>   </div> <div class="row" style="bottom:0px;margin-bottom:0px;">   <div class="col s12">   <label for="select_client" style="font-size: 1rem;font-weight: bold;color: #000000;">Client</label> <select id="select_client" class="browser-default" data-placeholder="Choisissez un client" onchange="rechercher();"> <option value=""></option> <? foreach($clients as $client): ?>   <option value="<?= $client['id'] ?>"><?= $client['nom']." ".$client['prenom'] ?></option>   <? endforeach; ?> </select>   </div> <div class="input-field col s12"> <input id="recherche_date_debut" type="date" onchange="rechercher();"> <label for="recherche_date_debut" class="active">Date entre :</label> </div> <div class="input-field col s12"> <input id="recherche_date_fin" type="date" onchange="rechercher();"> <label for="recherche_date_fin" class="active">Et :</label> </div>   </div> </div> <!-- cd-filter-block --> </form> <a class="cd-close">Close</a> </div> <!-- cd-filter -->   <a class="cd-filter-trigger" style="cursor:pointer;">Recherche</i></a>   </div>       <div id="modal_virement" class="modal modal-fixed-footer"> <div class="modal-content"> <div class="header-modal blue-grey white-text"> <h4>Modification virement</h4> </div>   <div class="row"> <div class="input-field col s6"> <input type="date" id="date_modif_virement" /> <label class="active">Date virement</label> </div> <div class="input-field col s6"> <input type="text" id="montant_modif_virement" /> <label id="label_montant_modif_virement" class="active">Montant</label> </div> <input type="hidden" id="id_modif_virement" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_virement()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_especes" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification espèce</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s6"> <input type="text" id="montant_modif_especes" /> <label id="label_montant_modif_especes" class="active">Montant</label> </div> <input type="hidden" id="id_modif_especes" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_especes()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_prelevement" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification prélèvement</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s4"> <input type="text" id="num_remise_modif_prelevement" /> <label id="label_num_remise_modif_prelevement" class="active">Numéro remise</label> </div> <div class="input-field col s4"> <input type="text" id="montant_modif_prelevement" /> <label id="label_montant_modif_prelevement" class="active">Montant</label> </div> <input type="hidden" id="id_modif_prelevement" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_prelevement()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_cesu_web" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification cesu web</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s4"> <input type="text" id="num_remise_modif_cesu_web" /> <label id="label_num_remise_modif_cesu_web" class="active">Numéro remise</label> </div> <div class="input-field col s4"> <input type="text" id="montant_modif_cesu_web" /> <label id="label_montant_modif_cesu_web" class="active">Montant</label> </div> <input type="hidden" id="id_modif_cesu_web" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_cesu_web()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_cesu_papier" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification cesu papier</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s4"> <input type="text" id="num_remise_modif_cesu_papier" /> <label id="label_num_remise_modif_cesu_papier" class="active">Numéro remise</label> </div> <div class="input-field col s4"> <input type="text" id="montant_modif_cesu_papier" /> <label id="label_montant_cesu_papier" class="active">Montant</label> </div> <input type="hidden" id="id_modif_cesu_papier" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_cesu_papier()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_cheque" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification chèque</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s3"> <input type="text" id="num_cheque_modif_cheque" /> <label id="label_num_cheque_modif_cheque" class="active">Numéro chèque</label> </div> <div class="input-field col s3"> <input type="text" id="montant_modif_cheque" /> <label id="label_montant_modif_cheque" class="active">Montant</label> </div> <div class="col s3"> <label>Numéro remise</label> <select class="browser-default" id="num_remise_modif_cheque">   <? foreach($remises as $remise): ?>   <option value="<?= $remise['id'] ?>"><?= $remise['numero_remise'] ?></option>   <? endforeach; ?> </select> </div> <input type="hidden" id="id_modif_cheque" /> </div> <div class="input-field col s12"> <input type="text" id="banque_modif_cheque" /> <label id="label_banque_modif_virement" class="active">Banque / Nom</label> </div> </div> <div class="modal-footer"> <a onclick="modifier_cheque()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <script type="text/javascript">     $(document).ready(function(){   $('.modal-trigger').leanModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: 0.5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration); });   $("#type_paiement").change(function(){   var type = this.value;   if(type==0) { $("#collection_cheque").show(); $("#collection_virement").show(); $("#collection_prelevement").show(); $("#collection_cesu_web").show(); $("#collection_cesu_papier").show(); $("#collection_espece").show(); } if(type==1) { $("#collection_cheque").hide(); $("#collection_virement").show(); $("#collection_prelevement").hide(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").hide(); $("#collection_espece").hide(); } if(type==2) { $("#collection_cheque").hide(); $("#collection_virement").hide(); $("#collection_prelevement").show(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").hide(); $("#collection_espece").hide(); } if(type==3) { $("#collection_cheque").hide(); $("#collection_virement").hide(); $("#collection_prelevement").hide(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").hide(); $("#collection_espece").show(); } if(type==4) { $("#collection_cheque").hide(); $("#collection_virement").hide(); $("#collection_prelevement").hide(); $("#collection_cesu_web").show(); $("#collection_cesu_papier").hide(); $("#collection_espece").hide(); } if(type==5) { $("#collection_cheque").hide(); $("#collection_virement").hide(); $("#collection_prelevement").hide(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").show(); $("#collection_espece").hide(); } if(type==6) { $("#collection_cheque").show(); $("#collection_virement").hide(); $("#collection_prelevement").hide(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").hide(); $("#collection_espece").hide(); }   });     $('select').material_select();   $("#select_client").chosen({ allow_single_deselect: true, no_results_text: "Oops, pas de client!" });   $('.datepicker').pickadate({ monthsFull: ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Decembre'], monthsShort: ['Jan', 'Fév', 'Mar', 'Avr', 'Mai', 'Jui', 'Jul', 'Aou', 'Sep', 'Oct', 'Nov', 'Dec'], weekdaysFull: ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'], weekdaysShort: ['Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam'], format: 'yyyy-mm-dd', today: 'Ajourd\'hui', clear: 'Effacer', close: 'Fermer' }) });   function rechercher() { var client = document.getElementById("select_client").value; var date_debut = document.getElementById("recherche_date_debut").value; var date_fin = document.getElementById("recherche_date_fin").value;     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText!="") { document.getElementById("paiements_container").innerHTML=xmlhttp.responseText; } else { document.getElementById("paiements_container").innerHTML="<h1>Aucun résultat</h1>"; } } } xmlhttp.open("POST", "Paiement/recherche/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("client="+client+"&date_debut="+date_debut+"&date_fin="+date_fin);     }   function rechercher_num_remise() { var num_remise = $("#recherche_num_remise").val();   xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText!="") { document.getElementById("paiements_container").innerHTML=xmlhttp.responseText; } else { document.getElementById("paiements_container").innerHTML="<h1>Aucun résultat</h1>"; } } } xmlhttp.open("POST", "Paiement/rechercheRemise/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("num_remise="+num_remise); }       function rechercher_num_cheque() { var num_cheque = $("#recherche_num_cheque").val();   xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText!="") { document.getElementById("paiements_container").innerHTML=xmlhttp.responseText; } else { document.getElementById("paiements_container").innerHTML="<h1>Aucun résultat</h1>"; } } } xmlhttp.open("POST", "Paiement/rechercheCheque/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("num_cheque="+num_cheque);     }   function rechercher_num_facture() { var num_facture = $("#recherche_num_facture").val();   xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText!="") { document.getElementById("paiements_container").innerHTML=xmlhttp.responseText; } else { document.getElementById("paiements_container").innerHTML="<h1>Aucun résultat</h1>"; } } } xmlhttp.open("POST", "Paiement/rechercheFacture/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("num_facture="+num_facture);     }   function modifier_virement() { var id = $("#id_modif_virement").val(); var date = $("#date_modif_virement").val(); var montant = $("#montant_modif_virement").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { date = moment(date,"YYYY-MM-DD").format("DD/MM/YYYY"); $("#date_virement_"+id).html(date); $("#montant_virement_"+id).html(montant+" €"); } } } xmlhttp.open("POST", "Paiement/modifierVirement/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&date="+date+"&montant="+montant);   }   function modifier_especes() { var id = $("#id_modif_especes").val(); var montant = $("#montant_modif_especes").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_especes_"+id).html(montant+" €"); } } } xmlhttp.open("POST", "Paiement/modifierEspeces/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant);   }   function modifier_prelevement() { var id = $("#id_modif_prelevement").val(); var montant = $("#montant_modif_prelevement").val(); var num_remise = $("#num_remise_modif_prelevement").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_prelevement_"+id).html(montant+" €"); $("#num_remise_prelevement_"+id).html(num_remise); } } } xmlhttp.open("POST", "Paiement/modifierPrelevement/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant+"&num_remise="+num_remise);   }   function modifier_cesu_web() { var id = $("#id_modif_cesu_web").val(); var montant = $("#montant_modif_cesu_web").val(); var num_remise = $("#num_remise_modif_cesu_web").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_cesu_web_"+id).html(montant+" €"); $("#num_remise_cesu_web_"+id).html(num_remise); } } } xmlhttp.open("POST", "Paiement/modifierCesu/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant+"&num_remise="+num_remise);   }   function modifier_cesu_papier() { var id = $("#id_modif_cesu_papier").val(); var montant = $("#montant_modif_cesu_papier").val(); var num_remise = $("#num_remise_modif_cesu_papier").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_cesu_papier_"+id).html(montant+" €"); $("#num_remise_cesu_papier_"+id).html(num_remise); } } } xmlhttp.open("POST", "Paiement/modifierCesu/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant+"&num_remise="+num_remise);   }   function modifier_cheque() { var id = $("#id_modif_cheque").val(); var montant = $("#montant_modif_cheque").val(); var num_remise = $("#num_remise_modif_cheque").val(); var num_remise_html = $("#num_remise_modif_cheque option:selected").text(); var num_cheque = $("#num_cheque_modif_cheque").val(); var banque = $("#banque_modif_cheque").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_cheque_"+id).html(montant+" €"); $("#num_remise_cheque_"+id).val(num_remise); $("#num_remise_cheque_html_"+id).html(num_remise_html); $("#num_cheque_cheque_"+id).html(num_cheque); $("#banque_cheque_"+id).html(banque); } } } xmlhttp.open("POST", "Paiement/modifierCheque/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant+"&num_remise="+num_remise+"&num_cheque="+num_cheque+"&banque="+banque);   }     function modifVirement(id) {   var date = $("#date_virement_"+id).html(); date = moment(date,"DD/MM/YYYY").format("YYYY-MM-DD"); var montant = $("#montant_virement_"+id).html(); $("#label_montant_modif_virement").addClass("active"); montant = montant.replace(" €","");   $("#date_modif_virement").val(date); $("#montant_modif_virement").val(montant); $("#id_modif_virement").val(id);   $('#modal_virement').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   }   function modifEspeces(id) {   var montant = $("#montant_especes_"+id).html(); montant = montant.replace(" €","");   $("#montant_modif_especes").val(montant); $("#id_modif_especes").val(id); $("#label_montant_modif_especes").addClass("active");   $('#modal_especes').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   }   function modifPrelevement(id) {   var montant = $("#montant_prelevement_"+id).html(); var num_remise = $("#num_remise_prelevement_"+id).val(); montant = montant.replace(" €","");   $("#montant_modif_prelevement").val(montant); $("#id_modif_prelevement").val(id); $("#num_remise_modif_prelevement").val(num_remise); $("#label_montant_modif_prelevement").addClass("active"); $("#label_num_remise_modif_prelevement").addClass("active");   $('#modal_prelevement').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   }   function modifCesuWeb(id) {   var montant = $("#montant_cesu_web_"+id).html(); var num_remise = $("#num_remise_cesu_web_"+id).val(); montant = montant.replace(" €","");     $("#montant_modif_cesu_web").val(montant); $("#id_modif_cesu_web").val(id); $("#num_remise_modif_cesu_web").val(num_remise); $("#label_montant_modif_cesu_web").addClass("active"); $("#label_num_remise_modif_cesu_web").addClass("active");   $('#modal_cesu_web').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   } function modifCesuPapier(id) {   var montant = $("#montant_cesu_papier_"+id).html(); var num_remise = $("#num_remise_cesu_papier_"+id).val(); montant = montant.replace(" €","");   $("#montant_modif_cesu_papier").val(montant); $("#id_modif_cesu_papier").val(id); $("#num_remise_modif_cesu_papier").val(num_remise); $("#label_montant_modif_cesu_papier").addClass("active"); $("#label_num_remise_modif_cesu_papier").addClass("active");   $('#modal_cesu_papier').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   } function modifCheque(id) {   var montant = $("#montant_cheque_"+id).html(); var num_remise = $("#num_remise_cheque_"+id).val(); var num_cheque = $("#num_cheque_cheque_"+id).val(); var banque = $("#banque_cheque_"+id).val(); montant = montant.replace(" €","");   $("#montant_modif_cheque").val(montant); $("#id_modif_cheque").val(id); $('#num_remise_modif_cheque').val(num_remise).prop('selected', true); $("#num_cheque_modif_cheque").val(num_cheque); $("#banque_modif_cheque").val(banque); $("#label_montant_modif_cheque").addClass("active"); $("#label_num_cheque_modif_cheque").addClass("active"); $("#label_banque_modif_cheque").addClass("active");   $('#modal_cheque').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   }   function suppr(id,type) {     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="suppr_ok") { $("#paiement_"+type+"_"+id).remove(); } else { swal("Attention !","La suppression à échoué !","error"); } } } xmlhttp.open("POST", "Paiement/supprimer/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&type="+type);     }           </script>

---

en javascript ?

je pense plutot que tu devrais utiliser php pour faire un export excel, il doit bein exister une classe php2XL ou un truc du genre ...

Je pris en charge un projet déjà existant et de ce que j'ai pu comprendre c'est que : Il utilisait une architecture MCV. Dans la vu il a un bouton qui fait appelle à une fonction en javascript qui va convertir une "table" en Exel. Et dans le controleur (en php) il gère les entrés du tableau en le remplissant.

Je peux te montrer à quoi cela ressemble si j'ai pas été clair. Mon problème est que je ne parviens pas à reproduire son schéma ou n'importe quel autre pour réussir à avoir mon export. (Peut être basculer la gestion de l'écriture du tableau dans le controleur associé ? )

Bon j'ai réussi à résoudre mon problème à moiter. J'arrive à récupérer toutes les valeurs dans un tableau puis à l'exporter. Il ne me reste plus qu'à trouver une solution pour effectuer les filtres fait par le javascript sur mon tableau en HTML. Si jamais vous avez des idées je suis TRES preneur.

Pour ceux qui se posent la même question et si vous êtes dans le même cas que moi : quand vous afficher les valeurs à l'ecran, implémenter les aussi dans un array php grâce à array_push($IdArray, array(toutes vos valurs par ligne)) en php. Après il vous suffit de remplir un tableau vide avec tous vos types de valeurs avec des foreach. Dans mon cas :

Code:

---

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

<table id='tableau1' style="display: none"> <thead> <tr> <th>Nom et prenom</th> <th>Montant</th> <th>Date de Paiement</th> <th>Date de facturation </th> <th>Numero de remise </th> <th>Numero de cheque </th> <th>Nom de la Banque </th> </thead> <tbody> <?php foreach ($tableau_virement as $row): array_map('htmlentities', $row); ?> <tr> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_prelevement as $row): array_map('htmlentities', $row); ?> <tr> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_espece as $row): array_map('htmlentities', $row); ?> <tr> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_cesu_web as $row): array_map('htmlentities', $row); ?> <tr> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_cesu_papier as $row): array_map('htmlentities', $row); ?> <tr> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_cheque as $row): array_map('htmlentities', $row); ?> <tr id="collection_chequet"> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> </tbody> </table>

---

Citation:

---

Envoyé par Annaga

j'essaie sans réussir d'exporter un tableau sous Excel.

---

Bon alors pour commencer, stp, formule correctement en bon Français, parce que ta phrase ne correspond pas à ce que tu veux.

j'essaie /../ d'exporter les données d'un tableau HTML dans un fichier pouvant être directement exploitable par Excel.

Parce ce que tu à écrit signifie : j'essaie d'exporter un tableau Excel => et dans ce cas c'est un problème vba et non JavaScript.

Il y 3 problématiques dans ta question :
1 - parcourir une table HTML, en utilisant JavaScript, pour y collecter les données à exporter
2 - formater ses données pour qu'elles puisse être exploitable par Excel
3 - les Exporter dans un fichier qu'Excel pourra ouvrir.

Problème 1
Parcourrir un tableau HTML en JS c'est faisable, mais ça peut demander pas mal de code à produire, et vu que ton code est en Vanilla JS ça peut devenir vite piégeux


Problème 2
Excel supporte pas mal de formats en entreé, du plus simple au plus compliqué:
- fichier texte (séparateur = TAB )
- fichier csv (attention au différents formats de séparteurs possibles
- fichier SYLK ( on l'oublie souvent mais il existe toujours )
- fichier XML ( différents format, dont open Doc)
- fichier HTML ( juste la partie entre <TABLE> et </TABLE> ) petit avantage on peut y ajouter un peu de style, mais en restant en HTML4
- fichier JSON (ben non, faut utiliser une macro vba)

Problème 3
en principe les navigateurs ne permettent pas d'interagir avec leur système hôte, au niveau du File Système.
En HTML5, les choses ont un peut changé dans le sens ou il permettent maintenant une lecture ou une écriture stricte.

--Pour la lecture on passe par l'aPI du FileReeader => https://developer.mozilla.org/fr/doc...API/FileReader

--Pour l'écriture, cela relève plus de l'astuce que d'une fonctionnalité "reconnue" : on exporte un objet JS interne en activant la partie "enregistrement des données en local" de la fonctionnalité download , qui est inclue dans tous les navigateurs.
mais du coup les fichiers se retrouvent dans le répertoire par défaut de tous les téléchargement.

c'est par la => https://eligrey.com/blog/saving-gene...e-client-side/

Oui j'avais bien compris que malheureusement je n'avais pas été très clair.. Je venais d’arriver devant ce problème et comme c'était un problème que je n'avais jamais rencontré.

Merci pour ta réponse complète. Si j'ai bien compris (pas assez sinon je redemanderais pas malheureusement) je dois lire le contenu de ma div avec l'API File reader. Et ensuite j'utilise le contenu de ma variable contenant le résultat de la lecture obtenu avec FileReader pour le sauvegarder selon le type qui me va avec le deuxième outil que tu m'as indiqué? (readAsText pour FileReader par exemple et pour la trasnformation avec le SaveAs?)

Merci

oublie le file reader, c'est une api JS native qui était juste la pour illustrer mon propos, elle n'a rien à voir avec ta question.

Si tu veux parcourrir plus simplement ta table HTML, utilise jQuery, ce sera un peu plus simple.

Mon problème est que la table html que je viens de créer récupérè tout le contenu de tous mes clients. Sauf que j'ai un onglet pour faire des modifications d'affichages, et ainsi avoir uniquement les clients ayant payés par cb afficher. Ce nouveau affichage est généré via le JS et mon tableau est coter serveur. Actuellement j'arrive à avoir un fichier excel propre de tous les clients mais je ne parviens pas à créer une table <table> pour pouvoir le transformer en Excel. Du moment ou je parvient a avoir une table , je peux obtenir mon fichier Excel. Je cherche une solution pour mettre à jour un Array coter client par exemple selon la vue, soit réussir à optenir une table ne contenant uniquement les informations nécessaires...

comment ton nouveau tableau HTML est-il fabriqué par ton code JS ?

(Tu peux t'appuyer sur la 1er post pour suivre ce que je dis si c'est pas clair)

L'affichage des paiements effectués par les clients ce fait dans une div générale paiements_container qui contient une div par type de paiement. Au chargement on remplit les différentes div avec tous les clients qui ont fait un paiement. ( Foreach client ...). Sur la gauche on a un panneau pour faire l'affinage de sélection. Si on choisit un type de paiement, on affiche ou cache la div correspondante au type de paiement. Pour les clients la je n'ai pas très bien compris ce que l'ancien salarié a fait donc je vais éviter de dire des bêtises.

tableau1 c'est le tableau que j'ai reussi à obtenir en récupérant au vol les données affichées dans les foreach. Je peux lui le telecharger avec la fonction fnExcelReport appelé par le clique du bouton (ligne 417).

Je te remets ici le nouveau fichier index.php sur le quel je travaille.
J'ai conscience de pas être très clair vu que moi même je comprend pas tout ce qu'y a été fait.


Merci pour ton temps

Code:

---

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 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190 191 192 193 194 195 196 197 198 199 200 201 202 203 204 205 206 207 208 209 210 211 212 213 214 215 216 217 218 219 220 221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240 241 242 243 244 245 246 247 248 249 250 251 252 253 254 255 256 257 258 259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284 285 286 287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303 304 305 306 307 308 309 310 311 312 313 314 315 316 317 318 319 320 321 322 323 324 325 326 327 328 329 330 331 332 333 334 335 336 337 338 339 340 341 342 343 344 345 346 347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372 373 374 375 376 377 378 379 380 381 382 383 384 385 386 387 388 389 390 391 392 393 394 395 396 397 398 399 400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415 416 417 418 419 420 421 422 423 424 425 426 427 428 429 430 431 432 433 434 435 436 437 438 439 440 441 442 443 444 445 446 447 448 449 450 451 452 453 454 455 456 457 458 459 460 461 462 463 464 465 466 467 468 469 470 471 472 473 474 475 476 477 478 479 480 481 482 483 484 485 486 487 488 489 490 491 492 493 494 495 496 497 498 499 500 501 502 503 504 505 506 507 508 509 510 511 512 513 514 515 516 517 518 519 520 521 522 523 524 525 526 527 528 529 530 531 532 533 534 535 536 537 538 539 540 541 542 543 544 545 546 547 548 549 550 551 552 553 554 555 556 557 558 559 560 561 562 563 564 565 566 567 568 569 570 571 572 573 574 575 576 577 578 579 580 581 582 583 584 585 586 587 588 589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607 608 609 610 611 612 613 614 615 616 617 618 619 620 621 622 623 624 625 626 627 628 629 630 631 632 633 634 635 636 637 638 639 640 641 642 643 644 645 646 647 648 649 650 651 652 653 654 655 656 657 658 659 660 661 662 663 664 665 666 667 668 669 670 671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691 692 693 694 695 696 697 698 699 700 701 702 703 704 705 706 707 708 709 710 711 712 713 714 715 716 717 718 719 720 721 722 723 724 725 726 727 728 729 730 731 732 733 734 735 736 737 738 739 740 741 742 743 744 745 746 747 748 749 750 751 752 753 754 755 756 757 758 759 760 761 762 763 764 765 766 767 768 769 770 771 772 773 774 775 776 777 778 779 780 781 782 783 784 785 786 787 788 789 790 791 792 793 794 795 796 797 798 799 800 801 802 803 804 805 806 807 808 809 810 811 812 813 814 815 816 817 818 819 820 821 822 823 824 825 826 827 828 829 830 831 832 833 834 835 836 837 838 839 840 841 842 843 844 845 846 847 848 849 850 851 852 853 854 855 856 857 858 859 860 861 862 863 864 865 866 867 868 869 870 871 872 873 874 875 876 877 878 879 880 881 882 883 884 885 886 887 888 889 890 891 892 893 894 895 896 897 898 899 900 901 902 903 904 905 906 907 908 909 910 911 912 913 914 915 916 917 918 919 920 921 922 923 924 925 926 927 928 929 930 931 932 933 934 935 936 937 938 939 940 941 942 943 944 945 946 947 948 949 950 951 952 953 954 955 956 957 958 959 960 961 962 963 964 965 966 967 968 969 970 971 972 973 974 975 976 977 978 979 980 981 982 983 984 985 986 987 988 989 990 991 992 993 994 995 996 997 998 999 1000 1001 1002 1003 1004 1005 1006 1007 1008 1009 1010 1011 1012 1013 1014 1015 1016 1017 1018 1019 1020 1021 1022 1023 1024 1025 1026 1027 1028 1029 1030 1031 1032 1033 1034 1035 1036 1037 1038 1039 1040 1041 1042 1043 1044 1045 1046 1047 1048 1049 1050 1051

<?php $this->titre = "Paiements"; $this->menu = "paiement";   date_default_timezone_set('Europe/Paris');   setlocale(LC_TIME,'fr_FR.utf8','fra');   ?>   <div class="row cd-main-content"> <div class="col s12 m12 l10 offset-l1 cd-gallery" style="margin-top:50px;">     <div class="row" id="paiements_container">   <? //definition des arrays php pour ensuite les ajouter au tableau 'html' pour ensuite pouvoir l'imprimer avec fnExcelReport $tableau_virement = array (); $tableau_cheque = array (); $tableau_prelevement = array (); $tableau_cesu_web = array (); $tableau_cesu_papier = array (); $tableau_espece = array ();?>     <ul class="collection with-header" id="collection_virement"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements virement</h6></li> <? foreach($paiements_virement as $paiement): array_push($tableau_virement, array(($paiement['nom']." ".$paiement['prenom']),$paiement['montant'],Date("d/m/Y",strtotime($paiement['date'])),strftime("%B %Y",strtotime($paiement['date_debut']))))?>     <li class="collection-item avatar" id="paiement_virement_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-action-payment yellow circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span>   <span style="display:inline-block;min-width:22%;max-width:22%;" id="date_virement_<?= $paiement['id'] ?>"><?= Date("d/m/Y",strtotime($paiement['date'])) ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_virement_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:22%;max-width:22%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifVirement(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'virement')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>           <ul class="collection with-header" id="collection_espece"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements espèce</h6></li> <? foreach($paiements_especes as $paiement): array_push($tableau_espece, array(($paiement['nom']." ".$paiement['prenom']),$paiement['montant'],'', strftime("%B %Y",strtotime($paiement['date_debut']))))?>       <li class="collection-item avatar" id="paiement_especes_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-editor-attach-money green darken-2 circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_especes_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span>   <span style="display:inline-block;min-width:22%;max-width:22%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span>   </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifEspeces(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'especes')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i>   </li>   <? endforeach; ?> </ul>       <ul class="collection with-header" id="collection_prelevement"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements prélèvement</h6></li> <? foreach($paiements_prelevement as $paiement): array_push($tableau_prelevement, array(($paiement['nom']." ".$paiement['prenom']),$paiement['montant'],'','',$paiement['num_remise']))?>       <li class="collection-item avatar" id="paiement_prelevement_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-content-redo blue circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_prelevement_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:22%;max-width:22%;"><?= $paiement['num_remise'] ?></span> <input type="hidden" id="num_remise_prelevement_<?= $paiement['id'] ?>" value="<?= $paiement['num_remise'] ?>" /> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifPrelevement(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'prelevement')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>       <ul class="collection with-header" id="collection_cesu_web"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements cesu web</h6></li> <? foreach($paiements_cesu_web as $paiement): array_push($tableau_cesu_web, array(($paiement['nom']." ".$paiement['prenom']),$paiement['montant'],'', strftime("%B %Y",strtotime($paiement['date_debut'])),'','',$paiement['num_remise']))?>       <li class="collection-item avatar" id="paiement_cesu_web_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-action-receipt red circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_cesu_web_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:22%;max-width:22%;"><?= $paiement['num_remise'] ?></span>   <span style="display:inline-block;min-width:22%;max-width:22%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span>   <input type="hidden" id="num_remise_cesu_web_<?= $paiement['id'] ?>" value="<?= $paiement['num_remise'] ?>" /> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifCesuWeb(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'cesu_web')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>       <ul class="collection with-header" id="collection_cesu_papier"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements cesu papier</h6></li> <? foreach($paiements_cesu_papier as $paiement): array_push($tableau_cesu_papier, array(($paiement['nom']." ".$paiement['prenom']),$paiement['montant'],'', strftime("%B %Y",strtotime($paiement['date_debut'])),'' ,'' ,$paiement['num_remise']))?>       <li class="collection-item avatar" id="paiement_cesu_papier_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-action-receipt red circle" ></i> <p style="font-weight:bold;margin-left:50px;">   <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:22%;max-width:22%;" id="montant_cesu_papier_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:22%;max-width:22%;"><?= $paiement['num_remise'] ?></span>   <span style="display:inline-block;min-width:22%;max-width:22%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span>   <input type="hidden" id="num_remise_cesu_papier_<?= $paiement['id'] ?>" value="<?= $paiement['num_remise'] ?>" /> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifCesuPapier(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'cesu_papier')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>       <ul class="collection with-header" id="collection_cheque"> <li class='collection-header blue-grey white-text' style="opacity:1;"><h6>Paiements chèque</h6></li> <? foreach($paiements_cheque as $paiement): array_push($tableau_cheque, array(($paiement['nom']." ".$paiement['prenom']),$paiement['montant'],'','',$paiement['numero_remise'],$paiement['num_cheque'],$paiement['banque']))?>     <li class="collection-item avatar" id="paiement_cheque_<?= $paiement['id'] ?>" style="opacity:1;"> <i class="mdi-av-subtitles green circle" ></i> <p style="font-weight:bold;margin-left:50px;"> <span style="display:inline-block;min-width:22%;max-width:22%;" class="title"><?= $paiement['nom']." ".$paiement['prenom'] ?></span> <span style="display:inline-block;min-width:12%;max-width:12%;" id="montant_cheque_<?= $paiement['id'] ?>"><?= $paiement['montant'] ?> €</span> <span style="display:inline-block;min-width:12%;max-width:12%;"><?= $paiement['numero_remise'] ?></span>   <span style="display:inline-block;min-width:12%;max-width:12%;"><?= strftime("%B %Y",strtotime($paiement['date_debut'])) ?></span> <span style="display:inline-block;min-width:12%;max-width:12%;"><?= $paiement['num_cheque'] ?></span>     <input type="hidden" id="num_remise_cheque_<?= $paiement['id'] ?>" value="<?= $paiement['id_remise'] ?>" /> <input type="hidden" id="banque_cheque_<?= $paiement['id'] ?>" value="<?= $paiement['banque'] ?>" /> <input type="hidden" id="num_cheque_cheque_<?= $paiement['id'] ?>" value="<?= $paiement['num_cheque'] ?>" /> </p> <a href="Facture/details/<?= $paiement['numero_facture'] ?>" class="secondary-content"><i class="small mdi-action-receipt green-text"></i></a> <i onclick="modifCheque(<?= $paiement['id'] ?>)" style="margin-right:80px;cursor:pointer;" class="small mdi-content-create secondary-content"></i> <i onclick="suppr(<?= $paiement['id'] ?>,'cheque')" style="margin-right:40px;cursor:pointer;" class="small mdi-content-clear secondary-content red-text"></i> </li>   <? endforeach; ?> </ul>       </div>   </div>   <div class="cd-filter"> <form style="padding-bottom:0px;"> <div class="cd-filter-block"> <h4>Identité</h4>   <div class="row"> <div class="col s12"> <label>Type paiement</label> <select id="type_paiement"> <option value="0" >Tous</option> <option value="1" >Virement</option> <option value="2" >Prélèvement</option> <option value="3" >Espèce</option> <option value="4" >Cesu web</option> <option value="5" >Cesu papier</option> <option value="6" >Chèque</option> </select> </div> <div class="input-field col s12"> <input onkeyup="rechercher_num_remise();" type="text" id="recherche_num_remise"/> <label for="recherche_num_remise">Numéro remise</label> </div> <div class="input-field col s12"> <input onkeyup="rechercher_num_cheque();" type="text" id="recherche_num_cheque"/> <label for="recherche_num_cheque">Numéro chèque</label> </div>   <div class="input-field col s12"> <input onkeyup="rechercher_num_facture();" type="text" id="recherche_num_facture"/> <label for="recherche_num_facture">Numéro facture</label> </div>   </div> <div class="row" style="bottom:0px;margin-bottom:0px;">   <div class="col s12">   <label for="select_client" style="font-size: 1rem;font-weight: bold;color: #000000;">Client</label> <select id="select_client" class="browser-default" data-placeholder="Choisissez un client" onchange="rechercher();"> <option value=""></option> <? foreach($clients as $client): ?>   <option value="<?= $client['id'] ?>"><?= $client['nom']." ".$client['prenom'] ?></option>   <? endforeach; ?> </select>   </div> <div class="input-field col s12"> <input id="recherche_date_debut" type="date" onchange="rechercher();"> <label for="recherche_date_debut" class="active">Date entre :</label> </div> <div class="input-field col s12"> <input id="recherche_date_fin" type="date" onchange="rechercher();"> <label for="recherche_date_fin" class="active">Et :</label> </div>   </div> </div> <!-- cd-filter-block --> </form> <a class="cd-close">Close</a> </div> <!-- cd-filter -->   <a class="cd-filter-trigger" style="cursor:pointer;">Recherche</i></a>   </div>       <div id="modal_virement" class="modal modal-fixed-footer"> <div class="modal-content"> <div class="header-modal blue-grey white-text"> <h4>Modification virement</h4> </div>   <div class="row"> <div class="input-field col s6"> <input type="date" id="date_modif_virement" /> <label class="active">Date virement</label> </div> <div class="input-field col s6"> <input type="text" id="montant_modif_virement" /> <label id="label_montant_modif_virement" class="active">Montant</label> </div> <input type="hidden" id="id_modif_virement" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_virement()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_especes" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification espèce</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s6"> <input type="text" id="montant_modif_especes" /> <label id="label_montant_modif_especes" class="active">Montant</label> </div> <input type="hidden" id="id_modif_especes" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_especes()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_prelevement" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification prélèvement</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s4"> <input type="text" id="num_remise_modif_prelevement" /> <label id="label_num_remise_modif_prelevement" class="active">Numéro remise</label> </div> <div class="input-field col s4"> <input type="text" id="montant_modif_prelevement" /> <label id="label_montant_modif_prelevement" class="active">Montant</label> </div> <input type="hidden" id="id_modif_prelevement" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_prelevement()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_cesu_web" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification cesu web</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s4"> <input type="text" id="num_remise_modif_cesu_web" /> <label id="label_num_remise_modif_cesu_web" class="active">Numéro remise</label> </div> <div class="input-field col s4"> <input type="text" id="montant_modif_cesu_web" /> <label id="label_montant_modif_cesu_web" class="active">Montant</label> </div> <input type="hidden" id="id_modif_cesu_web" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_cesu_web()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_cesu_papier" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification cesu papier</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s4"> <input type="text" id="num_remise_modif_cesu_papier" /> <label id="label_num_remise_modif_cesu_papier" class="active">Numéro remise</label> </div> <div class="input-field col s4"> <input type="text" id="montant_modif_cesu_papier" /> <label id="label_montant_cesu_papier" class="active">Montant</label> </div> <input type="hidden" id="id_modif_cesu_papier" /> </div> </div> <div class="modal-footer"> <a onclick="modifier_cesu_papier()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div id="modal_cheque" class="modal modal-fixed-footer"> <div class="modal-content"> <h4 class="blue-grey-text text-darken-1">Modification chèque</h4> <div class="divider"></div> <div class="row"> <div class="input-field col s3"> <input type="text" id="num_cheque_modif_cheque" /> <label id="label_num_cheque_modif_cheque" class="active">Numéro chèque</label> </div> <div class="input-field col s3"> <input type="text" id="montant_modif_cheque" /> <label id="label_montant_modif_cheque" class="active">Montant</label> </div> <div class="col s3"> <label>Numéro remise</label> <select class="browser-default" id="num_remise_modif_cheque">   <? foreach($remises as $remise): ?>   <option value="<?= $remise['id'] ?>"><?= $remise['numero_remise'] ?></option>   <? endforeach; ?> </select> </div> <input type="hidden" id="id_modif_cheque" /> </div> <div class="input-field col s12"> <input type="text" id="banque_modif_cheque" /> <label id="label_banque_modif_virement" class="active">Banque / Nom</label> </div> </div> <div class="modal-footer"> <a onclick="modifier_cheque()" style="margin-left:30px;" class="waves-effect waves-green btn right modal-action modal-close">Modifier</a> <a class="waves-effect waves-green btn red right modal-action modal-close">Annuler</a>   </div> </div>   <div class="fixed-action-btn no-print" style="bottom: 45px; right: 100px;"> <a onclick="fnExcelReport();" class="btn-floating btn-large blue modal-trigger"> <i class="mdi-file-file-download"></i> </a> </div> <div class="fixed-action-btn no-print" style="bottom: 45px; right: 100px;"> <a onclick="fnExcelReport();" class="btn-floating btn-large blue modal-trigger"> <i class="mdi-file-file-download"></i> </a> </div>         <? //on remplit ici le tableau_final en 'html' pour pouvoir l'exporter en excel //tableau complet ?> <table id='tableau1' style="display: none"> <thead> <tr> <th>Nom et prenom</th> <th>Montant</th> <th>Date de Paiement</th> <th>Date de facturation </th> <th>Numero de remise </th> <th>Numero de cheque </th> <th>Nom de la Banque </th> </thead> <tbody> <?php foreach ($tableau_virement as $row): array_map('htmlentities', $row); ?> <tr id="collection_virementt"> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_prelevement as $row): array_map('htmlentities', $row); ?> <tr id="collection_prelevementt"> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_espece as $row): array_map('htmlentities', $row); ?> <tr id="collection_especet"> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_cesu_web as $row): array_map('htmlentities', $row); ?> <tr id="collection_cesu_webt"> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_cesu_papier as $row): array_map('htmlentities', $row); ?> <tr id="collection_cesu_papiert"> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> <td colspan="7" class="divider"><hr /></td> <?php foreach ($tableau_cheque as $row): array_map('htmlentities', $row); ?> <tr id="collection_chequet"> <td><?php echo implode('</td><td>', $row); ?></td> </tr> <?php endforeach; ?> </tbody> </table>     <table id='tableau1' style="display: none"> <thead> <tr> <th>Nom et prenom</th> <th>Montant</th> <th>Date de Paiement</th> <th>Date de facturation </th> <th>Numero de remise </th> <th>Numero de cheque </th> <th>Nom de la Banque </th> </thead> <tbody>         <script type="text/javascript">   $(document).ready(function(){   $('.modal-trigger').leanModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: 0.5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration); });   $("#type_paiement").change(function(){   var type = this.value;   if(type==0) { $("#collection_cheque").show(); Arraytest.push($("#collection_chequet")); $("#collection_virement").show(); $("#collection_prelevement").show(); $("#collection_cesu_web").show(); $("#collection_cesu_papier").show(); $("#collection_espece").show(); } if(type==1) { $("#collection_cheque").hide(); document.getElementById("collection_chequet").style.display = "none"; $("#collection_virement").show(); $("#collection_prelevement").hide(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").hide(); $("#collection_espece").hide(); } if(type==2) { $("#collection_cheque").hide(); $("#collection_virement").hide(); $("#collection_prelevement").show(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").hide(); $("#collection_espece").hide(); } if(type==3) { $("#collection_cheque").hide(); $("#collection_virement").hide(); $("#collection_prelevement").hide(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").hide(); $("#collection_espece").show(); } if(type==4) { $("#collection_cheque").hide(); $("#collection_virement").hide(); $("#collection_prelevement").hide(); $("#collection_cesu_web").show(); $("#collection_cesu_papier").hide(); $("#collection_espece").hide(); } if(type==5) { $("#collection_cheque").hide(); $("#collection_virement").hide(); $("#collection_prelevement").hide(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").show(); $("#collection_espece").hide(); } if(type==6) { $("#collection_cheque").show(); $("#collection_virement").hide(); $("#collection_prelevement").hide(); $("#collection_cesu_web").hide(); $("#collection_cesu_papier").hide(); $("#collection_espece").hide(); }   });     $('select').material_select();   $("#select_client").chosen({ allow_single_deselect: true, no_results_text: "Oops, pas de client!" });   $('.datepicker').pickadate({ monthsFull: ['Janvier', 'Février', 'Mars', 'Avril', 'Mai', 'Juin', 'Juillet', 'Août', 'Septembre', 'Octobre', 'Novembre', 'Decembre'], monthsShort: ['Jan', 'Fév', 'Mar', 'Avr', 'Mai', 'Jui', 'Jul', 'Aou', 'Sep', 'Oct', 'Nov', 'Dec'], weekdaysFull: ['Dimanche', 'Lundi', 'Mardi', 'Mercredi', 'Jeudi', 'Vendredi', 'Samedi'], weekdaysShort: ['Dim', 'Lun', 'Mar', 'Mer', 'Jeu', 'Ven', 'Sam'], format: 'yyyy-mm-dd', today: 'Ajourd\'hui', clear: 'Effacer', close: 'Fermer' }) });   function rechercher() { var client = document.getElementById("select_client").value; var date_debut = document.getElementById("recherche_date_debut").value; var date_fin = document.getElementById("recherche_date_fin").value;     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText!="") { document.getElementById("paiements_container").innerHTML=xmlhttp.responseText; } else { document.getElementById("paiements_container").innerHTML="<h1>Aucun résultat</h1>"; } } } xmlhttp.open("POST", "Paiement/recherche/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("client="+client+"&date_debut="+date_debut+"&date_fin="+date_fin);     }   function rechercher_num_remise() { var num_remise = $("#recherche_num_remise").val();   xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText!="") { document.getElementById("paiements_container").innerHTML=xmlhttp.responseText; } else { document.getElementById("paiements_container").innerHTML="<h1>Aucun résultat</h1>"; } } } xmlhttp.open("POST", "Paiement/rechercheRemise/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("num_remise="+num_remise); }       function rechercher_num_cheque() { var num_cheque = $("#recherche_num_cheque").val();   xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText!="") { document.getElementById("paiements_container").innerHTML=xmlhttp.responseText; } else { document.getElementById("paiements_container").innerHTML="<h1>Aucun résultat</h1>"; } } } xmlhttp.open("POST", "Paiement/rechercheCheque/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("num_cheque="+num_cheque);     }   function rechercher_num_facture() { var num_facture = $("#recherche_num_facture").val();   xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText!="") { document.getElementById("paiements_container").innerHTML=xmlhttp.responseText; } else { document.getElementById("paiements_container").innerHTML="<h1>Aucun résultat</h1>"; } } } xmlhttp.open("POST", "Paiement/rechercheFacture/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("num_facture="+num_facture);     }   function modifier_virement() { var id = $("#id_modif_virement").val(); var date = $("#date_modif_virement").val(); var montant = $("#montant_modif_virement").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { date = moment(date,"YYYY-MM-DD").format("DD/MM/YYYY"); $("#date_virement_"+id).html(date); $("#montant_virement_"+id).html(montant+" €"); } } } xmlhttp.open("POST", "Paiement/modifierVirement/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&date="+date+"&montant="+montant);   }   function modifier_especes() { var id = $("#id_modif_especes").val(); var montant = $("#montant_modif_especes").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_especes_"+id).html(montant+" €"); } } } xmlhttp.open("POST", "Paiement/modifierEspeces/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant);   }   function modifier_prelevement() { var id = $("#id_modif_prelevement").val(); var montant = $("#montant_modif_prelevement").val(); var num_remise = $("#num_remise_modif_prelevement").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_prelevement_"+id).html(montant+" €"); $("#num_remise_prelevement_"+id).html(num_remise); } } } xmlhttp.open("POST", "Paiement/modifierPrelevement/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant+"&num_remise="+num_remise);   }   function modifier_cesu_web() { var id = $("#id_modif_cesu_web").val(); var montant = $("#montant_modif_cesu_web").val(); var num_remise = $("#num_remise_modif_cesu_web").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_cesu_web_"+id).html(montant+" €"); $("#num_remise_cesu_web_"+id).html(num_remise); } } } xmlhttp.open("POST", "Paiement/modifierCesu/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant+"&num_remise="+num_remise);   }   function modifier_cesu_papier() { var id = $("#id_modif_cesu_papier").val(); var montant = $("#montant_modif_cesu_papier").val(); var num_remise = $("#num_remise_modif_cesu_papier").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_cesu_papier_"+id).html(montant+" €"); $("#num_remise_cesu_papier_"+id).html(num_remise); } } } xmlhttp.open("POST", "Paiement/modifierCesu/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant+"&num_remise="+num_remise);   }   function modifier_cheque() { var id = $("#id_modif_cheque").val(); var montant = $("#montant_modif_cheque").val(); var num_remise = $("#num_remise_modif_cheque").val(); var num_remise_html = $("#num_remise_modif_cheque option:selected").text(); var num_cheque = $("#num_cheque_modif_cheque").val(); var banque = $("#banque_modif_cheque").val();     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="modif_ok") { $("#montant_cheque_"+id).html(montant+" €"); $("#num_remise_cheque_"+id).val(num_remise); $("#num_remise_cheque_html_"+id).html(num_remise_html); $("#num_cheque_cheque_"+id).html(num_cheque); $("#banque_cheque_"+id).html(banque); } } } xmlhttp.open("POST", "Paiement/modifierCheque/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&montant="+montant+"&num_remise="+num_remise+"&num_cheque="+num_cheque+"&banque="+banque);   }     function modifVirement(id) {   var date = $("#date_virement_"+id).html(); date = moment(date,"DD/MM/YYYY").format("YYYY-MM-DD"); var montant = $("#montant_virement_"+id).html(); $("#label_montant_modif_virement").addClass("active"); montant = montant.replace(" €","");   $("#date_modif_virement").val(date); $("#montant_modif_virement").val(montant); $("#id_modif_virement").val(id);   $('#modal_virement').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   }   function modifEspeces(id) {   var montant = $("#montant_especes_"+id).html(); montant = montant.replace(" €","");   $("#montant_modif_especes").val(montant); $("#id_modif_especes").val(id); $("#label_montant_modif_especes").addClass("active");   $('#modal_especes').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   }   function modifPrelevement(id) {   var montant = $("#montant_prelevement_"+id).html(); var num_remise = $("#num_remise_prelevement_"+id).val(); montant = montant.replace(" €","");   $("#montant_modif_prelevement").val(montant); $("#id_modif_prelevement").val(id); $("#num_remise_modif_prelevement").val(num_remise); $("#label_montant_modif_prelevement").addClass("active"); $("#label_num_remise_modif_prelevement").addClass("active");   $('#modal_prelevement').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   }   function modifCesuWeb(id) {   var montant = $("#montant_cesu_web_"+id).html(); var num_remise = $("#num_remise_cesu_web_"+id).val(); montant = montant.replace(" €","");     $("#montant_modif_cesu_web").val(montant); $("#id_modif_cesu_web").val(id); $("#num_remise_modif_cesu_web").val(num_remise); $("#label_montant_modif_cesu_web").addClass("active"); $("#label_num_remise_modif_cesu_web").addClass("active");   $('#modal_cesu_web').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   } function modifCesuPapier(id) {   var montant = $("#montant_cesu_papier_"+id).html(); var num_remise = $("#num_remise_cesu_papier_"+id).val(); montant = montant.replace(" €","");   $("#montant_modif_cesu_papier").val(montant); $("#id_modif_cesu_papier").val(id); $("#num_remise_modif_cesu_papier").val(num_remise); $("#label_montant_modif_cesu_papier").addClass("active"); $("#label_num_remise_modif_cesu_papier").addClass("active");   $('#modal_cesu_papier').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   } function modifCheque(id) {   var montant = $("#montant_cheque_"+id).html(); var num_remise = $("#num_remise_cheque_"+id).val(); var num_cheque = $("#num_cheque_cheque_"+id).val(); var banque = $("#banque_cheque_"+id).val(); montant = montant.replace(" €","");   $("#montant_modif_cheque").val(montant); $("#id_modif_cheque").val(id); $('#num_remise_modif_cheque').val(num_remise).prop('selected', true); $("#num_cheque_modif_cheque").val(num_cheque); $("#banque_modif_cheque").val(banque); $("#label_montant_modif_cheque").addClass("active"); $("#label_num_cheque_modif_cheque").addClass("active"); $("#label_banque_modif_cheque").addClass("active");   $('#modal_cheque').openModal({ dismissible: true, // Modal can be dismissed by clicking outside of the modal opacity: .5, // Opacity of modal background in_duration: 300, // Transition in duration out_duration: 200 // Transition out duration });   }   function suppr(id,type) {     xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { if(xmlhttp.responseText=="suppr_ok") { $("#paiement_"+type+"_"+id).remove(); } else { swal("Attention !","La suppression à échoué !","error"); } } } xmlhttp.open("POST", "Paiement/supprimer/", true); xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); xmlhttp.send("id="+id+"&type="+type);     }   function fnExcelReport() { var tab_text="<table border='2px'><tr bgcolor='#87AFC6'>"; var textRange; var j=0; tab = document.getElementById('tableau1'); // id of table   for(j = 0 ; j < tab.rows.length ; j++) { tab_text=tab_text+tab.rows[j].innerHTML+"</tr>"; //tab_text=tab_text+"</tr>"; }   tab_text=tab_text+"</table>"; tab_text= tab_text.replace(/<A[^>]*>|<\/A>/g, "");//remove if u want links in your table tab_text= tab_text.replace(/<img[^>]*>/gi,""); // remove if u want images in your table tab_text= tab_text.replace(/<input[^>]*>|<\/input>/gi, ""); // reomves input params   var ua = window.navigator.userAgent; var msie = ua.indexOf("MSIE ");   if (msie > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./)) // If Internet Explorer { txtArea1.document.open("txt/html","replace"); txtArea1.document.write(tab_text); txtArea1.document.close(); txtArea1.focus(); sa=txtArea1.document.execCommand("SaveAs",true,"Say Thanks to Sumit.xls"); } else //other browser not tested on IE 11 sa = window.open('data:application/vnd.ms-excel,' + encodeURIComponent(tab_text));   return (sa); }           </script>

---

heu, t'imagine que je vais décortiquer tes 1051 lignes de code pour comprendre ce que tu a écrit, tu rêves !? :roll:.

tu dois savoir directement ce que fait ton code, alors explique juste ton systeme de filtrage (j'imagine)
et il s'agit d'un pb HTML / JS , donc péseter du code PHP, c'est juste pour nous rendre la tache plus compliquée ?

Bonjour, j'ai enfin réussi à exporter dans un fichier xls le contenu de mes div.
Pour ceux qui auraient le même problème, dans mon cas le contenu de la div "paiements_container" était modifié avec le retour d'une requête xmlHTTP via : document.getElementById("paiements_container").innerHTML=xmlhttp.responseText;.
Ce que j'ai fait, c'est écrire dans une autre div sur laquelle j'applique mes traitements pour transformer le code renvoyé par la requête en code html. Le code renvoyé était une suite de <ul ... <li et j'en ai fait un tableau html.

Je peux ensuite transformer la table en fichier xls avec une fonction que l'on trouve sur internet ( function fnExcelReport() ).

Et voilà. Sujet clos. Merci!