Problems making ajax call with checkbox

Asked

Viewed 79 times

0

I have several checkbox that will make an ajax call, but only the first checkbox You make the call. Any solution in the Ids for this list to make the same call ajax?

Script:

<script>   
    $(document).ready(function () {          
        $("#SelectDias").click(function () {

             //chamada Ajax    
            } else {

            }
        });

    });
</script>

Html:

<input type="checkbox" id="SelectDias" name="SelectDias" value="Domingo" class="checkbox-inline" />
 @Html.Label("Domingo", new { @class = "control-label" })
<br />
<input type="checkbox" id="SelectDias" name="SelectDias" value="Segunda-Feira" class="checkbox-inline" />
@Html.Label("Segunda-Feira", new { @class = "control-label" })
 <br />
<input type="checkbox" id="SelectDias" name="SelectDias" value="Terça-Feira" class="checkbox-inline"  />
@Html.Label("Terça-Feira", new { @class = "control-label" })
<br />
<input type="checkbox" id="SelectDias" name="SelectDias" value="Quarta-Feira" class="checkbox-inline" />
@Html.Label("Quarta-Feira", new { @class = "control-label" })
<br />
<input type="checkbox" id="SelectDias" name="SelectDias" value="Quinta-Feira" class="checkbox-inline" />
@Html.Label("Quinta-Feira", new { @class = "control-label" })
<br />
<input type="checkbox" id="SelectDias" name="SelectDias" value="Sexta-Feira" class="checkbox-inline"  />
@Html.Label("Sexta-Feira", new { @class = "control-label" })
<br />
<input type="checkbox" id="SelectDias" name="SelectDias" value="Sábado" class="checkbox-inline" />
@Html.Label("Sábado", new { @class = "control-label" })
javascript jquery html ajax

2 answers

3


The id attribute serves (as its own name says) as a unique identification for the page, it should not have two elements in the same frame with the same id. Instead of $("#Selectdias") prefer to use $(".checkbox-inline"), if there is any input use the class checkbox-inline and he’s not part of Selectdias, consider creating a specific class for it, as a class weekday.

  • Perfect, enter the function, I do not understand why in the call ajax always takes the first value of my first checkbox, ie "Sunday".

  • data: { dayPertendidos: $(".checkbox-inline"). val() }

  • Simãolopes in this case, use according to Diego’s answer, making a $(this) to catch the element that triggered the event. The context this in the case of events in jQuery is the element that triggers the event (beware of Event Bubbling pranks, but here is not the case).

  • Perfect. Thank you :)

2

Giving an Improving in Gabriel’s answer, you have to define a class, as in his own example, weekday. And within your click Event method you take the instance of the checkbox that was clicked to use the value you selected:

<script>   
    $(document).ready(function () {          
        $(".dia-da-semana").click(function () {
            var instanciaCheckboxClicada = $(this);
            var valorCheckboxClicado = instanciaCheckboxClicada.val();
             //chamada Ajax passando a variavel valorCheckboxClicado
        });

    });
</script>

  • Perfect. Thank you :)

Browser other questions tagged javascript jquery html ajax

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