2012-02-02 17 views
7

En una vista parcial, estoy usando los AT Ajax.BeginForm como sigue:MVC Ajax.BeginForm Reemplazar un comportamiento extraño

<div id="divToReplace"> 
    @using (Ajax.BeginForm("Action", "Controller, 
          new AjaxOptions 
          { 
           InsertionMode = System.Web.Mvc.Ajax.InsertionMode.Replace, 
           UpdateTargetId = "divToReplace" 
          }, 
          new 
          { 
           id = "formID" 
          })) 
    { 
     ... 
</div> 

Al enviar el formulario, yo esperaría que el div agujero "divToReplace" se sustituye por la respuesta (la vista parcial nuevamente). Pero en lugar del código HTML interno de la div "divToReplace" se sustituye por la respuesta, por lo que el inicio de la vista parcial se ve así:

<div id="divToReplace"> 
    <div id="divToReplace"> 
      ... 

¿Qué estoy haciendo mal?

Respuesta

4

Bueno, después de un cierto tiempo, me encontré con el mismo problema y ahora quería dejar claro así que tenía una mirada en jquery.unobtrusive-ajax.js y la función de responsable:

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; 
     } 
    }); 
} 

Como puede ver en la parte predeterminada, la respuesta no reemplazó al updatetargetid sino que reemplazó su contenido con la respuesta. Ahora tomo la parte interna de la respuesta y todo funciona bien.

+0

Uso $ (actualización) .replaceWith ($ (datos)); en lugar. – Andrei

+0

También eche un vistazo a esto: http://aspnet.codeplex.com/workitem/8767 – Andrei

+0

Bueno, ya lo tenía antes, pero si 'update' podría ser un diálogo jQuery u otro tipo de control, se rompe. – iappwebdev

2

Así, además de la respuesta anterior, se puede añadir su propia condición de jquery.unobtrusive-

ajax.js: 
case "REPLACEWITH": 
$(update).replaceWith(data); 
break; 

y transmitir sus propios parámetros utilizando htmlAttributes:

@using (Ajax.BeginForm("Action", "Controller", null, new AjaxOptions {UpdateTargetId = "DivContainer" } 
new { enctype = "multipart/form-data", data_ajax_mode = "replacewith" }