提出が成功した後にjeasyuiフォームフィールドをクリアする

Question

xoopsモジュール内にjeasyuiフォームを使用しています。データが正常に送信されると、すべてのフォームフィールドをクリアしようとしています。

私は既にthis questionに相談しましたが、私の場合は問題を解決しませんでした。

マイHTML：

<div class="easyui-panel" title="Capture Reqs" style "width:100%; 
max-width:600px; padding:30px 60px;"> 

    <form action = "captureReqs_Save.php" id ="ff" class = "easyui-form" 
    method ="post" data-options = "novalidate:true"> 

     <div style="margin-bottom:20px"> Area <br> 
     <input id="idArea" class="easyui-combobox" style="width:260px" name="idArea" 
      data-options=" 
      url:'areasJson.php?idZona=<?php echo $idZone; ?>', 
      label:'Area:', 
      valueField: 'id', 
      textField: 'desc', 
      required:true 
     "> 
     </div> 

     <div style="margin-bottom:20px"> Material 
     <input id="IdMaterial" class="easyui-combobox" style="width:100%" 
     name="IdMaterial" data-options=" 
      loader: myloader, 
      mode: 'remote', 
      valueField: 'code', 
      textField: 'desc', 
      required:true 
     "> 

     <div style="margin-bottom:20px"> Qty 
      <input class="easyui-textbox" name="quantity" style="width:100%" 
      data-options="label:'Qty:',required:true, validType:'number'"> 
     </div> 


     <div style="margin-bottom:20px">    
    </form> 

    <div style="text-align:center;padding:5px 0"> 
     <a href="javascript:void(0)" class="easyui-linkbutton" 
     onClick = "submitForm()" style="width:80px"> Submit</a> 

     <a href="javascript:void(0)" class="easyui-linkbutton" 
     onClick = "resetForm()" style = "width:80px"> Clear </a> 
    </div> 
</div> 

スクリプト：

<script> 
    var myloader = function (param, success, error) { 
     var q = param.q || ''; 
     if (q.length <= 2) { 
      return false 
     } 
     $.ajax({ 
      url: 'materialJson.php?idArea=' + $('#idArea').combobox('getValue'), 
      dataType: 'json', 
      data: { 
       q: q 
      }, 
      success: function (data) { 
       var items = $.map(data, function (item, index) { 
        return { 
         code: item.code, 
         desc: item.desc 
        }; 
       }); 
       success(items); 
      }, 
      error: function() { 
       error.apply(this, arguments); 
      } 
     }); 
    } 

    function submitForm() { 
     $('#ff').form('submit', { 
      onSubmit: function() { 
       return $(this).form('enableValidation').form('validate'); 
      } 
     }); 

    } 

    function resetForm() { 
     $('#ff')[0].reset(); 
    } 
</script> 

Answer 1

がresetFormを呼び出してみてください。私は約束様式ajaxを使用するように変換し、resetFormを追加しました

var myloader = function (param, success, error) { 
    var q = param.q || ''; 
    if (q.length <= 2) { 
     return false 
    } 
    $.ajax({ 
     url: 'materialJson.php?idArea=' + $('#idArea').combobox('getValue'), 
     dataType: 'json', 
     data: { 
      q: q 
     } 
    }).then(function (data) { 
     var items = $.map(data, function (item, index) { 
      return { 
       code: item.code, 
       desc: item.desc 
      }; 
     }); 
     success(items); 
    }).fail(function() { 
     error.apply(this, arguments); 
    }); 
} 

function submitForm() { 
    $('#ff').submit(function() { 
     if ($(this).form('enableValidation').form('validate')) { 
      $.post($(this).attr('action'), $(this).serialize(), function (response) { 
       clearForm(); 
      }); 
     } 
     return false; 
    }); 
} 

function resetForm() { 
    $('#ff')[0].reset(); 
}