this is my mark up
<tr class="t-detail-row">
<td class="t-hierarchy-cell"></td>
<td class="t-detail-cell" colspan="5"></td>
</tr>
I want to find the tr with class t-detail-row and remove the child td with class t-hierarchy-cell and change the colspan of td with class t-detail-cell
I tried something like this
var newcolspan = $(e.row).find('.t-detail-row').children('td.t-detail-cell').attr('colspan');
$(e.row).find('.t-detail-row').children('td.t-hierarchy-cell').remove()
.children('td.t-detail-cell').attr('colspan',newcolspan+1);
any help would be greatly appreciated.
More Specific Details about the situation
all that i want to achieve is. when we expand the Telerik MVC grid we get this mark up in detail row
<tr class="t-detail-row">
<td class="t-hierarchy-cell"></td>
<td class="t-detail-cell" colspan="5"></td>
</tr>
i want to eliminate <td class="t-hierarchy-cell"></td>
in it.
and get the mark up as
<tr class="t-detail-row">
<td class="t-detail-cell" colspan="Current+1"></td>
</tr>
for this i though of doing some thing like this
on grid expand event, if i can call a jquery function then because i wont have the detail-row markup generated until we expand the grid
function onExpandingtheGrid(){
$('tr.t-detail-row').find('td.t-hierarchy-cell').remove();
$('tr.t-detail-row').find('td.t-detail-cell').attr('colspan',newcolspan+1);
}
Thanks
Solution
.ClientEvents(exp => exp.OnDetailViewExpand("onExpandingtheGrid"))
and rest as mentioned in your above jquery function yahoo!
with separate functions its:
$('tr.t-detail-row').find('td.t-hierarchy-cell').remove();
$('tr.t-detail-row').find('td.t-detail-cell').attr('colspan',newcolspan+1);
i used find in this case because it looks like you are trying to use a target row for a click or something. replace the tr selector with your target if that is the case.