CODEWITHSUNDEEP
javascriptjqueryradio-button
espresso_coffee
espresso_coffee

Reputation: 6110

JQuery/JavaScript reset clear radio-button value and un-checke the element?

I have form that is populated with the data after Ajax call. Once user clicks on Back button form should be cleared out. For some reason once data is populated and radio-button is checked reset did not clear the value and uncheck the element. Here is code example:

     $.each(getData, function(name, value){
        var elementName = $('[name="'+'frmSaveaccount_'+name.toLowerCase()+'"]'),
            elementType = elementName.prop('type'),
            elementVal = $.trim(value);

        switch(elementType){
            case 'checkbox':
                value == 1 ? elementName.attr('checked',true) : elementName.attr('checked',false);
                break;
            case 'radio':
                $('input[name="'+'frmSaveaccount_'+name.toLowerCase()+'"][value="' + value + '"]').attr('checked', true);                
                break;
            case 'select-one':
                elementName.val(value);
                break;
            default:
                elementName.val(value);
        }
    });

and here is function that clears the form:

$('#account_goback').on('click',clearForm);
function clearForm(e) {
    e.preventDefault();
    $('.frm-Submit')[0].reset();
    $('.frm-Submit').find('input:hidden').val('');
}

Is there a way to uncheck the radio button when form should be cleared out? Thank you.

Upvotes: 0

Views: 7556

Answers (2)

Matthias S
Matthias S

Reputation: 205

This is what I use to clear Radio Buttons.

function clearRadio(){
    var a=[];
    a=document.getElementsByTagName('input');
    for(var b=0;b<a.length;b++){
      if(a[b].type=='radio'){
        a[b].checked=false;
      }
    }
  }

Upvotes: 0

user9736097
user9736097

Reputation:

Try this:

$(document).ready(function(){
	$('button').on('click', function(){
      $('input[type="radio"]').prop('checked', false);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type='radio' name='myRadio'> 1
<input type='radio' name='myRadio'> 2
<button>Reset</button>

Upvotes: 5

Related Questions