¿Cómo publicar un formulario HTML complejo como JSON?

Question

Tengo una forma muy compleja en una página web. El usuario realmente construye un objeto complejo. La interfaz de usuario se maneja usando jQuery (mostrando, ocultando secciones, duplicando y eliminando subformularios, ...).

Simplemente publicar el formulario en el envío del usuario, aunque sea posible, no parece la mejor solución: sería difícil maquillar nombres únicos para los campos (puede haber matrices de objetos) y decodificar todo el contenido del lado del servidor .

Supongo que debería publicar una representación JSON del objeto. ¿Cómo puedo hacer eso?

No estoy tratando de hacer una llamada ajax. Deseo enviar el formulario pero usando JSON en lugar de una aplicación habitual/formulario de x-www-form-urlencoded.

FWIW, el backend es ASP.NET MVC.

TIA,

Answer 1

serializar JSON a usar la escritura ...

Aunque esta respuesta utiliza Ajax, en su lugar podría escribir la cadena en serie a una entrada [type = hidden] en su forma

Serializing to JSON in jQuery

Answer 2

puede probar esto:

$("form").submit(function() 
{ 
    //Checking data here: 
    $("input").each(function(i, obj) 
    { 
    }); 
    alert($(this).serialize()); 
    alert(toJSON($(this).serializeArray())); 
    //return false; 
}); 

function toJSON(obj) 
{ 
    var json = '({'; 
    $.each(obj, function(k,v){ 
    var q = typeof v == 'string' ? ~v.indexOf("'") ? '"' : "'" : ''; 
    if (typeof v == 'object') 
    v = toJSON(v).slice(0,-1).substr(1); 
    json+= k + ':'+ q + v + q + ','; 
    }); 
    return json.slice(0,-1)+'})'; 
}; 

Mi violín: http://jsfiddle.net/Achilleterzo/6Zj6n/

Answer 3

Utilice jquery form plugin para enviar el formulario a través de AJAX. Para nombres de campos duplicados, la forma predeterminada generalmente es agregar [] al nombre, la mayoría de los lenguajes del lado del servidor, y luego crear una matriz que contenga todos los valores enviados. Dependiendo del idioma, también podría suceder sin el [], pero estoy seguro de que MSDN lo ayudará, ya que está utilizando ASP.NET para su back-end.

Answer 4

Si está utilizando jQuery se puede mirar en estas dos funciones .serialize() y .serializeArray()

Estas funciones le ayudarán a obtener los datos del formulario, sin que tenga que repetir manualmente.