JQuery добавить скрытый элемент для программной

Это действительно получается для меня сейчас. У меня есть форма, которая загружается, когда загружается страница. В моем jquery "ready" function Я добавляю скрытый в эту форму:

$("<input id='thehidden' type='hidden' name='thehidden' value='hiddenval'>").appendTo("#MenuForm")

Когда я проверяю содержимое формы с помощью firebug, я вижу, что элемент добавлен.

["$(\"#MenuForm\").children()"] is [div, input#thehidden hiddenval]

Пока все хорошо. Когда я отправлю эту форму и попробую снова прочитать элемет, я не могу получить значение нового скрытого val, которое я добавил.

alert($('#thehidden').val())

- undefined

Любая помощь будет оценена

Ответ 1

Когда вы пытаетесь прочитать значение из #thehidden div? Когда нажата кнопка отправки или когда страница загружается после отправки? Если вы не создаете вход каждый раз при загрузке страницы, на нем не будет загрузки следующей страницы.

Я проверил ваш код, просто создав вход и прочитав значение в предупреждении, и он отлично работает для меня. Проверьте это для себя.

Ответ 2

попробовать

$('#someid').append($('<input></input>').attr('id','hidden1').attr('type','hidden').attr('value','some val'));

Ответ 3

Вы можете создать функцию jQuery, чтобы выполнить большую часть работы для вас. Я использую эту функцию, чтобы программно добавлять скрытые входы:

Функция jQuery:

// This must be applied to a form (or an object inside a form).
jQuery.fn.addHidden = function (name, value) {
    return this.each(function () {
        var input = {};
        if (Object.prototype.toString.call(value) === '[object Array]') {
            var r = /\[\]/;
            // Pass an array as a series of separate hidden fields.
            for (var i = 0; i < value.length; i++) {
                input = $("<input>").attr("type", "hidden")
                                    .attr("name", name.replace(r, '[' + i + ']'))
                                    .val(value[i]);
                $(this).append($(input));
            }
        } else {
            input = $("<input>").attr("type", "hidden")
                                .attr("name", name)
                                .val(value);
            $(this).append($(input));
        }
    });
};

Использование:

Для стандартных элементов формы или простых параметров в MVC theHidden as String:

$('#myform').addHidden('theHidden', 'jam');
=> <input type="hidden" name="theHidden" value="jam">

Для параметров списка в MVC ID As List(Of Integer):

$('#myform').addHidden('ID', [1,2,5]);
=> <input type="hidden" name="ID" value="1">
   <input type="hidden" name="ID" value="2">
   <input type="hidden" name="ID" value="4">

Для сложных типов в MVC, которые имеют свойство List model As ComplexType:

$('#myform').addHidden('Customer[].CustomerID', [1,2,5]);
=> <input type="hidden" name="Customer[0].CustomerID" value="1">
   <input type="hidden" name="Customer[1].CustomerID" value="2">
   <input type="hidden" name="Customer[2].CustomerID" value="5">

Class ComplexType
    Property Customer As List(Of CustomerDetail)
End Class
Class CustomerDetail
    Property CustomerID As Integer
End Class

Ответ 4

Вам нужно вставить входной ELEMENT в DOM, а не просто вставлять HTML на страницу. Когда дело касается полей формы, есть разница.

Используйте var field = $(document.createElement('input')), затем установите атрибуты поля.