.ajax() обновляет страницу после нажатия ENTER

Я использую ajax для обновления db с новой папкой, но он обновляет страницу после нажатия ENTER. на моей форме у меня есть onkeypress="if(event.keyCode==13) savefolder();" вот код javascript, который у меня есть: что он делает в основном после того, как вы нажмете enter, он вызывает функцию savefolder, savefolder затем отправляет запрос через ajax, чтобы добавить папку в db. Проблема в том, что она обновляет страницу ... Я хочу, чтобы она осталась на той же странице. любые предложения? Спасибо.ajax() обновляет страницу после нажатия ENTER

<script> 


function savefolder() { 

var foldername= jQuery('#foldername').val(), 
    foldercolor= jQuery('#foldercolor').val(); 
// ajax request to add the folder 
      jQuery.ajax({ 
       type: 'get', 
       url: 'addfolder.php', 
       data: 'foldername=' + foldername + '&foldercolor=' + foldercolor,  
       beforeSend: function() { alert('beforesend');}, 
       success: function() {alert('success');} 
      }); 

return false; 
} 
</script>

источник

2012-02-19 cppit

Почему вы 'é' объявлены дважды (в' doc.ready() 'и как' window.event') и 'Возвращение false; 'в конце' savefolder() 'должен (я думаю) отменить форму submit, если это так. То, что вы опубликовали, не имеет особого смысла (где заканчивается блок 'doc.ready()?). –

Кроме того, * ajax * не запускает обратный вызов; тот факт, что ваш обработчик 'submit' не отменяет событие' submit', что делает. Я не видел такого подхода, как у вас (возможно, это специфичный для IE?), И я не вижу, где вы объявляете обработчик 'submit'. –

@JaredFarrish у него есть событие inline onkeypress, определенное в теге формы ... – xandercoded

Это работает:

<form> 
    <input type="submit" value="Enter"> 
    <input type="text" value="" placeholder="search"> 
</form> 

function savefolder() { 
    var foldername= jQuery('#foldername').val(), 
     foldercolor= jQuery('#foldercolor').val(); 

    jQuery.ajax({ 
     type: 'get', 
     url: '/echo/html/', 
     //data: 'ajax=1&delete=' + koo,  
     beforeSend: function() { 
      //fe('#r'+koo).slideToggle("slow"); 
     }, 
     success: function() { 
      $('form').append('<p>Append after success.</p>'); 
     } 
    }); 

    return false; 
} 

jQuery(document).ready(function() { 
    $('form').submit(savefolder); 
});

http://jsfiddle.net/TFRA8/

Вы должны проверить, чтобы увидеть, если у вас возникли какие-либо ошибки в процессе обработки (Firebug или Chrome Консоль может помочь). Как бы то ни было, ваш код не является корректным, так как $(document).ready() никогда не закрывается в коде, который вы включили в вопрос.

источник

2012-02-19 03:15:00

спасибо Джареду, скрипка работает, к сожалению, на моей странице она все еще освежает. На этой странице есть еще одна форма, и ящик ввода внутри нее. Думаю, мне нужно вытащить его из формы, затем должно сработать. – cppit

Я бы сбросил метод события onkeypress для 'onsubmit', так как это вызвано нажатием клавиши' enter', а также щелчком элемента ввода 'submit' и AFAICT, вы ничего не делаете, кроме этого. Я бы также не использовал встроенные обработчики событий, т. Е. Не использовал 'onsubmit =" return saveFolder() "', вместо этого использовал '$ ('form'). Submit (handler ...)'. Не видя фактического кода и разметки в прямом эфире, я не уверен, что сказать, за исключением того, что есть неперехваченная ошибка или что-то, что «отменяет» выполнение кода и позволяет форме продолжить отправку. –

gotcha. Спасибо – cppit

-1

Поскольку по умолчанию на форме кнопка ввода отправляет форму, вам нужно не только справиться с этим с вашим собственным кодом, но после отмены события.

Попробуйте этот код вместо:

onkeypress="if(event.keyCode==13) {savefolder(); return false;}"

OnKeyPress события, что возвращаемое значение из JavaScript и только продолжать это событие, если она возвращает истину.

источник

2012-02-19 02:55:42 xthexder

thanks xthexder но это возвращает пустую страницу. – cppit

Просто stop the propagation of the event на момент представления формы

jQuery(document).ready(function($) { 
    $("#whatever-form-you-are-pulling-your-values-from").submit(function(event) { 
    var foldername = $('#foldername').val(); 
    var foldercolor = $('#foldercolor').val(); 

    event.stopPropagation(); 

    // ajax request to add the folder 
    $.ajax({ 
     type: 'get', 
     url: '../addfolder.php', 
     data: 'ajax=1&delete=' + koo,  
     beforeSend: function() { fe('#r'+koo).slideToggle("slow"); }, 
     success: function() { } 
    }); 
});

источник

2012-02-19 03:16:47

.ajax() обновляет страницу после нажатия ENTER

ответ

Смежные вопросы