x | x | x | hx1 | hx1 | hx1 |
x | x | x | hxx1 | hxx2 | hxx3 |
hy1 | hyy1 | hy1 | a1 | 2 | 3 |
hy1 | hyy2 | hy1 | 1.1 | 2.1 | 3.1 |
hy1 | hyy3 | hy1 | 4 | 5 | 6 |
hy2 | hyy3 | hy1 | 7 | 8 | 9 |
hy2 | hyy3 | hy1 | 10 | 11 | 12 |
hy2 | hyy3 | hy1 | 13 | 14 | 15 |
hy3 | hyy3 | hy2 | 1 | 2 | 3 |
hy3 | hyy3 | hy2 | 1 | 2 | 3 |
hy2 | hyy3 | hy1 | 1 | 2 | 3 |
hy2 | hyy3 | hy1 | 1 | 2 | 3 |
hy3 | hyy3 | hy2 | 1 | 2 | 3 |
hy3 | hyy3 | hy2 | 1 | 2 | 3 |
Example:
$("#table").rowspan(0);
$("#table").rowspan(1);
$("#table").rowspan(2);
$('table tbody tr:visible').each(function(row) {
$('#table1').colspan(row);
})
jQuery.fn.rowspan = function(colIdx) {
return this.each(function(){
var that;
$('tr', this).each(function(row) {
$('th:eq('+colIdx+')', this).filter(':visible').each(function(col) {
if ($(this).html() == $(that).html()) {
rowspan = $(that).attr("rowSpan");
if (rowspan == undefined) {
$(that).attr("rowSpan",1);
rowspan = $(that).attr("rowSpan");
}
rowspan = Number(rowspan)+1;
$(that).attr("rowSpan",rowspan); // do your action for the colspan cell here
$(this).hide(); // .remove(); // do your action for the old cell here
} else {
that = this;
}
that = (that == null) ? this : that; // set the that if not already set
});
});
});
}
jQuery.fn.colspan = function(rowIdx) {
return this.each(function(){
var that;
$('tr', this).filter(":eq("+rowIdx+")").each(function(row) {
$(this).find('th').filter(':visible').each(function(col) {
if ($(this).html() == $(that).html()) {
colspan = $(that).attr("colSpan");
if (colspan == undefined) {
$(that).attr("colSpan",1);
colspan = $(that).attr("colSpan");
}
colspan = Number(colspan)+1;
$(that).attr("colSpan",colspan);
$(this).hide(); // .remove();
} else {
that = this;
}
that = (that == null) ? this : that; // set the that if not already set
});
});
});
}
11 comments:
This is great info to know.
Amiable dispatch and this post helped me alot in my college assignement. Thank you as your information.
Thank you very much for this code, it's exactly what I was looking for!
Cheers :)
can u give me the jquery plug in for that ...
Can u give ur plug in for that example
Hi..
I want the code for this task
merging cols when they have same text
Can u give me..
7sajjad8khan6@gmail.com
Hi,
thanks for ur valuable post. this is what i'm looking for.
This post is very useful when the table cells were empty. Can u help me, how to merge table cells(colspan and rowspan) with having data on it....After merging it has to show both cells data into a single cell.
Thanks,
Anil
Nice and simple. Thank you!
thank you!!!
I use this code.
very good!!!
thank you!
Hi,
You can improve perfomance.
$('th:eq('+colIdx+')', this) is too slow, is better to use
$('td',this).eq(colIdx)
You can find an explanation here:
http://stackoverflow.com/questions/8401293/why-is-jquery-tdeq0-slower-than-td-eq0
Hi,
You can improve perfomance.
$('th:eq('+colIdx+')', this) is too slow, is better to use
$('td',this).eq(colIdx)
You can find an explanation here:
http://stackoverflow.com/questions/8401293/why-is-jquery-tdeq0-slower-than-td-eq0
Post a Comment