slideDown, slideUp not working in jQuery

Question

Hi Friends slideDown and slideUp function are not working with my code. It appears the hidden row without slideDown effect PLease help guys you can chekc my code below or

Answer 1

You can not slide table rows, as you can't manipulate the height of them. jQuery's animation relies upon the element having height and width.

Inline elements do not have these dimensions set or settable, so animations must make them block-level elements.It's probably better to just use regular, non-animated, hide and show for such elements.

You can also use fadeIn and fadeOut. Demo

Answer 2

Check this demo jsFiddle

JQuery

$('tr').not(':first').children('td').wrapInner('<div>');
$('select').on('change',function(){
    if($(this).val()=='Others')
    {
        $('td > div').slideDown(2000, function() {
            $(this).parent().slideDown(2000);
        });
    }
    else
    {
        $('td > div').slideUp(1000, function() {
            $(this).parent().slideUp();
        });
    }
});