Копировать/Вставить из Excel на веб-страницу

Есть ли стандартный способ или библиотека для копирования и вставки из таблицы в веб-форму? Когда я выбираю более одной ячейки из Excel я (очевидно), теряю разделитель, и все вставлено в одну ячейку веб-формы. Нужно ли это делать в VB? или может ли обработка быть выполнена после того, как действие вставки будет запущено в веб-форме?

Ответ 1

Вы не теряете разделители, ячейки разделяются вкладками (\t) и строками с помощью строк новой строки (\n), которые могут быть не видны в форме. Попробуйте сами: скопируйте контент из Excel в блокнот, и вы увидите, что ваши ячейки хорошо выстроены. Легко разделить поля по вкладкам и заменить их чем-то другим, таким образом вы можете построить из них даже таблицу. Вот пример использования 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);

Таким образом, по существу, этот script создает таблицу HTML из вставленных данных Excel.

Ответ 2

В ответ на ответ Tatu я создал быстрый jsFiddle для демонстрации его решения:

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>

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);
}

Ответ 3

Та же идея, что и Tatu (спасибо, мне это нужно в ближайшее время в нашем проекте), но с регулярным выражением.
Что может быть быстрее для большого набора данных.

<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>

Ответ 4

Для всех будущих гуглеров, заканчивающихся здесь, как я, я использовал концепцию @tatu Ulmanen и просто превратил ее в массив объектов. Эта простая функция берет строку вложенных данных excel (или Google sheet) (предпочтительно из textarea) и превращает их в массив объектов. Он использует первую строку для имен столбцов/свойств.

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;
}

Надеюсь, это поможет кому-то в будущем.

Ответ 5

В OSX и Windows, есть несколько типов буферов обмена для разных типов контента. Когда вы копируете контент в Excel, данные хранятся в открытом тексте и в html-буфере обмена.

Правильный способ (который не срабатывает при проблемах с разделителями) заключается в анализе HTML. http://jsbin.com/uwuvan/5 - это простая демонстрация, показывающая, как получить буфер обмена HTML. Ключом является привязка к событию onpaste и чтение

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

Ответ 6

Возможно, было бы лучше, если бы вы прочитали свой файл excel с PHP, а затем либо сохранили его в БД, либо выполнили некоторую обработку на нем.

здесь находится учебное пособие по чтению и записи данных Excel с помощью PHP:
http://www.ibm.com/developerworks/opensource/library/os-phpexcel/index.html

Ответ 7

В Excel 2007 есть функция для этого на вкладке "Данные", которая работает очень хорошо.

Ответ 8

Копайте это, если кто-то столкнется с ним в будущем. Я использовал вышеуказанный код, как предполагалось, но затем столкнулся с проблемой, отображающей таблицу после того, как она была отправлена в базу данных. Это намного проще, если вы сохранили данные для использования PHP для замены новых строк и вкладок в вашем запросе. Вы можете выполнить замену при представлении, $_POST [request] будет именем вашего текстового поля:

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

Теперь просто вставьте $request в свою базу данных, и он будет сохранен в виде таблицы HTML.