2009-01-21 14 views
6

Me gustaría agregar dinámicamente campos a un formulario ASP.NET MVC con JQuery.ASP.NET MVC & JQuery Dynamic Form Content

Ejemplo:

<script language="javascript" type="text/javascript"> 
    var widgets; 

    $(document).ready(function() { 
     widgets = 0; 
     AddWidget(); 
    }); 

    function AddWidget() { 
     $('#widgets').append("<li><input type='text' name='widget" + widgets + "'/></li>"); 
     widgets++; 
    } 
</script> 

<ul id="widgets"> 
</ul> 

Esto funciona, pero yo iba a repetir manualmente los valores del formulario en el controlador:

[AcceptVerbs("Post")] 
public ActionResult AddWidget(FormCollection form) 
{ 
    foreach (string s in form) 
    { 
     string t = form[s]; 
    } 

    return RedirectToAction("ActionName"); 
} 

Pero se me ocurrió cuando envío al usuario de vuelta a la Obtener acción en el controlador Tendré que configurar FormData con los valores ingresados ​​y luego agregar iterativamente los widgets con <% scripting.

¿Cuál es la forma más fácil de hacer esto en la versión actual (5 creo)?

Respuesta

4

Mi solución podría ser algo como esto (pseudo-código):

<script language="javascript" type="text/javascript"> 
    var widgets; 

    $(document).ready(function() { 
     widgets = 0; 
     <% for each value in ViewData("WidgetValues") %> 
      AddWidget(<%= value %>); 
     <% next %> 
    }); 

    function AddWidget(value) { 
     $('#widgets').append("<li><input type='text' name='widget" + widgets + 
          "'>" + value + "</input></li>"); 
     widgets++; 
    } 
</script> 

<ul id="widgets"> 
</ul> 

Y en el controlador:

[AcceptVerbs("Post")] 
public ActionResult AddWidget(FormCollection form) 
{ 
    dim collValues as new Collection; 
    foreach (string s in form) 
    { 
     string t = form[s]; 
     collValues.add(t) 
    } 
    ViewData("WidgetValues") = collValues; 
    return RedirectToAction("ActionName"); 
} 

Usted puede trabajar en los detalles más adelante
(lo siento para mezclar VB con C#, soy un tipo VB)

0

me puede estar faltando el punto aquí, pero, ¿realmente necesita publicar los datos de nuevo en el controlador a través de una acción de formulario? ¿Por qué no hacer una llamada ajax usando jquery para publicar los datos en el controlador ... o mejor aún un servicio web? envíe los datos de manera asincrónica y no sea necesario reconstruir la vista con los valores de datos enviados.

Esto funciona bien si los valores se están consumiendo y nunca se vuelven a usar, sin embargo, si planea persistir en los datos y hacerlo emerger la vista, su modelo realmente debería ser compatible con la estructura de datos. tal vez un Dictionary<string, string> en el modelo.

+0

Las secuencias de comandos no son realmente aceptables para enviar datos de formularios, la aplicación debe degradarse correctamente sin tener habilitados los scripts. – blu

+4

@blu Ha? Está utilizando javascript en primer lugar para construir los controles; ¿Cómo se degradaría graciosamente con js deshabilitado? – Aleris

+0

Sí, mi comentario no tiene sentido para esta respuesta. – blu

0

No soy un desarrollador ASP.net pero sé por PHP que puede utilizar matrices como los nombres de los campos de entrada

Ex:

<input type="text" name="widgets[]" /> 
<input type="text" name="widgets[]" /> 

Luego, puede iterar a través de los widgets de destino variable como si fuera una matriz de valores.

Sin jugar un poco con las variables dynamicaly llamado etc.

0

Por lo que yo entiendo el problema es el de preservar los valores publicados en los widgets. Creo que puede renderizar esos widgets que no va a llenar en el servidor durante la representación de la Vista.