2013-09-27 3 views
-1

У меня есть форма с textarea, некоторые input[type=text] и другие input[type=file]. Я передаю форму через плагин JQuery Form, и я не смог затем очистить/оставить форму любым способом. Я пробовал варианты формы плагин clearFrom и resetForm и некоторые другие, и никто, кажется, работаютКак эффективно очистить/оставить форму?

HTML

<form action="validade_main_cenas.php" method="POST" enctype="multipart/form-data" class="post-cenas-form" id="post-cenas-form" name="post_cenas_form"> 
    <div> 
     <fieldset> 
      <label>cenas</label> 
      <textarea name="cenas" rows="" class="ask_cenas_form_input_question" placeholder="cenas your cenas..."></textarea> 
     </fieldset> 
     <fieldset> 
      <div class="image-post-container" id="image-post-container"> 
       <div id="image-post-preview" class="image-post-preview"> 
        <img id="image-preview" name="image-preview" class="image-preview" src="#"> 
       </div> 
      </div> 
     </fieldset> 
     <fieldset> 
      <label>Tags</label> 
      <input id="tags" name="tags" class="input-block-level" type="text" placeholder="e.g cenas"> 
     </fieldset> 
     <div id="" class="footer"> 
      <div id="" class="footer-post-image"> 
       <button type="button" id="yourBtn" class="btn" onclick="getFile()"><i class="icon-camera"></i> 
       </button> 
       <div style='height: 0px;width: 0px; overflow:hidden;'> 
        <input id="upfile" type="file" name="myfile" value="upload" /> 
       </div> 
      </div> 
      <div id="" class="footer-submit-button"> 
       <input type="submit" id="cenas_it" class="btn btn-hunch" value="Hunch" /> 
      </div> 
     </div> 
     <!-- close footer !--> 
    </div> 
    <!-- wrapper para quando existe imagem !--> 
</form> 
<script type="text/javascript"> 
    function getFile() { 
     document.getElementById("upfile").click(); 
    } 

    function readURL(input) { 
     if (input.files && input.files[0]) { 
      var reader = new FileReader(); 
      reader.onload = function(e) { 
       $('#image-preview').attr('src', e.target.result); 
      } 
      reader.readAsDataURL(input.files[0]); 
     } 
    } 

    $("#upfile").change(function() { 
     readURL(this); 
     $('#image-post-container').slideDown('fast'); 
    }); 
</script> 
<script src="http://malsup.github.com/jquery.form.js"></script> 
<script type="text/javascript" src="js/load_questions.js"></script> 

JS

$(document).ready(function() { 
    var options = { 
     clearForm: true, 
     resetForm: true, 
     success: function (html) { 
      $("ol#list-feed").prepend(html); 
      $("ol#list-feed li:first").slideDown(600); 
      $("ol#list-feed li div.footer-post").hide(); 
      resetForm($('#post-cenas-form')); 
      document.getElementById('set-width1').reset(); 
      document.getElementById('upfile').reset(); 
      document.getElementById('tags').reset(); 
      //document.getElementById('set-width1').val(''); 
      //document.getElementById('tags').val(''); 
      if ($("ol#list-feed > li").size() <= 3) { 
       $('#loadmorebutton').hide(); 
      } else { 
       $("ol#list-feed > li:last").remove(); 
       $('#loadmorebutton').show(); 
      } 
      $('form#post-cenas-form')[0].reset(); 
      //$("#post-cenas-form").resetForm(); 
      //$(this).children(':input').val(''); 
     }, 
     error: function() { 
      alert('ERROR: unable to upload files'); 
     }, 
     complete: function() { 
      resetForm($('#post-cenas-form')); 
      document.getElementById('set-width1').reset(); 
      document.getElementById('upfile').reset(); 
      document.getElementById('tags').reset(); 
      //$('form#post-cenas-form')[0].reset(); 
      //$(this).children(':input').val(''); 
     }, 
    }; 
    $("#post-cenas-form").ajaxForm(options); 
    function resetForm($form) { 
     $form.find('input:text, input:password, input:file, select, textarea').val(''); 
     $form.find('input:radio, input:checkbox') 
     .removeAttr('checked').removeAttr('selected'); 
    } 
}); 
+5

'$ ('# пост-Cenas-форма') [0] .RESET()' должен быть более чем достаточно. избавиться от остальных. –

+0

Я уже пробовал. Тем не менее, я последовал твоему предложению, добавив $ ('form # post-question-form') [0] .reset(); как «успех», так и «полный» и никакого эффекта. Можете ли вы представить, что может произойти? – crowdfun

+1

Спасибо, Кевин Б! Это тоже будет полезно для меня! Обычно я делаю кнопку и функцию щелчка с набором «установленных значений» в «» - :-) – TimSPQR

ответ

-1

Вы можете использовать:

$('#FORM-ID').reset();

ОБНОВЛЕНИЕ: Забыл упомянуть, что вы должны расширить JQuery с помощью этой функции:

jQuery.fn.reset = function() { 
     $(this).each (function() { this.reset(); }); 
    } 
+0

Добавьте его на кнопку click или что-то – HasanAboShally

+1

Нет, вы не можете. Объекты jQuery не поддерживают метод 'reset()'. '

' Элементы DOM. –

+0

@ FrédéricHamidi спасибо, я обновил комментарий, теперь это должно работать :) – HasanAboShally

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