jqeury slideUp(); breaks my POST form

Question

I have a form with several <input> text boxes. They work fine via a post request.

Each one is enclosed in its own div, which slides up (using slideUp();) what it has been filled in. However, any text box whose div that has undergone slideUp(); (and is therefore invisible) does not pass its variable on to the next page when the form has been submitted. Does anyone have any advice on how the slideUps can continue but all data is passed on? Many thanks.

Code

<form id="word_list" method="post" action="results.php">
     //All PHP removed for clarity
     //The div with id="word1" experiences slideUp();
     //I know this isn't a valid way to comment!
<div align="center" class="input_box" id="div1">
       <input type="text" id="word1" name="word1" /></div>
    <div align="center" class="input_box"><input type="submit" /></div>
  </form>

Answer 1

slideUp like some other effects ends up setting display:none on the element. That might be behind your problem. To deal with it, you could copy the values of these inputs to hidden form elements before triggering slideUp or you could use ajax to send them to the server at that time. It's a bit of a drag but I'm sure you can make it work.

Answer 2

Just for the record, the problem was down to my own mistake, rather than slideUp();

I had been doing $("#"+word_id).attr("disabled", true); to stop people writing in the text fields after they had been submitted, but this ruined the form too. Disabled attributes aren't available after POST, it seems. Sorry.