Использование плагина jQuery Form не работает

Я пытался выяснить, как работать с этим плагином формы jQuery, чтобы загрузить файл, но он не видит, что он делает, что мне нужно.Использование плагина jQuery Form не работает

У меня есть JQuery:

$('.upload-file').click(function() 
{ 
    $('#htmlForm').ajaxForm({ 
     // target identifies the element(s) to update with the server response 
     target: '#htmlExampleTarget', 

     // success identifies the function to invoke when the server response 
     // has been received; here we apply a fade-in effect to the new content 
     success: function(msg) { 
      $('#htmlExampleTarget').hide().html(msg).fadeIn('slow'); 
     } 
    }); 
});

HTML-:

<div id="container"> 
    <form action="upload.php" method="post" id="htmlForm" enctype="multipart/form-data"> 
     <p>E-mail<br /> 
     <input type="text" name="email" id="email" /></p> 
     <p>File<br /> 
     <input type="file" name="upload" id="upload" /></p> 
     <p><input type="button" value="Submit" class="upload-file" /></p> 
    </form> 
</div> 
<div id="htmlExampleTarget"></div>

Форма плагин JQuery включен в <script> в <head></head> с $(document).ready(function() всякий раз, когда я нажимаю на кнопку, подать формы, он ничего не делает. Хотя, если я изменю его

<input type="submit" value="Submit" class="upload-file" />

Форма представляет, но идет в upload.php, когда я должен ожидать его вывода HTML в <div id="htmlExampleTarget"></div> и не делать этого.

EDIT:

<script type="text/javascript" src="js/jquery.form.min.js"></script> 
<script type="text/javascript" src="js/jquery.1.4.2.min.js"></script> 
<script type="text/javascript" src="js/jquery.wmk.min.js"></script> 
<script type="text/javascript" src="js/uimg-core.js"></script>

источник

2010-09-30 MacMac

.ajaxForm() для настройки в <form>, не представив его, вместо этого вы хотите, чтобы запустить его на document.ready:

$(function() { 
    $('#htmlForm').ajaxForm({ 
    target: '#htmlExampleTarget', 
    success: function(msg) { 
     $('#htmlExampleTarget').hide().html(msg).fadeIn('slow'); 
    } 
    }); 
});

Тогда сделать изменения ваш тип будет submit кнопка:

<input type="submit" value="Submit" class="upload-file" />

Альтернатива (хотя это и не ухудшать грациозно) является вызов .ajaxSubmit() так:

$('.upload-file').click(function() { 
    $('#htmlForm').ajaxSubmit({ 
    target: '#htmlExampleTarget', 
    success: function(msg) { 
     $('#htmlExampleTarget').hide().html(msg).fadeIn('slow'); 
    } 
    }); 
});

Это на самом деле представляет форму прямо сейчас, а не устанавливать его для отправки через AJAX на нем submit обработчик.

источник

2010-09-30 17:58:35

Каким будет HTML? – MacMac

@YouBook - во втором примере html не изменился, он все равно может быть чем угодно ... если это кнопка 'type =" submit "' вам нужно 'event.preventDefault()' или 'return false', хотя. –

Это держит меня в курсе, всегда отправляясь на 'upload.php' ... – MacMac

Использование плагина jQuery Form не работает

ответ

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