Sha256: 96d6b638a4ebcfe5bf3eb715c10995c51b9d10387793f3333b6d164f203c1c47
Contents?: true
Size: 1.77 KB
Versions: 9
Compression:
Stored size: 1.77 KB
Contents
<ul class="list-group">
<% payment_method.available_payment_methods.each do |method| %>
<% prefix = "payment_source[#{payment_method.id}]" %>
<div class="radio list-group-item">
<label>
<%= radio_button(prefix, :payment_method_name, method.id, class: 'js-mollie-payment-method') %>
<%= image_tag(method.image['normal']) %>
<%= method.description %>
</label>
<%= select_tag "#{prefix}[issuer]", options_for_select(method.issuers.collect {|p| [p['name'], p['id']]}), {class: 'form-control js-mollie-issuers mollie-issuer-list', disabled: true, prompt: 'Select an issuer', data: {method: method.id}} if method.issuers.present? %>
</div>
<% end %>
</ul>
<script type="text/javascript" charset="utf-8">
/**
* Make sure the issuer select boxes are disabled by default to prevent empty issuer submissions.
*/
var paymentMethodRadioElements = document.querySelectorAll('.js-mollie-payment-method');
function disableAllIssuerSelectBoxes() {
var issuerSelectElements = document.querySelectorAll('.js-mollie-issuers');
for (var i = 0; i < issuerSelectElements.length; i++) {
issuerSelectElements[i].setAttribute('disabled', 'true');
}
}
for (var i = 0; i < paymentMethodRadioElements.length; i++) {
paymentMethodRadioElements[i].addEventListener('change', function (e) {
disableAllIssuerSelectBoxes();
var issuerSelect = document.querySelector('[data-method="' + e.target.value + '"]');
if (issuerSelect) {
issuerSelect.removeAttribute('disabled');
}
});
}
</script>
<style type="text/css">
.mollie-issuer-list {
margin-top: 15px;
}
.mollie-issuer-list[disabled] {
display: none;
}
</style>
Version data entries
9 entries across 9 versions & 1 rubygems