Copier / Coller d'Excel vers une page Web

Question 1

Existe-t-il une méthode standard ou une bibliothèque pour copier et coller d'une feuille de calcul vers un formulaire Web? Lorsque je sélectionne plus d'une cellule d'Excel, je perds (évidemment) le délimiteur et tout est collé dans une cellule du formulaire Web. Doit-il être fait en VB? ou le traitement pourrait-il être effectué une fois que l'action de collage est lancée sur le formulaire Web?

Question 2

Vous ne perdez pas les délimiteurs, les cellules sont séparées par des tabulations ( \t) et les lignes par des retours à la ligne ( \n) qui peuvent ne pas être visibles dans le formulaire. Essayez-le vous-même: copiez le contenu d'Excel vers le Bloc-notes et vous verrez vos cellules bien alignées. Il est alors facile de diviser les champs par onglets et de les remplacer par autre chose, de cette façon vous pouvez même créer une table à partir d'eux. Voici un exemple utilisant jQuery:

var data = $('input[name=excel_data]').val();
var rows = data.split("\n");

var table = $('<table />');

for(var y in rows) {
    var cells = rows[y].split("\t");
    var row = $('<tr />');
    for(var x in cells) {
        row.append('<td>'+cells[x]+'</td>');
    }
    table.append(row);
}

// Insert into DOM
$('#excel_table').html(table);

Donc, en substance, ce script crée un tableau HTML à partir de données Excel collées.

Question 3

En réponse à la réponse de Tatu, j'ai créé un jsFiddle rapide pour présenter sa solution:

http://jsfiddle.net/duwood/sTX7y/

HTML

<p>Paste excel data here:</p>  
<textarea name="excel_data" style="width:250px;height:150px;"></textarea><br>
<input type="button" onclick="javascript:generateTable()" value="Genereate Table"/>
<br><br>
    <p>Table data will appear below</p>
<hr>
<div id="excel_table"></div>

JS

function generateTable() {
    var data = $('textarea[name=excel_data]').val();
    console.log(data);
    var rows = data.split("\n");

    var table = $('<table />');

    for(var y in rows) {
    var cells = rows[y].split("\t");
    var row = $('<tr />');
    for(var x in cells) {
        row.append('<td>'+cells[x]+'</td>');
    }
    table.append(row);
}

// Insert into DOM
$('#excel_table').html(table);
}

Question 4

Sous OSX et Windows , il existe plusieurs types de presse-papiers pour différents types de contenu. Lorsque vous copiez du contenu dans Excel, les données sont stockées dans le texte brut et dans le presse-papiers html.

La bonne façon (qui n'est pas déclenchée par des problèmes de délimiteur) est d'analyser le HTML. http://jsbin.com/uwuvan/5 est une démo simple qui montre comment obtenir le presse-papiers HTML. La clé est de se lier à l'événement onpaste et de lire

event.clipboardData.getData('text/html')

Question 5

La même idée que Tatu (merci j'en aurai bientôt besoin dans notre projet), mais avec une expression régulière.
Ce qui peut être plus rapide pour un grand ensemble de données.

<html>
<head>
    <title>excelToTable</title>
    <script src="../libs/jquery.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
    <textarea>a1    a2  a3
b1  b2  b3</textarea>
    <div></div>
    <input type="button" onclick="convert()" value="convert"/>
    <script>
        function convert(){
            var xl = $('textarea').val();
            $('div').html( 
                '<table><tr><td>' + 
                xl.replace(/\n+$/i, '').replace(/\n/g, '</tr><tr><td>').replace(/\t/g, '</td><td>') + 
                '</tr></table>'
            )
        }
    </script>
</body>
</html>

Question 6

Pour tous les futurs googleurs qui se retrouveront ici comme moi, j'ai utilisé le concept de @tatu Ulmanen et je l'ai simplement transformé en un tableau d'objets. Cette fonction simple prend une chaîne de données Excel collées (ou feuille Google) (de préférence à partir de a textarea) et la transforme en un tableau d'objets. Il utilise la première ligne pour les noms de colonne / propriété.

function excelToObjects(stringData){
    var objects = [];
    //split into rows
    var rows = stringData.split('\n');

    //Make columns
    columns = rows[0].split('\t');

    //Note how we start at rowNr = 1, because 0 is the column row
    for (var rowNr = 1; rowNr < rows.length; rowNr++) {
        var o = {};
        var data = rows[rowNr].split('\t');

        //Loop through all the data
        for (var cellNr = 0; cellNr < data.length; cellNr++) {
            o[columns[cellNr]] = data[cellNr];
        }

        objects.push(o);
    }

    return objects;
}

Espérons que cela aide quelqu'un à l'avenir.

Question 7

MISE À JOUR: Ceci n'est vrai que si vous utilisez ONLYOFFICE au lieu de MS Excel.

Il y a en fait un flux dans toutes les réponses fournies ici et aussi dans celle acceptée. Le flux est que chaque fois que vous avez une cellule vide dans Excel et copiez cela, dans le presse-papiers, vous avez 2 caractères de tabulation l'un à côté de l'autre, donc après la division, vous obtenez un élément supplémentaire dans le tableau, qui apparaît alors comme une cellule supplémentaire dans cette ligne et déplace toutes les autres cellules d'une unité. Donc, pour éviter cela, vous devez essentiellement remplacer tous les caractères à double tabulation (onglets côte à côte uniquement) dans une chaîne par un caractère de tabulation et le diviser ensuite.

Une version mise à jour de jsfiddle de @ userfuser est là pour résoudre ce problème en filtrant les données collées avec removeExtraTabs

http://jsfiddle.net/sTX7y/794/

function removeExtraTabs(string) {
  return string.replace(new RegExp("\t\t", 'g'), "\t");
}

function generateTable() {
  var data = removeExtraTabs($('#pastein').val());
  var rows = data.split("\n");
  var table = $('<table />');

  for (var y in rows) {
    var cells = rows[y].split("\t");
    var row = $('<tr />');
    for (var x in cells) {
      row.append('<td>' + cells[x] + '</td>');
    }
    table.append(row);
  }

  // Insert into DOM
  $('#excel_table').html(table);
}

$(document).ready(function() {
  $('#pastein').on('paste', function(event) {
    $('#pastein').on('input', function() {
      generateTable();
      $('#pastein').off('input');
    })
  })
})

Question 8

Excel 2007 a une fonctionnalité pour faire cela sous l'onglet "Données" qui fonctionne assez bien.

Question 9

Creuser cela, au cas où quelqu'un le croiserait à l'avenir. J'ai utilisé le code ci-dessus comme prévu, mais j'ai ensuite rencontré un problème d'affichage de la table après qu'elle ait été soumise à une base de données. Il est beaucoup plus facile une fois que vous avez stocké les données d'utiliser PHP pour remplacer les nouvelles lignes et onglets dans votre requête. Vous pouvez effectuer le remplacement lors de la soumission, $ _POST [demande] serait le nom de votre zone de texte:

$postrequest = trim($_POST[request]);
$dirty = array("\n", "\t");
$clean = array('</tr><tr><td>', '</td><td>');
$request = str_replace($dirty, $clean, $postrequest);

Maintenant, insérez simplement $ request dans votre base de données, et il sera stocké sous forme de tableau HTML.

Question 10

Il serait peut-être préférable de lire votre fichier Excel à partir de PHP, puis de l'enregistrer dans une base de données ou d'effectuer un traitement dessus.

ici un tutoriel détaillé sur la lecture et l'écriture de données Excel avec PHP:
http://www.ibm.com/developerworks/opensource/library/os-phpexcel/index.html