How can I have user controls on slide toggle?

Hi, I want to use

slide Toggle jquery control.

I want to have a label, a text box and a calendar control on the label with id toggle to accept some input. The label, the text box and the calendar control should appear only when I click the "toggle" label and it expands. The label, the text box and the calendar control should disappear when I click the "toggle" label again.

Please find below the html code:

<html>
<head>
  <style>
  p { width:400px; }
  </style>
  <script src="jquery-latest.js"></script>

</head>
<body>
    <label id = "toggle" style="background-color:Gray; width:500px">Toggle</label>
  <p>
    I want to have a label, a text box and a calendar control on
    the label with id toggle to accept some input.
    The label, the text box and the calendar control <b>should appear only</b> when
    I click the "toggle" label and it expands. The label, the text box and the calendar control 
    <b>should disappear </b> when I click the "toggle" label again and this paragraph disappear
  </p>
<script>
    $("label").click(function () {
      $("p").slideToggle("slow");
    });
</script>
</body>
</html>

Can anyone please help?

ansaurus

tags:

views:

answers:

How can I have user controls on slide toggle?

related questions