Partialviewresult使用ajax解决问题

时间:2014-09-19 23:15:42

标签: asp.net-mvc asp.net-ajax

CONTROLER:

 public PartialViewResult Create_Folder_Complete(string Folder_Name, string Parent_Folder)
    {
        //create folder on the server
        Create_Folder(Folder_Name, Parent_Folder);
        //Create the folder on DropBox
        CreateFolder_DropBox(Get_Folder_Full_Path(Parent_Folder, Folder_Name));
        return PartialView("_Folders_Structure", GetFolderStructure());


    }

PartialView:

    <div id="displayme">
    <div id="CurrentSelection" style="margin-top:2em; text-align:left; color:orange"> &nbsp;</div>
    <div class="panel panel-info">
        <div class="panel-heading"> <b>File management system</b></div>
        <div class="panel-body">
            <div id="jstree_demo_div"></div>
        </div>
    </div>
    <script>
        var $i = jQuery.noConflict();
    </script>


    <script>


        $i('#jstree_demo_div').jstree(@Html.Raw(@ViewBag.folders));

        $i('#jstree_demo_div')
      .on('changed.jstree', function (e, data) {
          var i, j, r = [];
          for (i = 0, j = data.selected.length; i < j; i++) {
              r.push(data.instance.get_node(data.selected[i]).text);
          }
          $('#CurrentSelection').html('Selected item: ' + r.join(', '));


          var result = $i('#jstree_demo_div').jstree(true).get_selected();

          $('#Parent_Folder').val(result);
          $('#Parent_Folder2').val(result);



      })
    </script>

    <div id="progress">
        <img src="~/Content/images/ajax-loader.gif" />
    </div>
</div>

查看:

 @model  AKCPA.Data.Models.FolderModel
@{
    ViewBag.Title = "Folder Index";
    var folders = ViewBag.folders;
    Layout = "~/Views/Shared/_ScheduleSystemLayoutPage.cshtml";
}

<h2>File management system</h2>

<link rel="stylesheet" href="../Scripts/JSTree/dist/themes/default/style.min.css" />
<script src="../Scripts/JSTree/dist/libs/jquery.js"></script>
<script src="../Scripts/JSTree/dist/jstree.min.js"></script>



        @using (Html.BeginForm("Upload", "File", FormMethod.Post, new { enctype = "multipart/form-data" }))
        {

            @Html.Hidden("Parent_Folder2")
                <div class="row">
                    <div class="col-sm-3">
                        <div class="input-group">
                            <input type="file" id="fileUpload" data-val="true" data-val-required="please select a file" name="fileUpload" size="23" />
                            @Html.ValidationMessage("fileUpload")    
                            @*@Html.JQueryUI().Button("Upload a file")*@


                        </div><!-- /input-group -->
                    </div><!-- /.col-sm-6 -->
                    <div class="col-sm-9">
                        <div class="input-group">

                            @*@Html.JQueryUI().Button("Upload a file")*@
                            <button class="btn btn-info" type="submit">Upload file</button>

                        </div><!-- /input-group -->
                    </div><!-- /.col-sm-6 -->
                </div>

        }

    @using (Ajax.BeginForm("Create_Folder_Complete", "Folder",
    new AjaxOptions
    {
        HttpMethod = "GET",
        InsertionMode = InsertionMode.Replace,
        UpdateTargetId = "displayme",
        LoadingElementId = "progress"
    }
    ))
    {

        @Html.Hidden("Parent_Folder")

        <div class="row">
            <div class="col-sm-12">
                <div class="input-group">
                    <span class="input-group-btn">
                        <button class="btn btn-default" type="submit">Create a new folder</button>
                    </span>

                    <input type="text" id="Folder_Name" data-val="true" data-val-required="please enter a folder name" name="Folder_Name" size="23" class="form-control" />
                    @Html.ValidationMessage("Folder_Name", "Folder Name is Mandatory Field!")

                </div>

            </div><!-- /input-group -->
        </div><!-- /.col-sm-6 -->
        //</div>

    }
<div id="displayme">
    @Html.Partial("_folders_Structure")
</div>

我提交后调用Create_Folder_Complete而不是更改div&#34; displayme&#34;我只是这个结果(见截图)。 enter image description here

但是当我在第一次调用索引页面时加载页面时,它会正确显示所有内容: enter image description here

1 个答案:

答案 0 :(得分:0)

问题是缺少Javascript源文件。 Query.Ajax.Unobtrusive

我使用Install-Package jQuery.Ajax.Unobtrusive

将它添加到我的应用程序中

https://www.nuget.org/packages/jQuery.Ajax.Unobtrusive/