PHP - Enviar checkbox sin boton submit

   
Vista:

Enviar checkbox sin boton submit

Publicado por Nata (20 intervenciones) el 03/08/2016 01:52:44
Hola tengo el siguiente boton:
<input type="checkbox" id="AovivoOno" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked>

Este boton con css y javascript lo deje como en las imagenes:
activo
y
inactivo

Quiero saber como podría guardar en la base de datos un valor 1 al presionar activo y un valo 0 al desactivar.
Pienso que sería bueno utilizar ajax para no refrezcar la página entera.
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de kip

Enviar checkbox sin boton submit

Publicado por kip (566 intervenciones) el 03/08/2016 03:20:59
Hola, estas en lo correcto para enviar un valor sin recargar la pagina o usar un formulario puedes usar AJAX, aqui te dejo un par de links para ver si te guian un poco en lo que requieres:

http://www.desarrolloweb.com/articulos/uso-ajax-jquery.html
http://www.keyboardninja.eu/webdevelopment/jquery-ajax-call-tutorial
http://blog.teamtreehouse.com/beginners-guide-to-ajax-development-with-php

Ademas de eso te dejo un pequeño codigo, si te fijas hago uso de jQuery, creo una funcion que se ejcute en el atributo evento cick del boton en cuestion y aquella funcion se encargaria de enviar el dato al script PHP que almacenara lo enviado a la base de datos.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<button id="boton" type="button">Click aqui!</button>
 
<script type="text/javascript">
    $(document).ready(function(){
        $("button#boton").click(function(){
 
            $.ajax({
                type: 'POST',
                url: 'script.php',
                success: function(data) {
                    alert(data);
                }
            });
   });
});
</script>

La respuesta es aquella variable data que puedes ver el success y es entregada por el script PHP en caso de exito del almacenamiento del dato.

En tu caso usaria un evento change() tal vez, intentalo y si tienes algun problema nos comentas que es lo que no puedes hacer.

Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Enviar checkbox sin boton submit

Publicado por Nata (20 intervenciones) el 03/08/2016 04:32:52
No estoy consiguiendo enviar, ya que no tengo un boton submit no tengo idea de como hacer.
Algun ejemplo?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de kip

Enviar checkbox sin boton submit

Publicado por kip (566 intervenciones) el 03/08/2016 05:04:33
Aqui te dejo un ejemplo sencillo de como podrias hacerlo:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<input type="checkbox" id="AovivoOno" name="onoffswitch" class="onoffswitch-checkbox" id="myonoffswitch" checked>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
    	var data;
        $(":checkbox#AovivoOno").change(function(){
        	if ($(":checkbox#AovivoOno:checked").length == 0) data = 0;
        	if ($(":checkbox#AovivoOno:checked").length) data = 1;
        	$.ajax({
	            type: 'POST',
	            data: {'valor':data},
	            url: 'script.php',
	            success: function(response) {
	                alert(response);
	            }
            });
   		});
});
</script>

Fijate que al inicarse aun no enviara el dato a la base, solo se hara luego de que hagas click a este o haya un cambio de estado en el mismo.

Nos avisas si lo hiciste funcionar.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar

Enviar checkbox sin boton submit

Publicado por Nata (20 intervenciones) el 03/08/2016 05:08:14
Hola ya lo habia logrado de una otra forma parecida:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<script>
$(function(){
 $("#onoffswitch").change(function(){
 var url = "insert.php"; // El script a dónde se realizará la petición.
    $.ajax({
           type: "POST",
           url: url,
           data: $("#formulario").serialize(), // Adjuntar los campos del formulario enviado.
           success: function(data){
           }
         });
 
    return false; // Evitar ejecutar el submit del formulario.
 });
});
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar