Установка переключателей с помощью jQuery при автоматическом обновлении страницы - PullRequest
1 голос
/ 08 февраля 2012

Я написал следующий jQuery для автоматического обновления страницы, содержащей опрос (для обновления текущей опции выигрыша)

function update() {
  var vote_radio = $('input:radio[name=vote_radio]:checked').val();
  $.ajax({
    type: 'POST',
    url: 'index.php',
    data: 'refresh=true&maintain_radio='+ vote_radio,
    timeout: 2000,
    success: function(data) {
      $("#current_body").html(data);
      $("#notice_div").html(''); 
      $("[name=vote_radio]").filter("[value="+vote_radio+"]").attr("checked","checked");
      window.setTimeout(update, 2000);
    },
    error: function (XMLHttpRequest, textStatus, errorThrown) {
      $("#notice_div").html('Timeout contacting server..');
      window.setTimeout(update, 60000);
    }
});
};

$(document).ready(update);

На странице с именем "voice_radio" есть опрос по радио-кнопке, я также использую следующий код для Ajax-ответов на сервер:

    $(function() {  
  $('.error').hide();
  $('.failure').hide();
  $('.success').hide();
  $(".vote_submit").click(function() {
        if (!$("input[@name='name']:checked").val()) {
            $('.error').show();
            return false;
        }
        var vote_radio = $('input:radio[name=vote_radio]:checked').val();;
        var dataString = 'vote_radio='+ vote_radio;
        $.ajax({
          type: "POST",
          url: "index.php",
          data: dataString,
          success: function() {
            $('.success').show();               
            $('.failure').hide();               
          },
          error: function() {
            $('.failure').show();               
            $('.success').hide();               
          }
        });
        return false;
  });
});

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

Кроме того, если второму сценарию предписано, чтобы класс .success появился, то, когда первый сценарий автоматически обновляет страницу, он снова скрывает класс успеха.

1 Ответ

0 голосов
/ 08 февраля 2012

Почему вы возвращаете элемент vote_radio обратно к значению, прежде чем инициировать вызов AJAX?

Просто прочитайте его перед перезаписью, чтобы сохранить текущее значение (, даже если оно изменилось)пока не будет отправлено )

, поэтому просто измените обратный вызов успеха на

success: function(data) {
      var vote_radio = $('input:radio[name=vote_radio]:checked').val();
      $("#current_body").html(data);
      $("#notice_div").empty(); 
      $("[name=vote_radio]").filter("[value="+vote_radio+"]").attr("checked","checked");
      window.setTimeout(update, 2000);
    }

Но, как правило, правильным способом было бы обновить только частистраница, которая нуждается в обновлении, а не вся страница .. в этом весь смысл AJAX ..

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...