2013-09-27 2 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

Kevin B에게 감사드립니다! 그것은 나를 위해 또한 매우 도움이 될 것입니다! 나는 보통 버튼과 클릭 기능을 만들어서 "값을" ""- :--로 설정한다. – TimSPQR

답변

-1

당신이 사용할 수있는 작동하는 것 :

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

업데이트 : 은이 기능으로 jQuery를 확장해야한다는 얘기를 깜빡 했네요 :

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

버튼을 클릭하거나 무엇인가에 추가하십시오 – HasanAboShally

+1

아니, 할 수 없습니다. jQuery 객체는'reset()'메소드를 지원하지 않는다. DOM 요소는'

'입니다. –

+0

@ FrédéricHamidi 감사합니다. 의견을 업데이트했습니다. 현재 작동해야합니다 :) – HasanAboShally

관련 문제