jquery Find TD of TR with Class and make changes (for a Telerik MVC grid)

68,380

Solution 1

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.

Solution 2

Try this:

$('tr.t-detail-row td.t-hierarchy-cell').remove();
$('tr.t-detail-row td.t-detail-cell').attr('colspan', X); // replace X with desired colspan value
Share:
68,380
HaBo
Author by

HaBo

I am a Microsoft Certified Solution Developer, working as a “Director/Senior Application Architect/Developer” with an overall experience of 10+ Years in related fields. I have a tremendous desire to exceed in whatever I undertake.

Updated on May 30, 2020

Comments

  • HaBo
    HaBo almost 4 years

    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


    Hi, How can i call client jquery Function when grid expand is fired.

    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


    just add this line in your telerik code

    .ClientEvents(exp => exp.OnDetailViewExpand("onExpandingtheGrid"))
    

    and rest as mentioned in your above jquery function yahoo!

  • HaBo
    HaBo over 12 years
    I have updated my requirement more specifically, please look in it. And that you very much for your time.
  • HaBo
    HaBo over 12 years
    I have updated my requirement more specifically, please look in it. And that you very much for your time.