支払いゲートウェイを有効にするチェックボックスがあるモーダルに取り組んでいます。チェックボックスをクリックすると詳細 div がスライドアウトし、値が設定されている場合は詳細 div がデフォルトで展開されるように設定されていますが、詳細 div が展開されているときにデフォルトでチェックボックスをオンにすることはできません。この場合、jquery の .attr('clicked') メソッドは少し厄介なようです。
ここに私のjqueryがあります:
$("#setting-public-print").live("click", function (e) {
if ($("#setting-public-print").attr('checked'))
{
$('.public-print-settings-div').fadeIn('fast');
$('.pay-to-print').fadeIn('fast');
}
else
{
$('.public-print-settings-div').fadeOut('fast');
$('.pay-to-print').fadeOut('fast');
}
var paymentGateway = isNumberKey();
if ($(paymentGateway).length > 0) {
$("#setting-public-print").attr('checked', 'checked');
}
else {
$("#setting-public-print").removeAttr('checked');
}
});
});
function isNumberKey(evt)
{
var charCode = (evt.which) ? evt.which : event.keyCode;
if (charCode != 46 && charCode > 31
&& (charCode < 48 || charCode > 57))
return false;
return true;
}
および対応する html:
<p><input class="chkbox" type="checkbox" name="checkbox[]" id='setting-public-print'> Enable Payment Gateway</p>
<div class='public-print-settings-div' style=''>
<div class ='pay-to-print'>
<%if !@currency_codes.nil?%>
<%if @currency_codes.count > 0%>
<div class="control-group utopia-chosen-label" style="width:220px !important;">
<h4 style='color:black;'>Select Currency:</h4>
<select data-placeholder="Choose a Currency..." class="chzn-select" tabindex="4" id='selected-currency'>
<option value=""></option>
<%@currency_codes.each do |b|%>
<option value="<%=b%>"><%=b%></option>
<%end%>
</select>
</div>
<%end%>
<%end%>
<p><span id='email-customize-label'>Price per page:</span>
<input id="selected-price" onkeypress="return isNumberKey(event)" type="text" name="selected-price" style='width:50px;'>
</p>
誰かがこのチェックボックスの問題に光を当てることができますか?