Table With Locked Header And Column - XTable
Mar 14, 2007I've just come across this example at cross-browser.com. Does anyone know if it is possible to lock more than 1 column?
View 12 RepliesI've just come across this example at cross-browser.com. Does anyone know if it is possible to lock more than 1 column?
View 12 RepliesI am trying to implement the "Freeze pane" feature in javascript as it is in excel. I am almost there but am not able to get one last thing. The row header freezing is achieved first column freezing is also achieved. However, the top left column cell (which is supposed to stay frozed during both horizontal and vertical scroll) is not frozen.
find the html file and the js file being used.
I'm using drupal, and am having trouble to convert a table to a one field two column at code level.Is it possible to manipulate it using jquery using odd and even?
View 2 Replies View RelatedI am using the tablesorter plugin and am experiencing the following problem:
Under several scenarios the up/down arrow icons will overlap with the text in a column's header. This occurs if the browser is resized so the table width is too narrow (e.g. plugin should force a min-width perhaps?).
More importantly, this will also occur when the text in a columns header is shorter than any of the values in the column the up/down icons overlap with the text in the column header.
I've attempted setting padding on the header columns but no success (probably because the up/down icons are set as background images and therefore have no impact on padding)
At the moment the plugin won't be usable for me since the arrorws overlap with the text in several columns.
I have a table as shown:
Day010203040506070809101112131415161718192021222324252627282930DutyYYYYYYYYYYYYYYYYYYYYYYYNNNNNNN
When a particular 'Y' is clicked I need the header value. I can detect the click but I am not sure how to get the header (the day value). It appears that the click event is passing the 'Y'. Does the click event pass other information that can be used to get the header value?
I'd like to know if there is a way to keep a table header fixed on top of a div while I scroll the table rows. I have a div high 200px and the table itself is around 300px so when I scroll down I'd like to always see the header on top. I already use for the table tablesorter so the solution must be
compatible with that plug-in.
here is the script as it sits: I need it to add a row following the first row (header) in the table...am thinking I need to use insertBefore but not sure how.
function addTeaGrade(s){
var tableElem, trElem, tdElem, textElem
//get a handle for the table[code].....
I'm having a spot of bother hiding table columns in IE.
With FF, setting the column cell's style.display to none (or changing
the cell's class name to style that has display: none) completely
removes the cells from the table.
In IE, the cell contents go, but the space they occupied is still there,
so the table has an empty column, the same result as setting visibility
= invisible.
I have a html table, is it possible to hide and unhide some column with javascript ....
View 5 Replies View Relatedi have two columns table and this table is dynamic when clicked add button it automatically adds rows i would like to sum values separetly for ex: when i clicked sum-column1 button let it sums only column1 or when i clicked sum-column2 button let it sums only column2 here is code
<html><head><title>dinamik sheet</title>
<script>
function addrow(){
[code]....
How can I fixed first column or more in this script.code...
View 1 Replies View RelatedHow can the user obtain a specific result by choosing values from 2 dropdown list. As a result, the value obtained can not be modified by the user. The table of ten rows by ten columns have to be stored in a mysql dbase.. It's certanly possible , but tedious and time-consuming by using a bunch of "if ... then statements". Considered from a table point of view, the final result is the coordinate of a row value and a column value.
View 1 Replies View RelatedScrollable table widget with fixed header is there such thing ?
View 2 Replies View Relatedi am using two tables. one for the header, one for the body content. has anyone done table sorting in this situation?
View 6 Replies View RelatedI am looking for a way to highlight the row and column header cells as the cursor moves over a cell within the HTML table. This is the code I'm using, but I'm not sure how to identify the TH node of a current (highlighted) cell.
Code:
var table = document.getElementByID("tableId");
var row = table.parentNode();
var col = table.childNodes();
I am wondering if "this" would help in that regard, as in
[Code]...
I'm trying to create a table that has a fixed header but the table contents can be scrolled and also sorted by column headings.I'm already using sortable.js (http://www.surfmind.com/musings/2003/12/01/) library to sort the columns.I can find examples where I can scroll the table with fixed headers, but most of these use a dual table approach, with sortable.js, I think only one table is required. I've found examples how to scroll within a table element using autoflow and scrolling using CSS that I can't follow (I'm new to all of this).How can I get the contents to flow with a single table? Forgive me if it's too easy. If you can help me with a solution, you can ridicule me 'til the cows come home...I'm ok with that. Here is the basic table I have layed out.
<table id="viewKeysetTable" class="sortable">
<tbody>
<tr>
[code]....
how can i swap column in a html table?
View 4 Replies View RelatedI want to ensure one column in a table is always the same number of pixels
wide no matter what the screen resolution is set to on the visitors PC - the
other two columns can wrap away top their hearts content.
How do I do this please? The code below doesn't do it.
<table border="1" width="100%">
<tr>
<td width="180" valign="top"> </td>
<td width="*" valign="top"> </td>
<td width="*" valign="top"> </td>
</tr>
</table>
I'm trying to make a php/jquery-based puzzle game where I have a standard html table (#puzzlegrid) generated by php, and I want to highlight certain parts of it when the mouse is hovering over it. I have one table where there are four different parts (split in the middle vertically and horizontally), separated by id's. The left and topmost cells has id="empty", all the rows beneath these has id="row-clues", the columns next to "empty" has id="column-clues" and finally the bottom-right cells has id="playing-grid", which the hover-function belong to. The number of #column-clues and #column-rows can vary, both in the count of rows and columns. I can give a example code if it's necessary.
As for the jquery-part, I simply want to highlight (add a css class) the current row and column when i hover over the #playing-grid cells. That means selecting all #column-clues and all #column-rows cells that exist on the same row/column the mouse is hovering over. This is what I have so far
$("#puzzlegrid td#playing-grid").hover(function() {
var current_rowIndex = $(this).parent()[0].rowIndex;
var current_columnIndex = $(this).parent().children().index($(this));
$("tr").eq(rowIndex).addClass("highlight");
[Code]....
I've tried a for-loop and each() without luck, as far as my jquery skills goes (and that's not far ). Is it possible to use the index for highlighting several columns, or do I have to do it another way? I can change the HTML code if that's necessary.
What I want to do is to create a function which shifts a table column one position to left. Therefore I'am trying to select all relevant td and th elements. My problem is to rearange the elements. Within the both each calls, see the code below, $(this).get(i) would result the td respectively the th element where the before function is undefined. But how to insert the elements correctly or is this the wrong way?
$.fn.shiftLeft = function(col) {
// Make sure col has value
if(!col){ col = 1; }
var trsToMove = $('tr td:nth-child('+col+')',this);
[Code].....
i'll go straight to the point, i have 8 rows and 3 columns, i want to populate each <td> starting from:
row 0 column 0 a value of 1
row 0 column 1 a value of 2
row 0 column 2 a value of 3
row 1 column 0 a value of 4
row 1 column 1 a value of 5
...
row 7 column 2 a value of 24
let's say starting point is at row1 col1:
[Code]...
I have HTML table with couple of columns with combobox in each row.when I select value in any of the combobox, I want to determine the column number of the combobox which is clicked.Is there any function which can be used to do this?
View 1 Replies View RelatedThis is either really simple or completely impossible
I have a table like the following:
<table>
<tr>
<td>1</td>
[Code]....
This is easy to do in mysql however can it be done in standard html/dhtml ?
I am writing a table which will have the schema of 3 elements:
<input onclick="adjust(/%main%/)"type = "checkbox" id = "all">All</input>ProcessStatus
When I press the check box, it would run the adjust function and pass in the variable \%main%\ which is correct but i get a silent error with firebug on the document.getElementbyId('/%main%/'); line.
function adjust(t){
alert(t);
var s = t + "_job";
alert(s);
var t = document.getElementById(s);selects table but errors here! =/
var t_rows = t.rows.length;
if checkbox is checked, check all, otherwise, uncheck all.
for(var i = 1; i< t_rows;i++){
if (t.rows[0].cells[0].childNodes[0].clicked){
t.rows[i].cells[0].childNodes[0].clicked=true;
}else{
t.rows[i].cells[0].childNodes[0].clicked=false;
}}}
I just want to add, that /%main%/ is the id of a table.
This is a scrolling table. First row & last row are fixed, they don't moved. I also want to fixed the first two column (column1 & column2).code...
View 2 Replies View Relatedhow to do this with javascript for a table that i have made in php and html. I want to hide the row for the table based on the value inside my first column for each row of the table. Like if column 1 has "apple" inside it, then the row would not be shown. My table.php file that has the table i want to do this for:
Code:
<script language="javascript">
imageX1='plus';
imageX2='plus';
imageX3='plus';
function toggleDisplay(e){
imgX="imagePM"+e;
[Code]...