Question

我只是ASP.NET的初学者。现在我有2个页面：主页和子页面（内容页面）。在子页面上，我创建了一个html表单，用于将用户的输入提交给服务器。我使用asp按钮提交这些，但它只是通过运行我的javascript来验证用户的输入。底部的标签用于检查它是否回发。单击提交按钮后，即使页面刷新，也会显示“False”。我不知道我在这里做错了什么。另外，我希望在将用户提交到服务器后在文本框中显示用户的所有信息。希望你能帮我解释清楚。非常感谢你。

1 /母版页：

2 /子页面（内容页面）：

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder" Runat="Server">
<div class="row">
        <div class="box">
            <div class="col-lg-12">
                <hr>
                <h2 class="intro-text text-center">Contact <strong>Mon Ami Cafe Restaurant</strong>
                </h2>
                <hr>
            </div>
            <div class="col-md-8" id="map-canvas">
                <!-- Embedded Google Map using an iframe - to select your location find it on Google maps and paste the link as the iframe src. If you want to use the Google Maps API instead then have at it! -->
                <!--iframe width="100%" height="400px" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=14291+S+Euclid+St,+Garden+Grove,+CA+92843&amp;aq=&amp;sll=33.754949,-117.938489&amp;sspn=0.010437,0.021136&amp;ie=UTF8&amp;hq=&amp;hnear=14291+S+Euclid+St,+Garden+Grove,+California+92843&amp;t=m&amp;z=14&amp;ll=33.754949,-117.938489&amp;output=embed"></!--iframe><br /><small><a href="https://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=14291+S+Euclid+St,+Garden+Grove,+CA+92843&amp;aq=&amp;sll=33.754949,-117.938489&amp;sspn=0.010437,0.021136&amp;ie=UTF8&amp;hq=&amp;hnear=14291+S+Euclid+St,+Garden+Grove,+California+92843&amp;t=m&amp;z=14&amp;ll=33.754949,-117.938489" style="color:#0000FF;text-align:left">View Larger Map</a></small-->
            </div>

            <div class="col-md-4">
                <h5>Phone:</h5>
                <p><strong>*******</strong>
                </p>
                <h5>Email:</h5>
                <p><strong>*******</strong>
                </p>
                <h5>Address:</h5>
                <p><strong>*******</strong>
                </p>
            </div>
            <div class="clearfix"></div>
        </div>
    </div>

    <div class="row">
        <div class="box">
            <div class="col-lg-12">
                <hr>
                <h2 class="intro-text text-center">Contact
                </h2>
                <hr>

                <form name="ContactForm"  method="post">
                    <div class="row" id="ContactForm">
                        <div class="form-group col-lg-4">
                            <label>Name</label>
                            <input type="text" id="NAME" class="form-control">

                        </div>
                        <div class="form-group col-lg-4">
                            <label>Email Address</label>
                            <input type="text" id="EMAIL" class="form-control">

                        </div>
                        <div class="form-group col-lg-4">
                            <label>Phone Number</label>
                            <input type="text" id="PHONE" class="form-control">

                        </div>
                        <div class="clearfix"></div>
                        <div class="form-group col-lg-12">
                            <label>Message</label>
                            <textarea id="MSG" class="form-control" rows="6"></textarea>

                        </div>
                        <div class="form-group col-lg-12">
                            <input type="hidden" name="save" value="contact">
                            <asp:Button ID="btnSubmit" runat="server" OnClientClick="return validateForm();" Text="Submit"/>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>

    <!--The output information will be here -->
    <p><asp:Label id="lbl1" runat="server" /></p>
</asp:Content>

这是我的脚本@Chia ...：

<script>
    function validateName() {
        var x = document.getElementById("NAME").value;
        if (x == null || x == "") {
            alert("Name must be filled out");
            return false;
        }
        else
            return true;
    }

    function validateEmail() {
        var y = document.getElementById("EMAIL").value;
        var atpos = y.indexOf("@");
        var dotpos = y.lastIndexOf(".");
        if (atpos < 1 || dotpos < atpos + 2 || dotpos + 2 >= y.length) {
            alert("Not a valid e-mail address");
            return false;
        }
        else
            return true;
    }

    function validatePhone() {
        var formatForm = /^[1-9]\d{9}$/;
        var z = document.getElementById("PHONE").value;
        if (z.length == 0) {
            alert("Phone must be filled out");
            return false;
        }
        else if (z.length < 10 || z.length > 10 || !(z.match(formatForm))) {
            alert("Not a valid phone number");
            return false;
        }
        else
            return true;
    }

    function validateMess() {
        var t = document.getElementById("MSG").value;
        if (t == null || t == "") {
            alert("Pleave leave your message");
            return false;
        }
        else
            return true;
    }

    function validateForm() {
        if (validateName()) {
            if (validateEmail()) {
                if (validatePhone()) {
                    if (validateMess()) {
                        //alert("Submitted Sucessfully");
                        return true;
                    }
                }
            }
        }
        return false;
    }
 </script>

Answer 1

您需要在asp按钮中添加一个onclick属性，该属性在类后面的代码中调用一个事件。例如

<asp:Button ID="btnSubmit" runat="server" OnClientClick="return validateForm();" OnClick="btnSubmit_Click" Text="Submit"/>

哪会触发事件

protected void btnSubmit_Click(object sender, System.EventArgs e)
{
   // Do stuff here after postback
}

因为您已连接onclientclick属性并且ValidateForm返回bool值，所以如果validateForm函数返回true，这将正确地仅允许onclick事件触发。

ASP.NET POSTBACK在contentplaceholder中不起作用

1 个答案: