Мне нужно вытащить имя из элементов, которые скрыты от пользователя (style = "display: none") и использовать его для другого элемента, который находится в модальном (и отображается пользователю при активации).
Модальные поля:
<div class="productAttributeList" style="display: none">
<div class="productAttributeRow productAttributeConfigurableEntryText">
<div class="productAttributeLabel">
<label>
<span class="name">Gift Message:</span>
</label>
</div>
<div class="productAttributeValue">
<input type="text" class="Field validation productAttributeFluidWidth"
name="attribute[141]" value="" />
</div>
<div class="cf"></div>
</div>
<div class="productAttributeRow productAttributeConfigurableEntryText">
<div class="productAttributeLabel">
<label>
<span class="name">Delivery Date:</span>
</label>
</div>
<div class="productAttributeValue">
<input type="text" class="Field validation productAttributeFluidWidth"
name="attribute[177]" value="" />
</div>
<div class="cf"></div>
</div>
Видимые поля:
<div class="modal hide fade in" id="product-options">
<div class="modal-header center">
<a class="close modal-close l-m" data-dismiss="modal"
aria-hidden="true">x</a>
</div>
<div class="modal-body ll-m r-m">
<!--- Delivery Date Field --->
<div id="datepickerDiv">
<label for="datepicker" class="name rl-m">Desired Delivery Date:</label>
<br />
<input type="text" class="Field validation productAttributeFluidWidth
rl-m" id="datepicker" value="" placeholder="ex. 01/01/2013"/>
<div class="cf"></div>
<hr />
</div>
<!---- Gift Message ---->
<div id="GiftMessageOption" class="top-m btm-m">
<h5>Gift Message</h5>
<label for="giftMsg">
<small>Please type your desired message (optional)</small>:<br />
</label>
<textarea class="Field validation productAttributeFluidWidth"
id="giftMsg" value=""></textarea>
<div class="cf"></div>
</div>
</div><!-- end of modal body-->
<div class="modal-footer">
<button id="modalCancel" class="btn btn-small" data-dismiss="modal"
aria-hidden="true">Cancel</button>
<button href="#" id="addtocart" class="btn btn-small btn-warning">
<i class="icon-shopping-cart icon-white"></i> Add To Cart</button>
</div><!-- end of modal footer -->
Из скрытых полей я хочу получить имя из первого ввода [type = "text"] и использовать его для ввода [type = "text"] id #datepicker в модальном режиме. Также из скрытых полей я хочу получить имя из второго ввода [type = "text"] и использовать его для ввода [type = "text"] id #giftMsg в модальном режиме. Недавно у меня была аналогичная проблема и я использовал jQuery.attr('name'), но не могу понять, как ее применять здесь... с трудом выясняя, как вызывать значения, поскольку метки и входы для скрытые поля находятся в разных div, разделяющих одни и те же классы. Скрытые поля генерируются сервером корзины покупок, поэтому я не могу их изменять, тогда как я создал модальный, а поля в нем полностью редактируются.
Вот что я пытался безуспешно:
<script>
$("#datepicker").attr('name',
$(".productAttributeConfigurableEntryText span.name:contains('(Standard)') input[type=text]").attr('name'));
$("#giftMsg").attr('name',
$(".productAttributeConfigurableEntryText span.name:contains('(Gift Message)').productAttributeValue input[type=text]").attr('name'));
</script>
Fiddle здесь: Fiddle
Спасибо.
Здесь более организованный подход, зная, что радиоприемники могут быть включены:
/* collect all the inputs, radio, textarea and select*/
var originalInputs=$('.productAttributeList :input');
var newElArray=[
/* selector , index of original input*/
['#datepicker',0],
['#giftMsg',1]
/* add a selector/index for radios*
]
/* now use index of original input to match to modal fields*/
$.each( newElArray,function(i,arr){
var newName= getInputName( arr[1])
$(arr[0]).attr('name', newName);
/* simple way to test, display name beside elemnt*/
$(arr[0]).after( newName);
})
function getInputName( index){
return originalInputs.eq(index).attr('name');
}
Теперь просто перейдите и добавьте [idSelector,index]
в newElArray для каждого из входов, которые вам нужно назвать
visible
ссылки ... помните, модальное не видно при загрузке страницы