2015-05-21 1 views
1

Так что у меня этот частичный вид:Частичный вид не загружается в текущий вид

@model QueryQuestionManager.Models.Domain.Answer 
<script src="~/Scripts/DynamicList.js"></script> 

<div class="editorRow"> 
@using (Html.BeginCollectionItem("Answers")) 
{ 
    <div> 
     @Html.LabelFor(x => x.AnswerText) 
     @Html.EditorFor(x => x.AnswerText) 
    </div> 
    <a href="#" class="deleteRow">delete</a> 
} 

</div> 

Я хочу, чтобы загрузить этот частичный вид в моем главном экране, когда кто-то нажимает на ссылку:

@model QueryQuestionManager.Models.Domain.Question 

@{ 
ViewBag.Title = "Create"; 
} 

<script src="~/Scripts/DynamicList.js"></script> 

<br /> 
     @using (Html.BeginForm(new { @class = "form", role = "form" })) 
     { 

      <div class="form-group"> 
       <div class="editor-label"> 
        @Html.LabelFor(m => m.QuestionText) 
       </div> 

       <div class="form-control"> 
        @Html.TextBoxFor(m => m.QuestionText) 
        @Html.ValidationMessageFor(m => m.QuestionText) 
       </div> 

       <div class="editor-label"> 
        @Html.LabelFor(m => m.Category) 
       </div> 

       <div class="form-control"> 
        @Html.TextBoxFor(m => m.Category) 
        @Html.ValidationMessageFor(m => m.Category) 
       </div> 

       <div class="editor-label"> 
        @Html.LabelFor(m => m.Answers) 
       </div> 

       <br /> 
       <div id="editorRows"> 
        @foreach (var item in Model.Answers) 
        { 
         @Html.Partial("EditorRow", item); 
        } 
       </div> 
       @Html.ActionLink("Add another...", "BlankEditorRow",  "Question", new { id = "addItem" }) 

       <br /> 

       <input type="submit" value="Save" class="btn btn-success" /> 
      </div> 
     } 

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

Это результат действия контроллера

public ActionResult BlankEditorRow() 
{ 
    return PartialView("EditorRow", new Answer()); 
} 

А затем у меня есть файл javascript для динамического добавления и удаления параметра .

$('#addItem').click(function() { 
$.ajax({ 
    url: this.href, 
    cache: false, 
    success: function (html) { 
     $('#editorRows').append(html); 
    } 
}); 
return false; 
}); 

$('a.deleteRow').live('click', function() { 
    $(this).parents('div.editorRow:first').remove(); 
    return false; 
}); 

Но по какой-то причине мой частичный вид не загружается внутри моего текущего вида, и он открывает только частичный вид.

How it looks when I click the link

Am Я забыл?

+0

Включил ли ваш сценарий ненавязчивого аякса на ваш взгляд? Обычно, когда ваш частичный вид заканчивается на «новой странице», это означает, что запрос был успешным, но обработчик ajax отсутствовал, поэтому он просто возвращает частичный вид на новую новую страницу. EDIT: просто хотел упомянуть, что вы могли бы сузить свою проблему, используя помощник mvc Ajax.ActionLink (...), а не полагаться на правильное кодирование jQuery ajax. – Eckert

ответ

0

Я думаю, вы не хотите, чтобы ссылка на действие. Я считаю, что ваш обработчик jQuery имеет правильный подход, но ссылка на действие ссылается на ваш новый URL (Question/BlankEditorRow), и вы этого не хотите. Скорее всего вам нужно извлечь этот html и вставить его так же, как вы, но БЕЗ навигации по главной странице на этот URL.

0

Вместо ActionLink используйте привязку и скрытое поле.

<a id="addItem" href="#" /> 
<input type="hidden" id="partialViewAction" value="@Url.Action("BlankEditorRow","ControllerName")" 

Теперь в вашем АЯКС вызова, вместо того, чтобы использовать HREF свойства якоря, используйте значение скрытого поля.

url: $('#partialViewAction').val()