EditableGrid is an open source Javascript library aimed at turning HTML tables into advanced editable components. It focuses on simplicity: only a few lines of code are required to get your first table up and running.
Sorry, I know this should probably be a pull request, but I just made a fix locally (not in a repo), and the patch is small, so I thought I'd post it here in case it helps.
The specific case is that I wanted numbers to be left aligned like everything else, so I changed the css like this:
td.number {
text-align: left;
}
But the editor seems hard-coded to assume numbers are right-aligned, and so it opens in the wrong place. I fixed editablegrid_editors.js by putting a guard around the right-alignment code to check the element style is actually right aligned like this:
@@ -148,9 +148,11 @@
// if number type: align field and its content to the right
if (this.column.datatype == 'integer' || this.column.datatype == 'double') {
- var rightPadding = this.editablegrid.getCellX(element) - offsetScrollX + element.offsetWidth - (parseInt(editorInput.style.left) + editorInput.offsetWidth);
- editorInput.style.left = (parseInt(editorInput.style.left) + rightPadding) + "px";
- editorInput.style.textAlign = "right";
+ if(window.getComputedStyle(element, null).getPropertyValue("text-align") == "right") {
+ var rightPadding = this.editablegrid.getCellX(element) - offsetScrollX + element.offsetWidth - (parseInt(editorInput.style.left) + editorInput.offsetWidth);
+ editorInput.style.left = (parseInt(editorInput.style.left) + rightPadding) + "px";
+ editorInput.style.textAlign = "right";
+ }
}
}
Sorry, I know this should probably be a pull request, but I just made a fix locally (not in a repo), and the patch is small, so I thought I'd post it here in case it helps.
The specific case is that I wanted numbers to be left aligned like everything else, so I changed the css like this:
But the editor seems hard-coded to assume numbers are right-aligned, and so it opens in the wrong place. I fixed
editablegrid_editors.js
by putting a guard around the right-alignment code to check the element style is actually right aligned like this: