Using jQuery slide in form

Hello All,

I have a form like this




  <div class="row">

    <?php echo $form->labelEx($model,'status'); ?>

    <?php echo $form->radioButtonList($model,'status',array('open'=>'Open','closed'=>'Closed'),array(

    'labelOptions'=>array('style'=>'display:inline;padding-right:10px'),'separator'=>'',));?>

    <?php echo $form->error($model,'status'); ?>

  </div>

   

which is rendered in html is like this




  <div class="row">

    <label for="Invoices_status" class="required">Status <span class="required">*</span></label>

    <input id="ytInvoices_status" type="hidden" value="" name="Invoices[status]" />

    <input id="Invoices_status_0" value="open" type="radio" name="Invoices[status]" /> 

    <label style="display:inline;padding-right:10px" for="Invoices_status_0">Open</label>

    <input id="Invoices_status_1" value="closed" type="radio" name="Invoices[status]" />

    <label style="display:inline;padding-right:10px" for="Invoices_status_1">Closed</label>

  </div>

 

Now I want that when the form will be load, it will only show status with open and closed radio button.

When user will click on the status ‘Open’ button,one new empty input field will be slide down.Where user will enter the value for the date.When user will click on the status ‘Closed’ button no new field will slide down.So how to do that.Any help and suggestions will be higly appriciable.