Cómo hacer que $ .serialize() tenga en cuenta los deshabilitados: ¿elementos de entrada?

Question

Parece que los elementos de entrada deshabilitados por defecto son ignorados por $.serialize(),

¿hay un problema?

Answer 1

Habilítelos temporalmente.

var myform = $('#myform'); 

// Find disabled inputs, and remove the "disabled" attribute 
var disabled = myform.find(':input:disabled').removeAttr('disabled'); 

// serialize the form 
var serialized = myform.serialize(); 

// re-disabled the set of inputs that you previously enabled 
disabled.attr('disabled','disabled'); 

Answer 2

Los elementos de entrada deshabilitados no se serializan porque 'deshabilitado' significa que no se deben usar, según el estándar W3C. jQuery simplemente está cumpliendo con el estándar, aunque algunos navegadores no lo hacen. Puede solucionar este problema, mediante la adición de un campo oculto con un valor igual al campo de discapacitados, o al hacer esto a través de jQuery, algo como esto:

$('#myform').submit(function() { 
    $(this).children('input[hiddeninputname]').val($(this).children('input:disabled').val()); 
    $.post($(this).attr('url'), $(this).serialize, null, 'html'); 
}); 

Obviamente, si tuviera más de una entrada desactivada, Tendría que iterar sobre selectores coincidentes, etc.

Answer 3

¿Qué ocurre con el uso de entradas de solo lectura en lugar de entradas deshabilitadas?

<input name='hello_world' type='text' value='hello world' readonly /> 

Esto debería ser recogido por serialize().

Answer 4

Puede utilizar la función de proxy (afectan tanto a $.serializeArray() y $.serialize()):

(function($){ 
    var proxy = $.fn.serializeArray; 
    $.fn.serializeArray = function(){ 
     var inputs = this.find(':disabled'); 
     inputs.prop('disabled', false); 
     var serialized = proxy.apply(this, arguments); 
     inputs.prop('disabled', true); 
     return serialized; 
    }; 
})(jQuery); 

Answer 5

probar esto

<input type="checkbox" name="_key" value="value" disabled="" /> 
<input type="hidden" name="key" value="value"/> 

Answer 6

puedo ver algunas soluciones, pero todavía nadie sugirió escribir su propia serialización ¿función? Aquí van: https://jsfiddle.net/Lnag9kbc/

var data = []; 

// here, we will find all inputs (including textareas, selects etc) 
// to find just disabled, add ":disabled" to find() 
$("#myform").find(':input').each(function(){ 
    var name = $(this).attr('name'); 
    var val = $(this).val(); 
    //is name defined? 
    if(typeof name !== typeof undefined && name !== false && typeof val !== typeof undefined) 
    { 
     //checkboxes needs to be checked: 
     if(!$(this).is("input[type=checkbox]") || $(this).prop('checked')) 
      data += (data==""?"":"&")+encodeURIComponent(name)+"="+encodeURIComponent(val); 
    } 
}); 

Answer 7

@ user113716 proporcionan la respuesta núcleo, mi contribución aquí es sólo una sutileza jQuery mediante la adición de una función a la misma.

/** 
* Alternative method to serialize a form with disabled inputs 
*/ 
$.fn.serializeIncludeDisabled = function() { 
    let disabled = this.find(":input:disabled").removeAttr("disabled"); 
    let serialized = this.serialize(); 
    disabled.attr("disabled", "disabled"); 
    return serialized; 
}; 

Ejemplo de uso:

$("form").serializeIncludeDisabled(); 

Answer 8

Considere utilizar readonly en lugar de disabled. Los campos de solo lectura están serializados.