使用选项卡提交后刷新页面

时间:2014-10-27 13:17:28

标签: c# entity-framework asp.net-mvc-4 visual-studio-2013

我希望在保存后刷新页面。我正在使用标签,如下所示:

   <div id="tabs-2">

        @using (Html.BeginForm("EditPhotos", "Account", FormMethod.Post, new { id = "form", enctype = "multipart/form-data" }))
        {
            @Html.AntiForgeryToken()

            <div class="form-horizontal">
                <h4>Photos</h4>
                <hr />

                @Html.HiddenFor(model => model.Id)


                <div class="editor-label">
                    @Html.LabelFor(model => model.DisplayItem)
                </div>
                <div class="editor-field">
                    @Html.EditorFor(model => model.DisplayItem)

                </div>

                <div id="upload-choices">
                    <div class="editor-label">
                        @Html.LabelFor(m => m.Image)

                        @Html.ValidationMessageFor(model => model.Image)
                    </div>
                    <div class="editor-row">
                        @Html.ValidationSummary(true)
                    </div>
                </div>

                <br />

                <div class="table-responsive">
                    <table class="table">

                        <tr>
                            <th><img width="200" height="150" src="@Url.Action("GetImage", "Account", new { id =  Model.Id })"></th>


                        </tr>
                    </table>
                </div>

                <input type="file" name="file" class="filestyle" data-buttontext="Find file">



                <br />
                <div class="progress progress-striped">
                    <div class="progress-bar progress-bar-success">0%</div>
                </div>

                <div id="status"></div>


                <br />

                @*@Html.ActionLink("Upload photos", "Upload")*@
                <div class="pull-left">
                    <div class="col-md-offset-0">
                        <input type="submit" value="Save"  accept="image/x-png, image/gif, image/jpeg" class="btn btn-default pull-left" />

                    </div>
                </div>

            </div>
        }

        <br /><br />
        <div>
            @Html.ActionLink("Back to List", "Index")
        </div>
    </div>

这是JQuery:

$("form").ajaxForm({



                    beforeSend: function () {

                        status.empty();
                        var percentVal = '0%';
                        bar.width(percentVal)
                        percent.html(percentVal);
                    },
                    uploadProgress: function (event, position, total, percentComplete) {
                        var percentVal = percentComplete + '%';
                        bar.width(percentVal)
                        percent.html(percentVal);
                    },
                    success: function () {
                        var percentVal = '100%';
                        bar.width(percentVal)
                        percent.html(percentVal);
                    },
                    complete: function (xhr) {
                        status.html(xhr.responseText);
                    }
               // });
            });

这是我的控制器操作方法:

[HttpPost]
        //[ValidateAntiForgeryToken]
        public ActionResult EditPhotos(UserProfile userprofile, HttpPostedFileBase file)
        {

            if (file != null)
            {


                // extract only the fielname
                var fileName = Path.GetFileName(file.FileName);
                // store the file inside ~/App_Data/uploads folder
                var path = Path.Combine(Server.MapPath("~/App_Data/uploads"), fileName);
                file.SaveAs(path);
                ModelState.Clear();
            }

            if (ModelState.IsValid)
            {
                string username = User.Identity.Name;
                // Get the userprofile
                UserProfile user = db.userProfiles.FirstOrDefault(u => u.UserName.Equals(username));

                // Update fields
                user.Image = new byte[file.ContentLength];
                file.InputStream.Read(user.Image, 0, file.ContentLength);
                user.ImageMimeType = file.ContentType;

                db.Entry(user).State = EntityState.Modified;

                db.SaveChanges();

              //  return Redirect(Url.Action("Edit", "Account")+ "#tabs-2");

            }

            return RedirectToAction(Url.Action("Edit", "Account") + "#tabs-2");


        }

但上传(保存)后我收到此错误:

Server Error in '/' Application.

The resource cannot be found.

Description: HTTP 404. The resource you are looking for (or one of its dependencies) could have been removed, had its name changed, or is temporarily unavailable.  Please review the following URL and make sure that it is spelled correctly. 

Requested URL: /Account/Account/Edit#tabs-2

那么如何使用标签改进RedirectAction?

谢谢

好吧,我现在就这样:

    $("#tabs").tabs();
    //    $(document).on("click", ".btn", function () {
    $("#tabs").tabs("select", window.location.hash);
    window.location.hash;
   // $("#tab-2").show();

但刷新后,它会跳转到第一个标签而不是标签-2(所以当前标签)

像这样:

    $("#tabs").tabs();
    //    $(document).on("click", ".btn", function () {
    $("#tabs").tabs("select", window.location.hash);
    window.location.hash;
    $("a[href=tabs-2]").trigger("click");
哦,我试过这样:

$(&#34;#突片&#34)。翼片(         {

        select: function(event, ui) {
            document.getElementById("tabs-2").value = ui.index;
        },
        selected: document.getElementById("tabs-2").value
    });

但仍然转到第一个标签

1 个答案:

答案 0 :(得分:0)

尝试指定如下,

return RedirectToAction(Url.Action("Edit", "Account") + "#/tabs-2");

即使您正常工作,也不确定是否会选择该标签。由于仅根据查询字符串上没有的事件选择选项卡。因此,最好创建一个新的查询字符串作为&#39; tab&#39;或者&#39;活跃的&#39;或者您喜欢并传递活动标签的值。

    return RedirectToAction("Edit", routeValues: new { controller = "Account", activetab = "tabs-2" });

然后使用jquery,在文档加载时,您可以通过适当的选择器自行触发选项卡的单击事件。

试试,

$("a[href='#tabs-2']").trigger("click");