Why is my radio input returning "on"?

Asked

Viewed 91 times

2

Have this code:

$(document).ready(function(){
    $("[name='valor1']").on('blur',function(){
        $(".empresa1").text($(this).val());
        $(".valor1").val($(this).val());
    });
    $("[name='valor2']").on('blur',function(){    
            $(".empresa2").text($('[name="valor2"]').val());
            $(".valor2").val($('[name="valor2"]').val());
    });    
    $("[name='valor3']").on('blur',function(){    
            $(".empresa3").text($('[name="valor3"]').val());
            $(".valor3").val($('[name="valor3"]').val());
    });   
    $("[name='empresa1']").on('click',function(){
        alert($(this).val());
    });
    $("[name='empresa2']").on('click',function(){
        alert($(this).val());
    });    
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" name="valor1" value=""/>
<input type="text" name="valor2" value=""/>
<input type="text" name="valor3" value=""/>

<BR/><BR/><BR/>
<label class="empresa1"></label><input type="radio" name="empresa1" class="valor1" val=""/>
<label class="empresa2"></label><input type="radio" name="empresa1" class="valor2" val=""/>
<label class="empresa3"></label><input type="radio" name="empresa1" class="valor3" val=""/>
<BR/>
<label class="empresa1"></label><input type="radio" name="empresa2" class="valor1" val=""/>
<label class="empresa2"></label><input type="radio" name="empresa2" class="valor2" val=""/>
<label class="empresa3"></label><input type="radio" name="empresa2" class="valor3" val=""/>

The idea is to fill in the 3 inputs, popular the radio input value and write the text typed in the Abels.

The problem: if I do not enter any value and click on one of the radio Buttons, the value is printed "on".

Enter the jsfiddle I made above, press the radio button without typing anything and check the alert that will appear, why that? Has to leave it empty?

javascript jquery html

1 answer

4


Your radios don’t have the attribute value, you seem to have used val in place. When radios have no value, this value is posted "on".

You seem to be wanting to build something like this:

<label class="empresa1"></label><input type="radio" name="empresa1" class="valor1"  value=""/>
<label class="empresa2"></label><input type="radio" name="empresa1" class="valor1"  value=""/>
<label class="empresa3"></label><input type="radio" name="empresa1" class="valor1"  value=""/>
<br/>
<label class="empresa1"></label><input type="radio" name="empresa2" class="valor1"  value=""/>
<label class="empresa2"></label><input type="radio" name="empresa2" class="valor1"  value=""/>
<label class="empresa3"></label><input type="radio" name="empresa2" class="valor1"  value=""/>

  • i have a form that the user must enter the Texts inputs informing a company, from that input text typed, I will have to popular in the radio Buttons of the next questions. This method I made will work? Of course there are more treatments (of forcing him to type the Texts input, etc).

  • I think so. I went back to the classes in your code. I pasted in your fiddle to see how it works: http://jsfiddle.net/yqLo0nms/1/

Browser other questions tagged javascript jquery html

You are not signed in. Login or sign up in order to post.