在php中将表单提交给自己后,表单重置按钮不起作用

时间:2016-12-09 09:38:11

标签: javascript php jquery html forms

这是我的js代码

<script type="text/javascript">
   function resetForm(formID)
   {
       var myForm = document.getElementById(formID);

       for (var i = 0; i < myForm.elements.length; i++)
       {
           if ('submit' != myForm.elements[i].type && 'reset' != myForm.elements[i].type)
           {
               myForm.elements[i].checked = false;
               myForm.elements[i].value = '';
               myForm.elements[i].selectedIndex = 0;
           }
       }
   }
</script>

这是我的PHP代码,

echo "<form class='navbar-form' id='formID' method='POST' action=''>"; 

$sqluser="SELECT DISTINCT username FROM user ORDER BY username ASC";
$resultuser=mysqli_query($conn,$sqluser);

if(isset($_POST['from_date']))
    echo "<div class='form-group' style='margin-right:5px;'><input  id='from_date' name='from_date' type='date' data-date-inline-picker='true' value='".$_POST['from_date']."'/></div>";
else
    echo "<div class='form-group' style='margin-right:5px;'><input  id='from_date' name='from_date' type='date' data-date-inline-picker='true' /></div>";

if(isset($_POST['from_date']))
    echo "<div class='form-group' style='margin-right:5px;'><input  id='to_date' name='to_date' type='date' data-date-inline-picker='true' value='".$_POST['to_date']."'/></div>";
else
    echo "<div class='form-group' style='margin-right:5px;'><input  id='to_date' name='to_date' type='date' data-date-inline-picker='true' /></div>";

echo "<div class='form-group' style='margin-right:5px;'><select  id='username' name='username' style='width:170px;height:33px;'>";
if(isset($_POST['username']) && $_POST['username'] == "-- Username --")
    echo "<option selected='selected'>-- Username --</option>";
else
    echo "<option >-- Username --</option>";
while($ro1=mysqli_fetch_array($resultuser))
{
    if(isset($_POST['username']) && $_POST['username'] == $ro1['username'])
        echo "<option selected='selected' value='".$ro1['username']."'>".$ro1['username']."</option>";
    else
        echo "<option value='".$ro1['username']."'>".$ro1['username']."</option>";
}
echo "</select>";
echo "</div>";
echo "<div class='form-group' style='margin-right:5px;'><input name='reset' type='reset' onclick='resetForm('formId'); return false;' /></div>";

echo "<div class='form-group' style='margin-right:5px;'><input type='submit' value='submit'></div>";
echo "</form>";

单击提交按钮,表单将提交到同一页面,结果将显示在表单下方。即使在提交后,我也会在表单中显示用户输入值。现在,我想要一个重置按钮来清除所有输入字段。在提交​​表单之后,重置按钮在提交之前正在工作,并且在提交后它不起作用。

3 个答案:

答案 0 :(得分:2)

在重置按钮的onclick功能上传递的表单ID不正确。

resetForm('formId');更改为resetForm('formID');

或者,您可以省去自定义功能,让type=reset完成工作。

更改重置按钮
<input name='reset' type='reset' onclick='resetForm('formId'); return false;' />

<input name='reset' type='reset' value='Reset'/>

Input Type Reset Reference Link

答案 1 :(得分:0)

你不必编写那么多代码,只需重置但

提交表单后

使用jquery

单击此按钮
    JNI DETECTED ERROR IN APPLICATION: JNI NewGlobalRef called with pending exception java.lang.ClassNotFoundException: Didn't find class "com.here.sdk.analytics.internal.SQLiteDatabaseStatementResult" on path: DexPathList[[zip file "/system/framework/com.google.android.maps.jar", zip file "/data/app/de.supermega.app-2/base.apk"],
nativeLibraryDirectories=[/data/app/de.supermega.app-2/lib/arm, /data/app/de.supermega.app-2/base.apk!/lib/armeabi-v7a, /vendor/lib, /system/lib]]" 

答案 2 :(得分:0)

in java script , add date in switch cases.

<script type="text/javascript">

   function resetForm(form) {
    // clearing inputs
    var inputs = form.getElementsByTagName('input');
    for (var i = 0; i<inputs.length; i++) {
        switch (inputs[i].type) {
            // case 'hidden':
            case 'text':
                inputs[i].value = '';
                break;
            case 'radio':
            case 'checkbox':
                inputs[i].checked = false; 
            case 'date':
                 inputs[i].value='mm/dd/yyyy';  
        }
    }

    // clearing selects
    var selects = form.getElementsByTagName('select');
    for (var i = 0; i<selects.length; i++)
        selects[i].selectedIndex = 0;

    // clearing textarea
    var text= form.getElementsByTagName('textarea');
    for (var i = 0; i<text.length; i++)
        text[i].innerHTML= '';

    return false;
}
</script>