2015-08-24 4 views
4

Я пытаюсь найти лучший метод (любой на данный момент), в котором будет сохраняться позиция прокрутки страницы при удалении элемента из списка с помощью beginCollectionItem.BeginCollectionItem Ведение позиции страницы MVC 5

Первоначально я думал, что это связано с моим другим кодом javascript/jQuery в моем основном проекте (это все еще может быть фактором), но когда я воссоздал ситуацию в новом проекте только с использованием кода BCI (индекс, две частичные , контроллер и модель), при удалении элемента из одного из списков страница снова вернется к вершине, мне действительно нужно (нужно) остановить это, как я могу это достичь?

Я видел this вопрос и главный ответ, который я не знаю, как правильно реализовать или даже если он по-прежнему действует, второй ответ, используя приведенные ниже JS я испытал в моих _Layout, в budles который Ждут» t исправить проблему.

JQuery тест

$(document).scroll(function() { 
    localStorage['page'] = document.URL; 
    localStorage['scrollTop'] = $(document).scrollTop(); 
}); 
$(document).ready(function() { 
    if (localStorage['page'] == document.URL) { 
     $(document).scrollTop(localStorage['scrollTop']); 
    } 
}); 

Студент Частичное

@model UsefulCode.Models.Person 
<div class="editorRow"> 
    @using (Html.BeginCollectionItem("students")) 
    { 
     <div class="ui-grid-c ui-responsive"> 
      <div class="ui-block-a"> 
       <span> 
        @Html.TextBoxFor(m => m.firstName) 
       </span> 
      </div> 
      <div class="ui-block-b"> 
       <span> 
        @Html.TextBoxFor(m => m.lastName) 
       </span> 
      </div> 
      <div class="ui-block-c"> 
       <span> 
        <span class="dltBtn"> 
         <a href="#" class="deleteRow">X</a> 
        </span> 
       </span> 
      </div> 
     </div> 
    } 
</div> 

Учитель Частичное

@model UsefulCode.Models.Person 
<div class="editorRow"> 
    @using (Html.BeginCollectionItem("teachers")) 
    { 
     <div class="ui-grid-c ui-responsive"> 
      <div class="ui-block-a"> 
       <span> 
        @Html.TextBoxFor(m => m.firstName) 
       </span> 
      </div> 
      <div class="ui-block-b"> 
       <span> 
        @Html.TextBoxFor(m => m.lastName) 
       </span> 
      </div> 
      <div class="ui-block-c"> 
       <span> 
        <span class="dltBtn"> 
         <a href="#" class="deleteRow">X</a> 
        </span> 
       </span> 
      </div> 
     </div> 
    } 
</div> 

Index

@{ 
    Layout = "~/Views/Shared/_Layout.cshtml"; 
} 
@model UsefulCode.Models.Register 
<div id="studentList"> 
@using (Html.BeginForm()) 
{ 
    <div id="editorRowsStudents"> 
     @foreach (var item in Model.students) 
     { 
      @Html.Partial("StudentView", item) 
     } 
    </div> 
    @Html.ActionLink("Add", "StudentManager", null, new { id = "addItemStudents", @class = "button" }); 
} 
</div> 

<div id="teacherList"> 
@using (Html.BeginForm()) 
{ 
    <div id="editorRowsTeachers"> 
     @foreach (var item in Model.teachers) 
     { 
      @Html.Partial("TeacherView", item) 
     } 
    </div> 
    @Html.ActionLink("Add", "TeacherManager", null, new { id = "addItemTeachers", @class = "button" }); 
} 
</div> 


@section scripts { 
    <script type="text/javascript"> 
    $(function() { 
     $('#addItemStudents').on('click', function() { 
      $.ajax({ 
       url: '@Url.Action("StudentManager")', 
        cache: false, 
        success: function (html) { $("#editorRowsStudents").append(html); } 
       }); 
       return false; 
      }); 
      $('#editorRowsStudents').on('click', '.deleteRow', function() { 
       $(this).closest('.editorRow').remove(); 
      }); 
      $('#addItemTeachers').on('click', function() { 
       $.ajax({ 
        url: '@Url.Action("TeacherManager")', 
        cache: false, 
        success: function (html) { $("#editorRowsTeachers").append(html); } 
       }); 
       return false; 
      }); 
      $('#editorRowsTeachers').on('click', '.deleteRow', function() { 
       $(this).closest('.editorRow').remove(); 
      }); 
     }); 
    </script> 
} 

ответ

1

Помимо причинения боли себе за то, как густая теперь я чувствую, что я освобожден. Добавление return false; к действию удаления разрешает это, оно присутствовало в действии add, но, глядя на него часами, я просто предположил, что он был там.

Если есть лучший ответ, включите его, так как это будет работать только в этом разделе кода.

Ниже приведен код ответа:

$('#addItemStudents').on('click', function() { 
      $.ajax({ 
       url: '@Url.Action("StudentManager")', 
        cache: false, 
        success: function (html) { $("#editorRowsStudents").append(html); } 
       }); 
       return false; 
      }); 
      $('#editorRowsStudents').on('click', '.deleteRow', function() { 
       $(this).closest('.editorRow').remove(); 
       return false; // add this 
      });