javascript - 我正在尝试将数据存储在 sql server 中，但我遇到了一个我不知道如何修复的错误

Question

我正在尝试将用户名、电子邮件和他们的消息存储在我的联系页面上。当我运行我的网站并进入联系页面并在联系表单中输入所有详细信息并单击发送按钮(发送按钮称为 submitBtn)时，我收到错误消息，您可以在下面的图片中看到。

错误信息:

c# 代码:此 c# 代码用于发送按钮。

protected void submitBtn_Click(object sender, EventArgs e)
    {
        try
        {
            //Create the conection string and open the conn
            SqlConnection conne = new SqlConnection(ConfigurationManager.ConnectionStrings["Fasthosts_MMConnectionString"].ConnectionString);
            //Open the connection string
            conne.Open();

            //Get all the values from the text boxes etc and pass them over to the DB
            string insertQuery = "insert into Contact(UserName, Email, Message) " +
                "values(@UserName, @Email, @Message)";
            SqlCommand com = new SqlCommand(insertQuery, conne);

            //Get values from the controls such as the text boxes and pass them over to the DB
            com.Parameters.AddWithValue("@UserName", tbUserName.Text);
            com.Parameters.AddWithValue("@Message", userMessage.Text);
            com.Parameters.AddWithValue("@Email", userEmail.Text);

            //This actually executes the query with the given values above.
            com.ExecuteNonQuery();

            //Dispose the connection string once the data has been passed over the DB
            conne.Close();

        }
        catch (Exception problem)
        {
            //throw Exception ;
            Response.Write("Error Message: " + problem.ToString());
            throw;

        }
    }

html代码:

 <div id="contactForm" class="contactForm">
    <div id="formHeader" class="formHeader">
        <h1 id="message">Contact Us :)</h1>
    </div>
    <div id="formBody" class="formBody">
        <form action="homepage.aspx" method="POST" name="contactForm">
            <div class="inputContainer">
                <label for="userName">
                    <i class="fa fa-lg fa-fw fa-user"></i>
                </label>
                <asp:TextBox ID="tbUserName" placeholder="John Smith" runat="server"></asp:TextBox>
                <!--<input name="name" id="userName" type="text" placeholder="John Smith">-->
            </div>
            <div class="inputContainer">
                <label for="userEmail">
                    <i class="fa fa-lg fa-fw fa-envelope"></i>
                </label>                
                <asp:TextBox ID="userEmail" placeholder="jsmith@domain.com" runat="server"></asp:TextBox>
            </div>
            <div class="inputContainer">                
                <asp:TextBox ID="userMessage" rows="10" placeholder="Enter your message" runat="server" Height="100px"></asp:TextBox>
            </div>
            <!--<input id="submitBtn1" class="submitBtn" type="submit" value="Send">-->
            <asp:Button ID="submitBtn" Class="submitBtn" runat="server" Text="Send" OnClick="submitBtn_Click" />
        </form>
    </div>

JavaScript 代码:

(function () {
    "use strict";
    var //GLOBAL VARIABLES
        input,
        container,
        //CSS CLASSES
        classSuccess = "success",
        classError = "error",
        //FORM VALIDATOR
        formValidator = {
            init: function () {
                this.cacheDom();
                this.bindEvents();
            },
            cacheDom: function () {
                //MAIN PARENT ELEMENT
                this.contactForm = document.getElementById("contactForm");
                //MAIN FORM ELEMENTS
                this.formHeader = document.querySelector("#formHeader h1");
                this.formBody = document.getElementById("formBody");
                this.inputContainer = document.getElementsByClassName("inputContainer");
                //USER INPUT ELEMENTS
                //INPUT FIELDS
                this.fields = {
                    userName: document.getElementById("userName"),
                    userEmail: document.getElementById("userEmail"),
                    userMessage: document.getElementById("userMessage")
                };
                this.submitBtn = document.getElementById("submitBtn");
            },
            bindEvents: function () {
                var i;
                //RUN RULES ON SUBMIT BUTTON CLICK
                this.submitBtn.onclick = this.runRules.bind(this);
                //BIND EVENTS TO EACH INPUT FIELD
                for (i in this.fields) {
                    if (this.fields.hasOwnProperty(i)) {
                        //VARIABLES
                        input = this.fields[i];
                        container = input.parentElement;
                        //RUN RULES WHEN INPUT HAS FOCUS
                        input.onfocus = this.runRules.bind(this);
                        //RESET ERRORS WHEN CONTAINER IS CLICKED
                        container.onclick = this.resetErrors.bind(this, input);
                    }
                }
            },
            runRules: function (evnt) {
                var target = evnt.target,
                    type = evnt.type;
                //IF EVENT ON SUBMIT BUTTON
                if (target === this.submitBtn) {
                    //PREVENT FORM SUBMITTION
                    this.preventDefault(evnt);
                    //IF INPUT HAS FOCUS
                } else if (type === "focus") {
                    //RESET CLASSLIST
                    this.resetClassList(target.parentElement);
                    //RESET ERRORS
                    this.resetErrors(target);
                    return false;
                }
                //RESET CLASSLIST
                this.resetClassList();
                //CHECK FIELDS
                this.checkFields();
            },
            preventDefault: function (evnt) {
                //PREVENT DEFUALT
                evnt.preventDefault();
            },
            checkFields: function () {
                var i,
                    validCount = 0,
                    //EMAIL FILTER
                    filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
                //CYLCE THROUGH INPUTS
                for (i in this.fields) {
                    if (this.fields.hasOwnProperty(i)) {
                        input = this.fields[i];
                        //CHECK IF FIELD IS EMPTY
                        if (input.value === "") {
                            //ADD ERROR CLASS
                            this.addClass(input, classError);
                            //CHECK IF EMAIL IS VALID
                        } else if (i === "userEmail" && !filter.test(input.value)) {
                            //ADD ERROR CLASS
                            this.addClass(input, classError);
                        } else {
                            //FIELD IS VALID
                            this.addClass(input, classSuccess);
                            validCount += 1;
                        }
                    }
                }
                //IF ALL FEILDS ARE VALID
                if (validCount === 3) {
                    //SUBMIT FORM
                    this.submitForm();
                }
            },
            addClass: function (input, clss) {
                container = input.parentElement;
                //IF INPUT HAS ERROR
                if (clss === classError) {
                    //SHOW ERROR MESSAGE
                    this.errorMessage(input);
                }
                //ADD CLASS
                input.parentElement.classList.add(clss);
            },
            errorMessage: function (input) {
                var message;
                //IF USERNAME HAS ERROR
                if (input === this.fields.userName) {
                    message = "Please enter your name";
                    //ELSE IF USEREMAIL HAS ERROR
                } else if (input === this.fields.userEmail) {
                    message = "Please enter a valid email";
                    //ELSE IF USERMESSAGE HAS ERROR
                } else if (input === this.fields.userMessage) {
                    message = "Please enter your feedback";
                }
                this.renderError(input, message);
            },
            renderError: function (input, message) {
                var html;
                //GET INPUT CONTAINER
                container = input.parentElement;
                //RENDER HTML
                html = document.createElement("div");
                html.setAttribute("class", "message");
                html.innerHTML = message;
                //IF MESSAGE ELEMENT DOESN'T EXIST
                if (!container.getElementsByClassName("message")[0]) {
                    //INSERT MESSAGE TO INPUT CONTAINER
                    container.insertBefore(html, container.firstElementChild);
                }
            },
            resetClassList: function (input) {
                var i;
                //IF TARGETING SPECIFIC INPUT
                if (input) {
                    //GET INPUT CONTAINER
                    container = input.parentElement;
                    //REMOVE CLASSES
                    container.classList.remove(classError, classSuccess);
                    //FOCUS ON INPUT FIELD
                    input.focus();
                } else {
                    for (i in this.fields) {
                        if (this.fields.hasOwnProperty(i)) {
                            //REMOVE CLASSES FROM ALL FIELDS
                            this.fields[i].parentElement.classList.remove(classError, classSuccess);
                        }
                    }
                }
            },
            resetErrors: function (input) {
                //GET INPUT CONTAINER
                container = input.parentElement;
                //IF CONTAINER CONTAINS ERROR
                if (container.classList.contains(classError)) {
                    //RESET CLASSES
                    this.resetClassList(input);
                }
            },
            submitForm: function () {
                var waitForAnimation;
                //ADD SUCCESS CLASS
                this.contactForm.classList.add(classSuccess);
                //WAIT FOR ANIMATION TO FINISH
                this.changeHeader("Sent Succesfully");
                //WAIT FOR ANIMATION TO FINISH
                setTimeout(
                    this.changeHeader.bind(this, "Thank you for your feedback"),
                    1200
                );
            },
            changeHeader: function (text) {
                //CHANGE HEADER TEXT
                this.formHeader.innerHTML = text;
            }
        };
    //INITIATE FORM VALIDATOR
    formValidator.init();
})();

Answer 1

把这个写在源代码中页面指令的第一行

<%@ Page EnableEventValidation="false" %>