Steve Daskam's Blog

Blog about the daily practices and methods of an agile software developer.

Copy from Excel into HTML Table

with 2 comments

Using the code below, you can paste a column of cells from an Excel spreadsheet into a column of an HTML table. Just open up a spreadsheet, select multiple cells in a single column, and hit CTRL-C. Then open up this code in your web browser, and click the Paste button.

NOTE that this code only works with the IE browser.

<html>
<head><title>Test Copy/Paste</title>
<script>
function pasteFromClipboard() {
   var data = window.clipboardData.getData('Text');
   if (data != null) {
      var cells = data.split('\n');
      var rowCnt = 5;

      for (i = 0; i < cells.length; i++) {
         if (i == rowCnt) return;
         var tbId = 'r' + i + 'c1';
         document.getElementById(tbId).value = cells[i];
      }
   }
}
</script>
</head>

<body>
   <form action="#" method="get">
      <table>
         <tr>
            <td><input type="text" id="r0c1"/></td>
            <td><input type="text" id="r0c2"/></td>
            <td><input type="text" id="r0c3"/></td>
            <td><input type="text" id="r0c4"/></td>
            <td><input type="text" id="r0c5"/></td>
         </tr>
         <tr>
            <td><input type="text" id="r1c1"/></td>
            <td><input type="text" id="r1c2"/></td>
            <td><input type="text" id="r1c3"/></td>
            <td><input type="text" id="r1c4"/></td>
            <td><input type="text" id="r1c5"/></td>
        </tr>
        <tr>
            <td><input type="text" id="r2c1"/></td>
            <td><input type="text" id="r2c2"/></td>
            <td><input type="text" id="r2c3"/></td>
            <td><input type="text" id="r2c4"/></td>
            <td><input type="text" id="r2c5"/></td>
        </tr>
        <tr>
            <td><input type="text" id="r3c1"/></td>
            <td><input type="text" id="r3c2"/></td>
            <td><input type="text" id="r3c3"/></td>
            <td><input type="text" id="r3c4"/></td>
            <td><input type="text" id="r3c5"/></td>
        </tr>
        <tr>
            <td><input type="text" id="r4c1"/></td>
            <td><input type="text" id="r4c2"/></td>
            <td><input type="text" id="r4c3"/></td>
            <td><input type="text" id="r4c4"/></td>
            <td><input type="text" id="r4c5"/></td>
        </tr>
      </table>

      <button onclick="pasteFromClipboard();">Paste</button>
      <input type="reset" value="Clear">
   </form>

</body>
</html>

Advertisement

Written by stevedaskam

March 27, 2011 at 7:47 pm

Posted in Web

2 Responses

Subscribe to comments with RSS.

  1. Doesn’t work…

    Tommy

    June 7, 2011 at 11:37 pm

    • Tommy, I forgot to note in my post that this code only works in the IE browser. Thanks for the comment!!

      stevedaskam

      June 8, 2011 at 7:29 am


Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Connecting to %s

Follow

Get every new post delivered to your Inbox.