使用ajax提交cshtml表单

本文关键字：表单 cshtml 提交 ajax 使用 | 更新日期: 2023-09-27 18:12:28

@{
var db = Database.Open("CMS");
//retrieving the username of the user from the session
var session_username = Session["session_username"];
//get the details of the user from the database
var getuserdetailscommand = "SELECT * from student where student_username = @0";
var getuserdetailsdata = db.Query(getuserdetailscommand, session_username);
var statusfirstname = "";
var statuslastname = "";
var statusavatar = "";
foreach(var row in getuserdetailsdata){
    statusfirstname = row.student_firstname;
    statuslastname = row.student_lastname;
    statusavatar = row.student_avatar;
}
//on submit execute the following queries
if(IsPost){
    if(Request["button"] == "sharestatus"){
        //retrieve the data from the form input fields
        var statusbody = Request.Form["statusbody"];
        var statususername = session_username;
        //insert the status for the username into the database
        var insertcommand = "INSERT into status(status_body, status_date, status_username, status_firstname, status_lastname, status_avatar) VALUES (@0, @1, @2, @3, @4, @5)";
        db.Execute(insertcommand, statusbody, DateTime.Now, session_username, statusfirstname, statuslastname, statusavatar);
    }
}
}
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
        function get() {
        $.post('statusupdateform.cshtml', { name: form.name.value }
    }
</script>
                                        <form class="status-form" role="form" action="" enctype="multipart/form-data" method="post" name="form">
                                            <div class="form-body">
                                                <div class="form-group">
                                                    <textarea class="form-control" placeholder="What's on your mind?" name="statusbody"></textarea>
                                                </div>
                                            </div>
                                            <div class="form-footer">
                                                <div class="pull-right actions">
                                                    <button class="btn btn-primary" name="button" value="sharestatus" onclick="event.preventDefault();get();return false;">Share</button>
                                                </div>
                                            </div>
                                        </form>

这是我的cshtml文件中的代码。我想使用ajax提交表单，这样就不会在每次用户提交任何内容时刷新整个页面。

代码中还提供了运行表单所需的c#代码。

我如何使用ajax提交的任何帮助?

谢谢!

使用ajax提交cshtml表单

使用Javascript或JQuery。例如，添加script标签链接到jquery代码文件，然后使用$。Get或$。

你应该删除

method="post"

从表单，因为这将使整个页面提交。你也可以在Jquery文档中找到更多关于如何做到这一点的信息。

查看链接底部的示例:

http://api.jquery.com/jquery.post/

使用这个来执行您的操作

            $.ajax
                ({
                    url: " URL",
                    data: "{ 'name' : 'DATA'}",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",                   
                    async: true,
                    dataFilter: function (data) { return data; },
                    success: function (data) 
                    {
                        alert(data);
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert("error");
                    }
                });
相关文章：