2014-01-11 6 views
0

Перезагрузка страницы после отправки формы, и я хочу, чтобы она не перезагружалась. Обновление: с ответами ниже я подошел с кодом ниже. Случается, что форма отправляется правильно, но страница перезагружается. Раньше эта строка кода работает отлично:Представление формы Ajax перезагружает страницу

$(document).ready(function() { 
    $('#poll').ajaxForm(function() { 
     $("#polling_id").load("poll_results.php"); 
    }); 
}); 

Сегодня я добавил .htaccess для удаления .php расширения. Может ли это повлиять на это?

HTML

<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.js"></script> 
    <script src="http://malsup.github.com/jquery.form.js"></script> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></SCRIPT> 
</head> 
<div class="polling" id="polling_id"> 
    <br><br>  

    <form id="poll_form" method="POST" action="process-vote.php" /> 
    <div class="poll_objects"> 
     <input type="hidden" name="o1" value="<?php echo $option1; ?>" /> 
     <input type="hidden" name="o2" value="<?php echo $option2; ?>" /> 
     <input type="hidden" name="o3" value="<?php echo $option3; ?>" /> 
     <span class="footer_font"><input type="radio" name="radio_1" value="<?php echo $option1;?>" id="radio" /><label for="radio"><?php echo $option1;?></label> </span><br><br> 
     <span class="footer_font"><input type="radio" name="radio_1" value="<?php echo $option2;?>" id="radio2" /><label for="radio2"><?php echo $option2;?></label></span><br><br> 
     <span class="footer_font"><input type="radio" name="radio_1" value="<?php echo $option3;?>" id="radio3" /><label for="radio3"><?php echo $option3;?></label></span><br><br> 
     <div class="float_buttons"> 
      <input type="submit" name="submit_vote" value="Vote!" class="button" /> 
      <input type="submit" name="results" value="Poll Results" class="button"/> 
     </div> 
    </div> 
</div> 
</form> 

JQuery:

<script> 
    $(document).ready(function() {   
     $.ajax({  
      $('#poll_form').submit(function(e) { 
       e.preventDefault(); 
       // note where the e comes from. 
       var a = $(this).serialize(); 
       $("#polling_id").load("poll-results.php"); 
      }); 
     });  
    }); 
</script> 
+1

вы заменили порядок строк: '$ .ajax ({' и 'e.preventDefault();' –

ответ

3

Это не выглядит, как вы захватить событие.

$('#poll_form').submit(function(e) { 
    e.preventDefault(); 
    // note where the e comes from. 
    var a = $(this).serialize(); 
    // now do your ajax stuff here. 
}); 
+0

Ваш метод загружает материал без страницы обновить, но он не отправляет форму – user3186034

+0

Это потому, что вам необходимо реализовать необходимый '$ .ajax ({})' звонок для отправки данных на ваш сервер и отвечать соответствующим образом. –

+0

ну тогда форма отправлена ​​и страница перезагружена. Я обновил свой пост. – user3186034

0

Вы также можете поместить:

<script> 
    function validate() 
    { 
    ... 
     blablabla 
    ... 
    return false; // This cause the submit function to be stopped. 
    } 
</script> 
<form onClick="validate()"> 
Смежные вопросы