Як змусити $ .serialize () врахувати відключених: вхідні елементи?


135

Здається, за замовчуванням відключені вхідні елементи ігноруються $.serialize(). Чи існує рішення?


Це навіть дивніше, адже ви можете серіалізувати інваліда, textareaале не інваліда input..
daVe

Відповіді:


233

Тимчасово ввімкніть їх.

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

26
Варто розглянути readonlyзамість того, disabledяк згадував Андрій нижче.
andilabs

93

Використовуйте лише для введення читання замість вимкнених входів:

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

Це слід отримати за допомогою serialize ().


Чудово, лише зауваження: кнопку "Надіслати" все ще можна натискати лише під час читання.
Андре Шалелла

3
інвалід запобігає серіалізацію, але лише попередження перешкоджає валідації
Джефф Лоурі,

12

Ви можете використовувати проксі-функцію (вона впливає і на $.serializeArray()і $.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);

Найкраще рішення, працює для вибору, прапорця, радіо, прихованих та відключених входів
Plasebo

9

@ user113716 дав основну відповідь. Мій внесок тут - це лише вишуканість jQuery, додавши до нього функцію:

/**
 * 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;
};

Приклад використання:

$("form").serializeIncludeDisabled();

4

Спробуйте це:

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

Чи можете ви, будь ласка, детальніше розглянути та пояснити ОП, чому це працює?
Віллем Малдер

Я можу це пояснити вам. Якщо ви все ще хочете мати відключене поле введення (з будь-якої причини), але ви також хочете відправити ім'я вводу методом serialize (). Тоді замість цього ви можете використовувати приховане поле введення (з тим самим значенням, що й ваше відключене поле введення), яке serialize () не ігнорує. І тоді ви також можете зберегти своє відключене поле для введення для наочності.
superkytoz

3

Я бачу кілька обхідних шляхів, але все ще ніхто не пропонував написати власну функцію серіалізації? Ось ви йдете: 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);
    }
});

2

Інвалідні елементи введення не серіалізуються, оскільки "вимкнено" означає, що їх не слід використовувати відповідно до стандарту W3C. jQuery просто дотримується стандарту, хоча деякі браузери цього не роблять. Ви можете обійти це, додавши приховане поле зі значенням, ідентичним для вимкненого поля, або виконавши це через jQuery, приблизно так:

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

Очевидно, якщо у вас було більше одного відключеного входу, вам доведеться перебирати відповідні селектори тощо.


1

Якщо хтось не хоче активувати їх, а потім відключити їх ще раз, ви також можете спробувати це зробити (я змінив його з полів "Інваліди", не вибраних serializeArray , з використання плагіна до використання нормальної функції):

function getcomment(item)
{
  var data = $(item).serializeArray();
  $(':disabled[name]',item).each(function(){
    data.push({name: item.name,value: $(item).val()});
  });
  return data;
}

Тож ви можете назвати їх так:

getcomment("#formsp .disabledfield");

1
Я спробував вашу функцію, і вона не створює назви елементів або значення. Дивіться приклад нижче; code 3: {ім'я: undefined, значення: ""} 4: {ім'я: undefined, value: ""}
blackmambo

0

Щойно над Аароном Хадоном:

Можливо, у вас є щось інше, ніж Input (наприклад, select), тому я змінив

this.find(":input:disabled")

до

this.find(":disabled")
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.