javascript - Why does my handson table duplicate itself? -
i tried implementing handsontable
, table got duplicated. don't understand why happens. gets duplicated when use $('#example').handsontable
method. here full code
<html> <head> <script src="http://code.jquery.com/jquery-1.9.1.js"></script> <script src="jquery.handsontable.full.js"></script> <link rel="stylesheet" media="screen" href="jquery.handsontable.full.css"> <link rel="canonical" href="http://handsontable.com/"> <link href="http://www.jqueryscript.net/css/top.css" rel="stylesheet" type="text/css"> </head> <body> <div> <div id="container" style="margin-top:100px;"> <div id="example" class="handsontable"> <table class="htcore" style="display: table;"><colgroup><col style="width: 50px;"><col style="width: 61px;"><col style="width: 50px;"><col style="width: 69px;"><col style="width: 50px;"><col style="width: 69px;"></colgroup><thead><tr><th><div class="relative"><span class="colheader">a</span></div></th><th><div class="relative"><span class="colheader">b</span></div></th><th><div class="relative"><span class="colheader">c</span></div></th><th><div class="relative"><span class="colheader">d</span></div></th><th><div class="relative"><span class="colheader">e</span></div></th><th><div class="relative"><span class="colheader">f</span></div></th></tr></thead><tbody><tr><td class=""></td><td class="">maserati</td><td class="">mazda</td><td class="">mercedes</td><td class="">mini</td><td class="">mitsubishi</td></tr><tr><td class="">2009</td><td class="">0</td><td class="">2941</td><td class="">4303</td><td class="">354</td><td class="">ede</td></tr><tr><td class="">2010</td><td class="">5</td><td class="">2905</td><td class="">2867</td><td class="">412</td><td class="">5284</td></tr><tr><td class="">2011</td><td class="">4</td><td class="">2517</td><td class="">4822</td><td class="">552</td><td class="">6127</td></tr><tr><td class="">2012</td><td class="">2</td><td class="">2422</td><td class="">5399</td><td class="">776</td><td class="">4151</td></tr><tr><td class=""></td><td class=""></td><td class=""></td><td class=""></td><td class=""></td><td class=""></td></tr></tbody></table></div> <script> var data = [ ["", "maserati", "mazda", "mercedes", "mini", "mitsubishi"], ["2009", 0, 2941, 4303, 354, 5814], ["2010", 5, 2905, 2867, 412, 5284], ["2011", 4, 2517, 4822, 552, 6127], ["2012", 2, 2422, 5399, 776, 4151] ]; $('#example').handsontable({ data: data, minrows: 1, mincols: 6, maxcols: 6, minsparerows: 1, autowraprow: true, colheaders: true, contextmenu: true }); $('.ver').html($('#example').data('handsontable').version); </script> </div> </div> </body> </html>
here see
try remove table
inside <div id="example" class="handsontable">
. code :
$('#example').handsontable({ data: data, minrows: 1, mincols: 6, maxcols: 6, minsparerows: 1, autowraprow: true, colheaders: true, contextmenu: true });
create table using data provided. no need table definition inside <div id="example" class="handsontable">
.
Comments
Post a Comment