Uso de la ventana modal de Bootstrap como vista parcial

Investigamos por distintos espacios y así tener para ti la solución para tu dilema, si continúas con alguna pregunta déjanos tu inquietud y responderemos porque estamos para ayudarte.

Solución:

Sí, hemos hecho esto.

En su Index.cshtml tendrá algo como…

   

   


Show Game Listing

Luego, en JS para la misma página (en línea o en un archivo separado, tendrá algo como esto …

$(document).ready(function() 
   $('#showGame').click(function() 
        var url = $('#gameModal').data('url');

        $.get(url, function(data) 
            $('#gameContainer').html(data);

            $('#gameModal').modal('show');
        );
   );
);

Con un método en tu controlador que se parece a esto…

[HttpGet]
public ActionResult GetGameListing()

   var model = // do whatever you need to get your model
   return PartialView(model);

Por supuesto, necesitará una vista llamada GetGameListing.cshtml dentro de su carpeta Vistas.

Hago esto con mustache.js y plantillas (puede usar cualquier biblioteca de plantillas de JavaScript).

En mi opinión, tengo algo como esto:

…que me permite mantener mis plantillas en una vista parcial llamada Modal.ascx:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
    

        

            ×
            
Name
        
        

            

                

                    
ID
Id
                    
Name
Name
                
            
        
        

            Close
        
    

Creo marcadores de posición para cada modal en mi vista:

<%foreach (var item in Model) %>
    

    
<%%>

…y haz llamadas ajax con jQuery:

Entonces, solo necesitas un disparador en alguna parte:

<%foreach (var item in Model) %>
    ">
        <%=Html.Encode(item.DutModel.Name)%>
    
<%%>

He logrado esto usando un buen ejemplo que he encontrado aquí. Reemplacé el cuadro de diálogo jquery usado en ese ejemplo con las ventanas Modales de Bootstrap de Twitter.

Si crees que ha resultado de ayuda este post, agradeceríamos que lo compartas con más seniors así contrubuyes a dar difusión a nuestra información.

---

---

Utiliza Nuestro Buscador