JQuery отправить выбрать поле на изменение, ajax результаты

Question

в моем приложении rails у меня есть поле выбора в форме. Когда поле изменится, я бы хотел, чтобы оно отправило форму и получило результаты удаленно.

Вот мой текущий код (РЕДАКТИРОВАТЬ - эта часть работает, я пытаюсь добавить к нему больше):

$(function() {
  $("#statusFilter").live("change", function() {
    this.submit();
  });
});

В другой части приложения у меня есть следующее, для гиперссылки, при нажатии на которую, ссылка возвращается удаленно. Так что я хотел бы, чтобы тот же эффект для вышеуказанной формы.

$(function() {
  $("#posts_container th a").live("click", function() {
    $.getScript(this.href);
    return false;
  });
});

вот еще один пример того, как это работает с формой поиска

  $("#dash_search input").keyup(function() {
    $.get($("#dash_search").attr("action"), $("#dash_search").serialize(), null, "script");
    return false;
  });

Содержимое, которое я пытаюсь удаленно обновить в жизни в posts_container

Answer 1

Лично я бы не использовал форму вокруг поля выбора в этом случае, если вы не используете форму для размещения каких-либо других элементов формы.

Из того, что вы сказали, похоже, что вы пытаетесь добиться следующего:

1. Пользователь меняет поле выбора.
2. Новое значение в поле выбора затем используется для обновления поля posts_container.

Если я правильно понял, я бы написал следующее:

Выбрать поле

<div>
    <select id="statusFilter">
        <option value="1">Option 1</option>
        <!-- Other options... -->
    </select>
</div>

JavaScript

<script type="text/javascript">
    $(document).ready(function() {
        $("#statusFilter").change(function() {
            // Possibly show an ajax loading image $("#ajax_loading").show();
            $("#posts_container").load("somepage.php", { value: $(this).val() }, function() {
                // Do something to say the data has loaded sucessfully
                // Possibly hide the ajax loading image $("#ajax_loading").hide();
            });
        });
    });
</script>

Я не знаю, помогает ли это или находится в правильных строках, но дайте мне знать, и я постараюсь помочь и дальше, если нет.

Answer 2

Попробуйте это

$(function() {
  $("#statusFilter").live("change", function() {
    //$(this).closest("form").submit();
    var $form = $(this).closest("form");
    $.post( {
       url: $form.action, 
       data: $form.serialize(),
       success: function(){ //Write code here to handle on success }
    });
});