Conditional structure if Else are not working

Question

I have the following situation: I have a form with some selects and 2 inputs. One with start date that will be filled by the user who is of type date and another with type text. As image below:

    <div class="panel-body">
                        <div class="radio">
                            <label>
                            <input type="radio" name="optionsRadios" class="bloqueio_campo" id="optionsRadios1" value="option1" onchange="getRadioSelected1()">
                            5 dias
                            </label>
                        </div>
                        <div class="radio">
                            <label>
                            <input type="radio" name="optionsRadios" class="bloqueio_campo" id="optionsRadios2" value="option2" onchange="getRadioSelected2()">
                            10 dias
                            </label>
                        </div>
                        <div class="radio">
                            <label>
                            <input type="radio" name="optionsRadios" class="bloqueio_campo" id="optionsRadios3" value="option3" onchange="getRadioSelected3()">
                            15 dias
                            </label>
                        </div>
                        <div class="radio">
                            <label>
                            <input type="radio" name="optionsRadios" class="bloqueio_campo" id="optionsRadios4" value="option4" onchange="getRadioSelected4()">
                            20 dias
                            </label>
                        </div>
                        <div class="radio">
                            <label>
                            <input type="radio" name="optionsRadios" class="bloqueio_campo" id="optionsRadios5" value="option5" onchange="getRadioSelected5()">
                            30 dias
                            </label>
                        </div>
                        <div class="radio">
                            <label>
                            <input type="radio" name="optionsRadios" class="bloqueio_campo" id="optionsRadios6" value="option6" onchange="getRadioSelected6()">
                            5 dias com a venda de 10 dias
                            </label>
                        </div>
                        <div class="radio">
                            <label>
                            <input type="radio" name="optionsRadios" class="bloqueio_campo" id="optionsRadios7" value="option7" onchange="getRadioSelected7()">
                            15 dias com a venda de 10 dias
                            </label>
                        </div>
                        <div class="radio">
                            <label>
                            <input type="radio" name="optionsRadios" class="bloqueio_campo" id="optionsRadios8" value="option8" onchange="getRadioSelected8()">
                            20 dias com a venda de 10 dias
                            </label>
                        </div><br>  
                <div class="col-md-2">
                <label for="dt_inicio">Data início das Férias</label>
                <input type="date" class="form-control" name="dt_inicio" id="dt_inicio" onchange='pegaDtInicial()'>
            </div>
            <div class="col-md-2">
                <label for="dt_fim">Data fim das Férias</label>
                <input type="text" class="form-control" name="dt_fim" id="dt_fim" readonly>
            </div>              
        </div>

when clicking on the start date I must check which of the radios was chosen and fill in the end date input with this value.

to acquire the value of the input I made:

Function dtFinal(date){

 if(getRadioSelected1){
     document.getElementById("dt_fim").value = 'Radio 1 Selecionado';
 }else if(getRadioSelected2){
     document.getElementById("dt_fim").value =  'Radio 2 Selecionado';
 }else if(getRadioSelected3){
     document.getElementById("dt_fim").value =  'Radio 3 Selecionado';
 }else if(getRadioSelected4){
     document.getElementById("dt_fim").value =  'Radio 4 Selecionado';
 }else if(getRadioSelected5){
     document.getElementById("dt_fim").value =  'Radio 5 Selecionado';
 }else if(getRadioSelected5){
     document.getElementById("dt_fim").value =  'Radio 6 Selecionado'o;
 }else if(getRadioSelected6){
     document.getElementById("dt_fim").value =  'Radio 7 Selecionado'';
 }else if(getRadioSelected7){
     document.getElementById("dt_fim").value =  'Radio 8 Selecionado';
 }else{
     console.log('Valor inválido!');

 }

}

Only the problem is that for some reason when clicking on any of the radios, it only fills the input dt order with the value Radio 1 Selected. He is not getting into the other ifs. Please someone can help me?

Answer 1

I can’t understand exactly what you wanted to do within the function pegaDtInicial, but to check within a if the function getRadioSelected1 you are not checking a value but whether it has a reference or not.

If you want to compare the return value of the function, you must call it first (as your function has a parameter, you must pass some value in the call). See the example below:

function func(){
    return 2;
}

func == 2 // false
func() == 2 // true

But in your code, even calling the function you would never enter the block if since in function getRadioSelected1 you do not declare any returns. Thus, by default your function returns undefined which is equivalent to null or false.

---

There is also a serious problem in your code that is checking whether the value is equal to string option<n>. On parole if, you are using a allocation operator instead of a comparison operator.

To fix the problem just you change the operator = by the operator ==, thus:

if(valor == 'option'){
    //...
}

In addition to this operator, there is also another comparison operator that you can use which is the ===. This operator will compare not only the value, but also the data type: See example below:

'1' == 1 // true
'1' === 1 // false (apesar do valor ser o mesmo, o tipo é diferente)

Answer 2

The error is in all conditions and function call, because instead of comparing one value with another you are assigning the value to it, already in your function calls, no parameter is being passed and your functions are waiting to receive a value.

1st Problem - if condition:

valor = 'option2', That means you assigned option2 for the variable valor.

The right thing would be valor == 'option2'

Must exchange = for ==

---

2nd Problem - Function call:

Within the function pegaDtInicial, there are some other conditions under these conditions the functions passed into the condition are incorrect, certain would change if(getRadioSelected1) for if(getRadioSelected1(valor))

Answer 3

That’s because you’re just assigning a value and not comparing.

= It’s for doing assignments.

== If it’s the same.

So you should use the == to make the comparison on his parole.