jquery - 部分 View 中的部分 View 未发布

标签 jquery asp.net-mvc-3 razor

我对整个 MVC 的做事方式还比较陌生,所以请耐心等待。

我目前正在开发一个现有的 MVC 网站,根据需要向其添加管理功能。有一个主要的管理 View 。所有其他 CRUD 操作均由加载到单个管理 View 中的部分 View 处理。到目前为止,我在添加所有这些部分 View 时没有遇到任何问题。现在有两个表:Email_Queue 和 Smtp_Server。业务规则规定您必须拥有 Smtp_Server 记录才能创建 Email_Queue 记录。

因此,为了让用户更方便,我可以选择在“创建 Email_Queue”部分 View 中创建 Smtp_Server。我可以让 Smtp_Server 创建部分 View 在模态弹出窗口中打开...我可以触发其所有验证(在模型中设置)...我可以获取取消按钮来关闭模态弹出窗口。但是,我似乎无法让 Smtp_Server 部分 View 上的提交按钮进行发布。

所有这一切的最终目标是最终将其发布,然后使用我刚刚添加的新 Smtp_server 更新 Email_Queue 部分 View 中的下拉列表。现在,我很高兴 Smtp_Server 只保存我输入的内容。

所以,这是一些代码。首先,Email_Queue 部分 View (我删除了额外的字段以使其更短):

@model Models.Email_QueueModel

<div class="main_column_leftfull">
<!--=========Graph Box=========-->
<div class="box expose">
    <!-- A box with class of expose will call expose plugin automatically -->
    <div class="header">
        Create E-Mail Queue
    </div>
    <div class="body">
        <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
        <script type="text/javascript">

            function CancelAddSmtpServer() {
                var windowElement = $('#QueueCreate');
                windowElement.hide();
            }

            $(document).ready(function() {

            var windowElement = $('#QueueCreate');
            var undoButton = $('#opener-popup');
            undoButton
                .bind('click', function(e) {
                    windowElement.data('tWindow').open();
                    undoButton.hide();})
                .toggle(!windowElement.is(':visible'));
                    windowElement.bind('close', function() {
                    undoButton.show();

                });
            });

            function CloseWindow() {
                var windowElement = $('#QueueCreate').data('tWindow');
                windowElement.close();
            }

        </script>
        @using (Ajax.BeginForm("_Create", new AjaxOptions() { UpdateTargetId = "subForm", HttpMethod = "Post" }))
        {
            <fieldset>
                @Form.HiddenID("DepartmentId")
                <div class="editor-label">
                    @Html.LabelFor(model => model.QueueName)
                    @Html.EditorFor(model => model.QueueName, new { @class = "textfield" })
                    @Html.ValidationMessageFor(model => model.QueueName)
                </div>

                <div class="editor-label">
                    @Html.LabelFor(model => model.EmailServerConfig)
                    @Html.DropDownList("EmailServerConfig", "Select E-Mail Server Configuration...")
                    @Html.ValidationMessageFor(model => model.EmailServerConfig)
                </div>

                <div id="opener-popup" class="editor-label" style="cursor:pointer;">
                    Add SMTP Server
                </div>

                <div id="popup_content" title="Popup Title" style="display:none;">
                    @Html.Partial("../Email_SmtpServer/_QueueCreate")
                </div>

                @(Html.Telerik().Window()
                    .Name("QueueCreate")
                    .Modal(true)
                    .Title("Add SMTP Server")
                    .Scrollable(false)
                    .Draggable(true)
                    .Resizable()
                    .Visible(false)
                    .Content
                    (
                        @<text>
                            @Html.Partial("../Email_SmtpServer/_QueueCreate", new DATEL.MM.Models.Email_SmtpServerModel())
                        </text>
                    )
                )

                <br />
                <p>
                    @Form.Submit(value: "Create E-Mail Queue")
                   <input id="btnCancelEmail_QueueCreate" type="button" value="Cancel" class="button" />
                </p>
            </fieldset>
        }
        <div>
            @Html.ActionLink("Back to List", "Index")
        </div>
    </div>
</div>

接下来,我为模式弹出窗口创建的部分 View :

@model Models.Email_SmtpServerModel

<div class="main_column_leftfull">
<!--=========Graph Box=========-->
<div class="box expose">
    <!-- A box with class of expose will call expose plugin automatically -->
    <div class="header">
        Create SMTP Server
    </div>
    <div class="body">
        <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
        <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>


        @using (Ajax.BeginForm("_QueueCreate", new AjaxOptions() { UpdateTargetId = "subForm", HttpMethod = "Post" }))
        {
            <fieldset>
                @Form.HiddenID("SMTPServerId")
                <div class="editor-label">
                    @Html.LabelFor(model => model.ServerName)
                    @Html.EditorFor(model => model.ServerName, new { @class = "textfield" })
                    @Html.ValidationMessageFor(model => model.ServerName)
                </div>

                <div class="editor-label">
                    @Html.LabelFor(model => model.ServerDesc)
                    @Html.EditorFor(model => model.ServerDesc, new { @class = "textfield" })
                    @Html.ValidationMessageFor(model => model.ServerDesc)
                </div>

                <br />
                <p>
                    @Form.Submit(value: "Create SMTP Server")

                    <input id="btnCancelEmail_SmtpServerQueueCreate" type="button" value="Cancel" class="button" onclick="CloseWindow();" />
                </p>
            </fieldset>
        }
    </div>
</div>

最后,这是我的 _QueueCreate Controller 代码:

[HttpPost]
    public virtual PartialViewResult _QueueCreate(Email_SmtpServerModel model, FormCollection fc)
    {
        ViewBag.HasError = "none";
        try
        {
            string errorMessage = "";
            BusinessLogic.Email_SmtpServer dbESS = new BusinessLogic.Email_SmtpServer(AppManager.GetUser(User.Identity.Name).ConnectionString);
            model.SMTPServerId = System.Guid.NewGuid();
            model.CreatedDateGMT = DateTime.Now;
            model.CreatedUserId = AppManager.GetUser(User.Identity.Name).UserId;

            if (dbESS.Insert(model, out errorMessage))
            {
                ModelState.AddModelError("", errorMessage);
            }
            else
            {
                ViewBag.HasError = "none";
                return PartialView("../Email_Queue/_Create");
            }
        }
        catch
        {
            ViewBag.HasError = "true";
            return PartialView("../Email_Queue/_Create");
        }
        return PartialView(model);
    }

如果我需要发布更多代码,请告诉我。

TL;DR 版本:好吧,看标题即可。

最佳答案

你能不能强制提交按钮在点击时提交

<input type="submit" name="btnSubmit" value="Submit Form" onclick="this.form.submit()" />

或者实际上只是使用 jQuery 来查找 onclick,然后使用 ajax 进行发布

$('input[name="btnSubmit"').click(function() {
//you will need to get form variables

$.ajax({
type:"POST",
data: { id = var1, parameter = var2 }
datatype: "json",
success: function (data){
//whatever needs done
},
error: function(){
alert("error");
}

});

MVC Controller

public jsonresult somename(string id, string parameter)
{ 
return Json("SUCCESS");
}

public jsonresult somename(FormCollection fc)
{
strind id = fc["id"];
string parameter = fc["parameter"];
return Json("SUCCESS");
}

关于jquery - 部分 View 中的部分 View 未发布,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8228231/

相关文章:

jquery - 从 AJAX 调用返回 render_to_response

c# - 我如何覆盖 Url.Action

.net - 为什么我的 web 项目找不到我的 elmah.axd 文件

javascript - 无法读取属性 "match"(nestedSortable)

php - 使用 jquery 和 php 处理目录中的文件 - 获取状态并更新进度条

jquery - asp.net MVC 3 分页哪个最好用

c# - 显示进度条,直到 Webgrid 完全加载并分页到 MVC 中 Webgrid 中的下一页或上一页

c# - 将带有 & 符号的参数传递给 Controller ​​操作方法

c# - Controller 后操作不接收模型

javascript - 使用javascript取消选择文本框的内容