2014-01-31 4 views
0

Я использую Ajax.BeginForm помощник. Он работает хорошо, но у меня есть небольшая проблема.MVC 5 Ajax Form

Вот код:

<div class="row" id="pdiv"> 
@using (Ajax.BeginForm("SomeAction","SomeController",new AjaxOptions{UpdateTargetId="pdiv"})) 
{ 
..... 
} 
</div> 

Я установил UpdateTargetId в "Pid".

Так первоначально визуализации HTML выглядит следующим образом:

<div class="row" id="pdiv"> 
<form action="/SomeController/SomeAction" data-ajax="true" data-ajax-mode="replace" data-ajax-update="#pdiv" id="form0" method="post"> 
.... 

Теперь, когда я отправке помещает весь Pid DIV внутри ФИД. т.е.

<div class="row" id="pdiv"> 
    <div class="row" id="pdiv"> 
    <form action="/SomeController/SomeAction" data-ajax="true" data-ajax-mode="replace" data-ajax-update="#pdiv" id="form0" method="post"> 
    ..... 
    } 

Я попытался установить Ajax Option InsertionMode= InsertionMode.Replace Но не успех. В любом случае, я могу закончить замену «pdiv» на новый контент?

ответ

1

Вам нужно перенести разметку формы ajax на отдельный вид, так что у i t не будет элемента div, который вы указываете в целевом id, тогда вы должны вывести на сервер этот новый частичный вид из вашего действия ajax.

+0

Я делал то же самое. Но я почему-то думаю, что должен быть легкий более короткий путь. –

+0

Это может быть проще, чем создать частичный вид? –

1

В соответствии с этим сообщение в StackOverflow по Simon

Ну, после некоторого времени, я столкнулся с той же проблемой, и теперь я хотел бы сделать это ясно, так что я заглянула в jquery.unobtrusive-ajax.js и ответствено функция:

function asyncOnSuccess(element, data, contentType) { 
    var mode; 

    if (contentType.indexOf("application/x-javascript") !== -1) { // jQuery already executes JavaScript for us 
     return; 
    } 

    mode = (element.getAttribute("data-ajax-mode") || "").toUpperCase(); 
    $(element.getAttribute("data-ajax-update")).each(function (i, update) { 
     var top; 
     switch (mode) { 
      case "BEFORE": 
       top = update.firstChild; 
       $("<div />").html(data).contents().each(function() { 
        update.insertBefore(this, top); 
       }); 
       break; 
      case "AFTER": 
       $("<div />").html(data).contents().each(function() { 
        update.appendChild(this); 
       }); 
       break; 
      default: 
       // Changed this line because of generating duplicate IDs 
       //$(update).html(data); 
       $(update).html($(data).html()); 
       break; 
     } 
    }); 
} 

Как вы можете видеть, в частности, по умолчанию, ответ не был заменой updatetargetid, но заменить его содержимое с ответом. Теперь я беру внутреннюю часть ответа, и все работает отлично!