POST成功后表格未重置

Question

我正在尝试创建一个写入数据库的简单表单。由于该服务将要存在的地方的性质，它必须在IE 11中运行。

故事是，当我输入值时，单击“提交”时数据将发布，但是成功功能将不会触发。

第二部分是，如果我将表单保留为空白，则会收到验证错误，将触发成功函数，并且数据库中将出现空白行。

我也很容易承认我不知道我不知道的东西，因为我对JavaScript和AJAX缺乏经验。

<form id="NewThinClient" runat="server">
<h3>Create a new thin client</h3>
<p>
    <label>Asset Tag:</label>
    <asp:TextBox id="assetTag" ValidationGroup="TextBoxes"  runat="server"/>
    <asp:RequiredFieldValidator id="RequiredFieldValidator1" runat="server" ControlToValidate="assetTag" ValidationGroup="TextBoxes" ErrorMessage="Cannot be blank" ></asp:RequiredFieldValidator>
</p>
<p>
    <label>MAC:</label>
    <asp:TextBox id="macAddress" runat="server" ValidationGroup="TextBoxes" />
    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ControlToValidate="macAddress" ValidationGroup="TextBoxes" ErrorMessage="Cannot be blank"></asp:RequiredFieldValidator>
</p>
<p>
    <label>Serial:</label>
    <asp:TextBox id="serial" ValidationGroup="TextBoxes" runat="server"/>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ControlToValidate="serial"  ValidationGroup="TextBoxes" ErrorMessage="Cannot be blank"></asp:RequiredFieldValidator>
</p>

<p>
    <label>TimeZone:</label>
    <asp:DropDownList  id="cbTimeZone" runat="server">
        <asp:ListItem>Pacific</asp:ListItem>
        <asp:ListItem>Arizona</asp:ListItem>
        <asp:ListItem>Mountain</asp:ListItem>
        <asp:ListItem>Central</asp:ListItem>
        <asp:ListItem>Eastern</asp:ListItem>
    </asp:DropDownList>

</p>
    <p>
        <label>City</label>
        <asp:TextBox id="custom1" ValidationGroup="TextBoxes"  runat="server"/>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator4" runat="server" ControlToValidate="custom1"  ValidationGroup="TextBoxes"  ErrorMessage="Cannot be blank"></asp:RequiredFieldValidator>
    </p>
    <p>
        <label>State</label>
        <asp:TextBox id="custom2" ValidationGroup="TextBoxes"  runat="server"/>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator5" runat="server" ControlToValidate="custom2" ValidationGroup="TextBoxes" ErrorMessage="Cannot be blank"></asp:RequiredFieldValidator>
    </p>
    <p>
        <label>Business Unit</label>
        <asp:TextBox id="custom3" ValidationGroup="TextBoxes"  runat="server"/>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator6" runat="server" ControlToValidate="custom3" ValidationGroup="TextBoxes" ErrorMessage="Cannot be blank"></asp:RequiredFieldValidator>
    </p>
    <p>
        <label>Function</label>
        <asp:TextBox id="custom4" ValidationGroup="TextBoxes"  runat="server"/>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator7" runat="server" ControlToValidate="custom4" ValidationGroup="TextBoxes" ErrorMessage="Cannot be blank"></asp:RequiredFieldValidator>
    </p>
    <p>
        <label>Version</label>
        <asp:TextBox id="custom5" ValidationGroup="TextBoxes" runat="server"/>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator8" runat="server" ControlToValidate="custom5" ValidationGroup="TextBoxes" ErrorMessage="Cannot be blank"></asp:RequiredFieldValidator>
    </p>
    <p>
        <label>Other</label>
        <asp:TextBox id="custom6" ValidationGroup="TextBoxes" runat="server"/>
        <asp:RequiredFieldValidator ID="RequiredFieldValidator9" runat="server" ControlToValidate="custom6" ValidationGroup="TextBoxes" ErrorMessage="Cannot be blank"></asp:RequiredFieldValidator>
    </p>
    <asp:Button id="saveThinClient" OnClientClick="SaveThinClient()" runat="server" text="Submit" ValidationGroup="TextBoxes"  />
</form>

function SaveThinClient() {

    $(function() {

        $.ajax({
            type: 'POST',
            url: 'api/ThinClient',
            contentType: "application/json",
            dataType: "json",
            data: JSON.stringify({
                HostName: $('#assetTag').val(),
                MediaAccessController:  $('#macAddress').val(),
                SerialNumber:  $('#serial').val(),
                TimeZone: $('#cbTimeZone').val(),
                Custom1: $('#custom1').val(),
                Custom2: $('#custom2').val(),
                Custom3: $('#custom3').val(),
                Custom4: $('#custom4').val(),
                Custom5: $('#custom5').val(),
                Custom6: $('#custom6').val()
            }),
            success: function(data) {

                $('#assetTag').val('');
                $('#macAddress').val('');
                $('#serial').val('');
                $('#custom1').val('');
                $('#custom2').val('');
                $('#custom3').val('');
                $('#custom4').val('');
                $('#custom5').val('');
                $('#custom6').val('');
                alert('Entry recorded ' + data);
            },
        });
    });

}

编辑：包括api / ThinClient

 public bool Post([FromBody] ThinClient myThinClient)
    {
        //Create http response
        var response = new HttpResponseMessage();
        //return fail on bad data
        if (!response.IsSuccessStatusCode) return response.StatusCode == HttpStatusCode.BadRequest;
        //create parameters
        var parameters = GetParameters();
        parameters.Add("p_hostname", myThinClient.HostName);
        parameters.Add("p_mac", myThinClient.MediaAccessController);
        parameters.Add("p_serial", myThinClient.SerialNumber);
        parameters.Add("p_timezone", myThinClient.TimeZone);
        parameters.Add("p_custom1", myThinClient.Custom1);
        parameters.Add("p_custom2", myThinClient.Custom2);
        parameters.Add("p_custom3", myThinClient.Custom3);
        parameters.Add("p_custom4", myThinClient.Custom4);
        parameters.Add("p_custom5", myThinClient.Custom5);
        parameters.Add("p_custom6", myThinClient.Custom6);

        //insert new thin client

        StoredProcedures.DoInsert("spInsertThinClient", parameters);
        //return OK
        return response.StatusCode == HttpStatusCode.OK;
    }