Ordenación de tablas y números de fila
Ordena las filas de una tabla por la columna donde está el cursor, añade una columna de números de fila que se renumera automáticamente y mueve filas y columnas desde los menús de tabla o arrastrando una columna. Los números, importes, fechas y textos se ordenan como se espera.

Cómo activarlo
Esta función la ofrece el plugin tabletools.js (también incluido en plugins/all_plugins.js). Añade "Move Row Up" y "Move Row Down" al menú de filas de la tabla, y "Move Column Left" y "Move Column Right" al de columnas. La ordenación y los números de fila no tienen botón en la barra; llámalos desde tus propios botones, desde el menú "/" (plugin de comandos con barra) o desde un script.
<link rel="stylesheet" href="/richtexteditor/rte_theme_default.css">
<script src="/richtexteditor/rte.js"></script>
<script src="/richtexteditor/plugins/tabletools.js"></script>
<div id="editor"><table><tbody><tr><td>b</td><td>2</td></tr><tr><td>a</td><td>10</td></tr><tr><td>c</td><td>9</td></tr></tbody></table></div>
<button type="button" onclick="editor.sortTableAtCaret('asc')">Sort A-Z</button>
<button type="button" onclick="editor.sortTableAtCaret('desc')">Sort Z-A</button>
<button type="button" onclick="editor.execCommand('tablerownumbers')">Row numbers</button>
<script>
var editor = new RichTextEditor("#editor", {
tableNumberSeries: "upper-alpha",
tableNumberHeader: "Row"
});
</script>
Los botones actúan en la tabla y la columna donde se colocó el cursor por última vez.
Opciones
| Opción | Valor predeterminado | Función |
|---|---|---|
tableNumberSeries | "numeric" | Etiquetas para los números de fila: numeric, upper-alpha, lower-alpha, upper-roman o lower-roman. |
tableNumberHeader | "#" | Texto de la celda de la columna numérica en las filas de encabezado. Las tablas sin fila de encabezado no reciben una celda de encabezado. |
tableColumnDrag | true | false elimina el control para arrastrar una columna. |
tableRowDrag | true | false elimina el control de fila (consulta Aspectos a tener en cuenta). |
Ordenación
- El tipo de cada columna se detecta a partir de sus celdas. Una columna de
$1,240.00,$95.50y(500)se ordena como números (los paréntesis contables indican valores negativos), una columna de fechas se ordena por fecha y cualquier otra como texto, comparando por su valor los números que contiene. - Las celdas vacías van al final en ambas direcciones. Los valores iguales conservan su orden, por lo que funciona ordenar por una columna y luego por otra.
- Las filas de
<thead>y<tfoot>nunca se mueven, ni tampoco una primera fila formada solo por celdas<th>. - Una tabla con celdas combinadas (
rowspanocolspanen su cuerpo) no se ordena. La llamada devuelve{ ok: false, reason: "This table has merged cells. …" }.
Métodos: editor.sortTableAtCaret("asc" | "desc"), editor.sortTableByColumn(index, "asc" | "desc") para la tabla donde está el cursor, y editor.canSortTable(). Una ordenación devuelve { ok, reason, sortedBy, direction, detectedType }. editor.execCommand("sorttable") también ordena, pero siempre de forma ascendente en 2.6.12: no se transmite el valor del comando, así que usa sortTableAtCaret("desc") para ordenar de forma descendente.
Números de fila y movimiento
editor.execCommand("tablerownumbers") añade o elimina la columna numérica; editor.addTableRowNumbers({ series: "lower-roman" }), editor.removeTableRowNumbers() y editor.hasTableRowNumbers() lo hacen desde un script. Los números son posicionales: después de ordenar o mover, la fila 1 es la que está arriba.

Las filas se mueven dentro de su sección y las de encabezado permanecen en su sitio. editor.moveTableRow(-1 | 1) y editor.moveTableColumn(-1 | 1) hacen lo mismo que los comandos de menú. La columna numérica siempre permanece en primer lugar. Un movimiento es un paso de deshacer.
Aspectos a tener en cuenta
- Marcado guardado con números de fila:
Los números son celdas normales, por lo que están en el HTML guardado y son visibles en todas partes. Los sanitizadores deben conservar los atributos<table data-rte-rownum-series="upper-alpha"><tbody><tr><td data-rte-rownum="value">A</td><td>a</td><td>10</td></tr>…data-rte-rownumydata-rte-rownum-serieso el editor tratará la columna como datos normales la próxima vez. - En 2.6.12, el control de fila no aparece en un editor colocado de forma normal (su posición se calcula con coordenadas incorrectas). Mueve las filas con el menú de filas,
moveTableRow()o con Alt+ArrowUp / Alt+ArrowDown del editor. El control de columna funciona. - Alt+ArrowUp / Alt+ArrowDown los gestiona el propio editor y no renumeran la columna numérica. Los números se corrigen con la siguiente ordenación o movimiento desde el menú.
- La ordenación y el movimiento se rechazan en el modo de sugerencias (control de cambios), y no hacen nada cuando el editor es de solo lectura o solo comentarios.
Relacionado: demo de compatibilidad con tablas, cursor entre bloques, demo de comandos con barra.