Select radio when clicking on a button

Question

Select radio when clicking on a button

Navigation

#1 by (0 votes)

-3

I want the person to click the button 1 to automatically select radio 2 , thus preventing the user from doing two clicks.

How can I do this?

Note:Thesamethingwillhappenalsowhenselectinganotherpaymentmethod.

Page link:

I tried to use this example of the guy above, but checked is giving null !!!

Where am I going wrong?

<script type="text/javascript">// true = selecionar ~ false = deselecionar

function um(){
document.getElementById('payment_method_iugu-credit-card').checked = true;
document.getElementById('payment_method_iugu-bank-slip').checked = false;
document.getElementById('payment_method_wc_ticket_installments').checked = false;
document.getElementById('payment_method_pagseguro').checked = false;
}
function dois(){
document.getElementById('payment_method_iugu-credit-card').checked = false;
document.getElementById('payment_method_iugu-bank-slip').checked = true;
document.getElementById('payment_method_wc_ticket_installments').checked = false;
document.getElementById('payment_method_pagseguro').checked = false;
}
function tres(){
document.getElementById('payment_method_iugu-credit-card').checked = false;
document.getElementById('payment_method_iugu-bank-slip').checked = false;
document.getElementById('payment_method_wc_ticket_installments').checked = true;
document.getElementById('payment_method_pagseguro').checked = false;
}

function quatro(){
document.getElementById('payment_method_iugu-credit-card').checked = false;
document.getElementById('payment_method_iugu-bank-slip').checked = false;
document.getElementById('payment_method_wc_ticket_installments').checked = false;
document.getElementById('payment_method_pagseguro').checked = true;
}</script>

<div class="textopagamento"><h3>Pagamento</h3></div>
  <ul class="abapagamento nav nav-tabs">
 <li ><a id="bot-um" onclick="um()" href="#divhideiugu-credit-card">Cartão S/ Juros</a></li>
 <li ><a id="bot-dois" onclick="dois()" href="#divhideiugu-bank-slip">Boleto à Vista </a></li>
 <li ><a id="bot-tres" onclick="tres()" href="#divhidewc_ticket_installments">Boleto Parcelado </a></li>
 <li ><a id="bot-quatro" onclick="quatro()" href="#divhidepagseguro">Pag Seguro</a></li>
					
  </ul>
</div>

javascript html jquery

asked by anonymous 22.08.2018 / 02:49

1 answer

Separate by category the registration form START IONIC PRESENTS ERROR

score 0 · Answer 1

Matheus there are several ways to do this:

If you want something more dynamic in the example below, I mark the radio and add the name of the button clicked.

$(document).ready(function(){
  $("button").on("click", function() {
    var texto = $(this).text();
    $("#radio").prop("checked", true);
    $("span").html(texto);
  })
})

button{
  color: #fff;
  background-color: purple;
  border: none;
  border-radius: 4px;
  padding: 10px;
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><buttonid="pag-seguro">Pag Seguro</button>
<button>Cartão sem juros</button>
<button>Boleto parcelado</button>

<br><br>

<input type="radio" id="radio"><span></span>

Now what I was looking for was just marking the check you can do as follows:

$(document).ready(function(){
  $("button:eq(0)").on("click", function() {
    $("input:eq(0)").prop("checked", true);
  })
  $("button:eq(1)").on("click", function() {
    $("input:eq(1)").prop("checked", true);
  })
  $("button:eq(2)").on("click", function() {
    $("input:eq(2)").prop("checked", true);
  })
})

button{
  color: #fff;
  background-color: purple;
  border: none;
  border-radius: 4px;
  padding: 10px;
  cursor: pointer;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><button>PagSeguro</button><button>Cartãosemjuros</button><button>Boletoparcelado</button><br><br><inputtype="radio" id="pag">Pag Seguro
<input type="radio" id="car">Cartão sem juros
<input type="radio" id="bol">Boleto parcelado