Q:

Выбор формы jQuery

Имеется форма, в которой необходимо выбрать условие поиска (искать по фамилии или по номеру карточки), и чтоб при нажатии на кнопку "поиск" под формой загружалась форма с результатом.
В результирующей форме указывались параметры и сохранялись (записывались в базу). Как это сделать без перезагрузки страницы. Понятно, что на аяксе, но как?
Форма выбора параметров поиска
<table width="305" height="161" border="1">
  <tr>
    <td width="144"><input type="radio" name="radio" id="radio" value="radio" />
    Номер карточки</td>
    <td width="145"><input type="radio" name="radio2" id="radio2" value="radio2" />
      Фамилия</td>
  </tr>
  <tr>
    <td><input type="text" name="textfield" id="textfield" /></td>
    <td><input type="text" name="textfield2" id="textfield2" /></td>
  </tr>
  <tr>
    <td colspan="2"><div align="center">
      <input type="submit" name="button" id="button" value="      Поиск      " />
    </div></td>
  </tr>
</table>

Форма ввода параметров (результирующая)
<table width="325" border="1">
  <tr>
    <td width="142">Номер карточки</td>
    <td width="167"><input type="text" name="textfield" id="textfield" /></td>
  </tr>
  <tr>
    <td>ФИО</td>
    <td><input type="text" name="textfield2" id="textfield2" /></td>
  </tr>
  <tr>
    <td>Пол</td>
    <td><select name="select" id="select">
    </select>
    </td>
  </tr>
  <tr>
    <td>Образование</td>
    <td><select name="select2" id="select2">
    </select>
    </td>
  </tr>
  <tr>
    <td><div align="center">
      <input type="submit" name="button" id="button" value="Сохранить" />
    </div></td>
    <td><div align="center">
      <input type="submit" name="button2" id="button2" value="Отменить" />
    </div></td>
  </tr>
</table>

A:

<head>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
    <style type="text/css">
        #big_form {
            display: none;
        }
    </style>
</head>

<body>

<table width="305" height="161" border="1">
<form action="/myscript.php" id="small_form">
  <tr>
    <td width="144"><input type="radio" name="radio" id="radio1" value="radio" />
    номер карточки</td>
    <td width="145"><input type="radio" name="radio" id="radio2" value="radio2" />
      Фамилия</td>
  </tr>
  <tr>
    <td><input type="text" name="textfield1_name" id="textfield1" /></td>
    <td><input type="text" name="textfield2_name" id="textfield2" /></td>
  </tr>
  <tr>
    <td colspan="2"><div align="center">
      <input type="submit" name="button" id="search_button" value="      Поиск      " />
    </div></td>
  </tr>
</form>
</table>

<table width="325" border="1" id="big_form">
  <tr>
    <td width="142">Номер карточки</td>
    <td width="167"><input type="text" name="textfield" id="textfield" /></td>
  </tr>
  <tr>
    <td>ФИО</td>
    <td><input type="text" name="textfield3" id="textfield3" /></td>
  </tr>
  <tr>
    <td>Пол</td>
    <td><select name="select" id="select">
    </select>
    </td>
  </tr>
  <tr>
    <td>Образование</td>
    <td><select name="select2" id="select2">
    </select>
    </td>
  </tr>
  <tr>
    <td><div align="center">
      <input type="submit" name="button" id="button" value="Сохранить" />
    </div></td>
    <td><div align="center">
      <input type="submit" name="button2" id="button2" value="Отменить" />
    </div></td>
  </tr>
</table>
    <script type="text/javascript">
        $(document).ready(function() {
            $("#small_form").submit(function(event) {
                event.preventDefault();
                var url = $(this).attr("action");
                if ($("#radio1").is(':checked')) {
                    $.post (
                        url, {
                            textfield1_name: $("#textfield1").val()
                        }, function(response) {
                            //response - это то, что выдаст сервер на такой пост
                            //запрос, следовательно тут должен быть скрипт вставляющий
                            //ответы в форму, это делается так:
                            //$("#textfield3").val("часть ответа");
                            $("#big_form").fadeIn(1000);//затем отображаем форму
                        }
                    );
                } else {
                    $.post (
                        url, {
                            textfield1_name: $("#textfield2").val()
                        }, function(response) {
                            //аналогично
                        }
                    );
                }
            });
        });
    </script>
</body>

ПС обратите внимание, что для избежания проблем все элементы должны иметь разные id, в рамках целой страницы, а не одной формы. Плюс, наверно радио-кнопки должны иметь одно имя, т.к. иначе они могут быть нажаты вместе.

