javascript - jQuery to display alert box when selecting radio button not working -


i have spent lot of time in following piece of jquery code supposed display alert box whenever radio button selected; however, can't pinpoint why function not executing @ all.

i have made jsfiddle here: https://jsfiddle.net/lcjgd/192/

here got far:

$(document).ready(function(){  $('input[name="years"]').change(function() {      if($('#years_3_years').is(':checked')) {       alert("36 months");     } else if ($('#years_4_years').is(':checked')){      alert("48 months");    } else if ($('#years_5_years').is(':checked')){      alert("60 months");    } };  ); } );    <form id="plangen" action="/calculate" accept-charset="utf-8" method="post"><input name="utf8" type="hidden" value="&#x2713;" /><input type="hidden" name="authenticity_token" value="jkgfl38i+e1kc/jjfw1tikdjaw7rgude6yetkhlrdojci5f3ymdeqadzygw3/ku2furjip0p2naaptft/o1bva==" /> <label for="amt">car loan amount:</label> <input type="text" name="amt" id="amt" /><br> <label for="dp">down payment:</label> <input type="text" name="dp" id="dp" /><br> <label for="int">annual interest:</label> <input type="text" name="int" id="int" /><br>  <input type="radio" name="years" id="years_3_years" value="3 years" /> <label for="years3_child">will pay in 3 years</label><br> <input type="radio" name="years" id="years_4_years" value="4 years" /> <label for="years4_child">will pay in 4 years</label><br> <input type="radio" name="years" id="years_5_years" value="5 years" /> <label for="years5_child">will pay in 5 years</label><br>  <label for="resu">you pay $ monthly:</label> <input type="text" name="resu" id="resu" /><br>  <button type="button" id = "calc">calculate</button> 

thanks @vihan1086 able change code , make code above work. have updated jsfiddle here https://jsfiddle.net/lcjgd/208/

three problems:

1:

$("input[name=radio]").on("click", function () { 

name isn't correct, should be: input[type=radio]

2:

you need jsfiddle "onload" (might me) onload

3:

you have capitalization errors

if($('#years_3_years').is(':checked')) {  

needs be:

if($('#years_3_years').is(':checked')) {  

3_years -> 3_years


avoid this, set event "click". replace ifs with:

if (/(?:(?:years_)\d+(?:_years))/i.test('years_4_years')) {     alert(parseint($(this).attr('value').trim(), 10) * 12 + 'months'); } 

that automatically generate alerts

working fiddle


Comments

Popular posts from this blog

asp.net mvc - SSO between MVCForum and Umbraco7 -

Python Tkinter keyboard using bind -

ubuntu - Selenium Node Not Connecting to Hub, Not Opening Port -