Я пытаюсь установить значение скрытого поля в форме с помощью jQuery, но безуспешно.
Вот пример кода, который объясняет проблему. Если я сохраняю тип ввода "текст", он работает без особых проблем. Но, меняя тип ввода на "скрытый", не работает!
<html>
<head>
<script type="text/javascript" src="jquery.js">
</script>
<script type="text/javascript">
$(document).ready(function() {
$("button").click(function() {
$("input:text#texens").val("tinkumaster");
});
});
</script>
</head>
<body>
<p>
Name:
<input type="hidden" id="texens" name="user" value="texens" />
</p>
<button>
Change value for the text field
</button>
</body>
</html>
Я также пробовал следующее обходное решение, установив тип ввода в "текст", а затем используя стиль "display: none" для поля ввода. Но это тоже терпит неудачу! Кажется, jQuery имеет некоторые проблемы с установкой скрытых или невидимых полей ввода.
Любые идеи? Есть ли обходной путь для этого, который действительно работает?
:text будет терпеть неудачу для ввода с типом значения hidden. Также гораздо эффективнее использовать:
$("#texens").val("tinkumaster");
Идентификационные атрибуты должны быть уникальными на веб-странице, убедитесь, что ваши, как это может способствовать любым проблемам, которые у вас есть, и указание более сложного селектора просто замедляет работу и не выглядит таким аккуратным.
Пример http://jsbin.com/elovo/edit, используя код примера http://jsbin.com/elovo/2/edit
Если у вас возникли проблемы с установкой значения скрытого поля, потому что вы передаете ему идентификатор, это решение:
Вместо $("#hidden_field_id").val(id) просто сделайте $("input[id=hidden_field_id]").val(id). Не знаете, в чем разница, но он работает.
Наконец, я нашел решение, и он простой:
document.getElementById("texens").value = "tinkumaster";
Работает как шарм. Не знаю, почему jQuery не возвращается к этому.
У меня была такая же проблема. как ни странно, Google Chrome и, возможно, другие (не уверены) не понравились
$("#thing").val(0);
input type="hidden" id="thing" name="thing" value="1" />
(без изменений)
$("#thing").val("0");
input type="hidden" id="thing" name="thing" value="1" />
(без изменений)
но это работает!!!!
$("#thing").val("no");
input type="hidden" id="thing" name="thing" value="no" />
ИЗМЕНЕНИЙ!!
$("#thing").val("yes");
input type="hidden" id="thing" name="thing" value="yes" />
ИЗМЕНЕНИЙ!!
должна быть "строкой"
$('input[name=hidden_field_name]').val('newVal');
работал у меня, когда ни
$('input[id=hidden_field_id]').val('newVal');
ни
$('#hidden_field_id').val('newVal');
сделал.
.val не работал у меня, потому что я захватываю сторону сервера атрибутов value, и значение не всегда обновлялось. поэтому я использовал:
var counter = 0;
$('a.myClickableLink').click(function(event){
event.preventDefault();
counter++;
...
$('#myInput').attr('value', counter);
}
Надеюсь, что это поможет кому-то.
Собственно, это постоянная проблема. Хотя Энди прав насчет загруженного источника,.val(...) и .attr('value',...), похоже, фактически не изменяют html. Я думаю, что это проблема javascript, а не проблема jquery. Если бы вы использовали firebug, у вас был бы тот же вопрос. Хотя кажется, что если вы отправите форму с измененными значениями, она пройдет, html не изменится. Я столкнулся с этой проблемой, пытаясь создать предварительный просмотр печати измененной формы (делая [form].html()), она копирует все в порядке, включая все изменения, кроме изменений значений. Таким образом, мой предварительный просмотр в модальном формате несколько бесполезен... Моим обходным путем, возможно, должно быть "создать" скрытую форму, содержащую значения, которые они добавили, или создать предварительный просмотр самостоятельно и внести каждую модификацию, которую пользователь делает, также изменить предварительный просмотр. Оба являются неоптимальными, но если кто-то не выясняет, почему поведение настройки значения не изменяет html (в DOM, которое я предполагаю), это должно будет сделать.
У меня была такая же проблема, и я узнал, что случилось. У меня был HTML, который был определен как
<form action="url" method="post">
<input type="hidden" id="email" />
<form>
<script>
function onsomeevent()
{
$("#email").val("[email protected]");
}
</script>
Чтение значений формы на сервере всегда приводило к тому, что почта была пустой. Почесывая голову (и многочисленные поиски), я понял, что ошибка не определяла форму/ввод правильно. При модификации ввода (как показано ниже), он работал как шарм
<input type="hidden" id="email" name="email" />
Добавление к этой теме в случае, если другие имеют одинаковую проблему.
В моем случае я использовал non-string (integer) как параметр val(), который не работает, трюк так же прост, как
$("#price").val('' + price);
Использование val() не помогло мне. Мне приходилось использовать .attr() всюду. Также у меня были разные типы входных данных, и я должен был быть довольно явным в случае флажков и выбора меню.
Обновить текстовое поле
$('#model_name').attr('value',nameVal);
Обновить изображение рядом с вводом файла
$('#img-avatar').attr('src', avatarThumbUrl);
Обновить boolean
if (isActive) {
$('#model_active').attr('checked',"checked");
} else {
$('#model_active').attr('checked', null) ;
}
Обновить выбор (с номером или строкой)
$('#model_framerate').children().each(function(i, el){
var v = $(el).val();
if (v === String(framerateVal)) {
$(el).attr('selected','selected');
} else {
$(el).attr('selected',null);
}
}
Еще одна добыча здесь потеряла часть моего времени, поэтому я подумал, что пройду по кончику. У меня было скрытое поле, в котором я дал идентификатор. и [] скобки в имени (из-за использования с struts2), а селектор $("#model.thefield[0]") не найдет мое скрытое поле. Переименование идентификатора, чтобы не использовать периоды и скобки, заставило селектор начать работу. Таким образом, в итоге у меня появился идентификатор model_the_field_0, и селектор работал нормально.
Использование идентификатора:
$('input:hidden#texens').val('tinkumaster');
Использование класса:
$('input:hidden.many_texens').val('tinkumaster');
Просто используйте синтаксис ниже get и установите
GET
//Script
var a = $("#selectIndex").val();
здесь переменная будет удерживать значение скрытого поля (selectindex)
Серверная сторона
<asp:HiddenField ID="selectIndex" runat="server" Value="0" />
SET
var a =10;
$("#selectIndex").val(a);
Если вы ищете haml, то это ответ для скрытого поля, чтобы установить значение для скрытого поля, например
%input#forum_id.hidden
В вашем jquery просто преобразуйте значение в строку, а затем добавьте его, используя свойство attr в jquery. надеюсь, что это также работает и на других языках.
$('#forum_id').attr('val',forum_id.toString());
<javascript>
slots=''; hidden=''; basket = 0;
cost_per_slot = $("#cost_per_slot").val();
//cost_per_slot = parseFloat(cost_per_slot).toFixed(2)
for (i=0; i< check_array.length; i++) {
slots += check_array[i] + '\r\n';
hidden += check_array[i].substring(0, 8) + '|';
basket = (basket + parseFloat(cost_per_slot));
}
// Populate the Selected Slots section
$("#selected_slots").html(slots);
// Update hidden slots_booked form element with booked slots
$("#slots_booked").val(hidden);
// Update basket total box
basket = basket.toFixed(2);
$("#total").html(basket);
Любой, кто борется с этим, существует очень простой "встроенный" способ сделать это с помощью jQuery:
<input type="search" placeholder="Search" value="" maxlength="256" id="q" name="q" style="width: 300px;" onChange="$('#ADSearch').attr('value', $('#q').attr('value'))"><input type="hidden" name="ADSearch" id="ADSearch" value="">
Это устанавливает значение скрытого поля, когда текст вводится в видимый ввод с помощью события onChange. Полезно (например, в моем случае), где вы хотите передать значение поля форме "Расширенный поиск", а не заставлять пользователя повторно вводить свой поисковый запрос.