When has started to write a script for creation of creation of templates for an embroidery, I even on knew as it will look and what to do. Having decided all to do on JavaScript, has started to search as to remove a line from the table, and has found quite responsible "manual" http://sudoku.org.ua/rus/blog/2006/03/09/deltablero ws1/. Only only lines and on id there left, for me id were superfluous since I deleted a line from below, and also it was necessary for me not only removal of lines, but also removal of columns and as their dynamic addition. Here that has turned out: Только там удалялись лишь строки и по id, для меня id были лишними т.к. удалял я строки снизу, и мне также нужно было не только удаление строк, но и удаление столбцов а так же их динамическое добавление. Вот что получилось:
The table

1
2
3
<table id = "canvas">>
...
</table>

And two functions
Change of quantity of lines

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
function chWidht (control) {{
  var value = control.value;;
  if (/^ [0-9] * $/.test (value)) {.test(value)){
    var tbody = document.getElementById (' canvas'). getElementsByTagName (' TBODY ') [0];('canvas').getElementsByTagName('TBODY')[0];
    var newwidth = parseInt (value);value);
    var diff = width - newwidth; newwidth;
    if (diff> 0) { 0){
      //it is deleted
      for (i = 0; i <height; i ++) { 0; i < height; i++){
        for (j = 0; j <diff; j ++) { 0; j < diff ; j++){
          tbody.rows [i].removeChild (tbody.rows [i].lastChild);.removeChild(tbody.rows[i].lastChild);
        }
      }
      width = newwidth;
    } else if (diff <0) { (diff < 0) {
      //it is added
      for (i = 0; i <height; i ++) { 0; i < height; i++){
        for (j = diff; j <0; j ++) { diff; j < 0 ; j++){
          var row = tbody.rows [i];[i];
          var td = document.createElement ("TD");("TD");
          row.appendChild (td);;
        }
      }
      width = newwidth;
    } else {}}
  } else {
    alert ("enter number"););
    control.focus ();;
  }
}

Change of quantity of columns

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
function chHeight (control) {{
  var value = control.value;;
  if (/^ [0-9] * $/.test (value)) {.test(value)){
    var tbody = document.getElementById (' canvas'). getElementsByTagName (' TBODY ') [0];('canvas').getElementsByTagName('TBODY')[0];
    var newheight = parseInt (value);value);
    var diff = height - newheight; newheight;
    if (diff> 0) { 0){
      //it is deleted
      for (j = 0; j <diff; j ++) { 0; j < diff ; j++){
        tbody.removeChild (tbody.lastChild););
      }
      height = newheight;
    } else if (diff <0) { (diff < 0) {
      //it is added
      for (i = diff; i <0; i ++) { diff; i < 0; i++ ){
        var row = document.createElement ("TR");("TR");
        tbody.appendChild (row);;
        for (j = 0; j <width; j ++) { 0; j < width; j++){
          var td = document.createElement ("TD");("TD");
          row.appendChild (td);;
        }
      }
      height = newheight;
    } else {}}
  } else {
    alert ("enter number"););
    control.focus ();;
  }
}

Working example it is possible to look here
In JavaScript it is not strong, therefore that that can be and it is wrong, but works)

15Oct 2008