Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Diogom42

Botão On/Off usando JQuery Mobile

Por , em Javascript

Recommended Posts

Diogom42    0

Diogom42
Postado

Boa Tarde,

 

Estou tentando criar um botão simples do tipo slider ou flipswitch, que quando selecionado alguma opção ele executa a ação correspondente no PHP, segue o link de um exemplo.

 

http://www.w3schools.com/jquerymobile/tryit.asp?filename=tryjqmob_forms_select_switch

 

Nesse exemplo é preciso escolher a opção ON/OFF e depois clicar no botão para enviar o que estou querendo é retirar esse botão e quando eu escolher ON/OFF ele possa já executar o php.

 

Já tentei fazer varias funções em JS para conseguir chamar o php mas não estou conseguindo, se alguém souber como posso resolver isso ficarei agradecido, estou tentando terminar um projeto mas isso está me barrando.

 

Obrigado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

CamilaLopez    9

CamilaLopez
Postado

Ola jovemm ....

 

se voce quiser fazer uma requisicao POST via ajax ..... se é que eu entendi

        jQuery('#form').submit(function(){

        var dados = jQuery( this ).serialize();

        jQuery.ajax({
        type: "POST",
        url: "teste/teste_ok.php",
        data: dados,
            success: function( data )
            {
            alert( data );
            }
        });

        return false;
        });

Compartilhar este post

Link para o post
Compartilhar em outros sites

Diogom42    0

Diogom42
Postado

Boa noite,

 

Testei o código aqui mas não obtive êxito.

 

O que eu quero é quando eu selecionar ON ele executar uma ação no PHP e quando for OFF executar outra ação, utilizando o exemplo do link que coloquei no primeiro post, e sem precisar de um botão submit.

 

Obrigado.

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

No evento click do botão dispare o teu ajax.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Diogom42    0

Diogom42
Postado

Boa noite,

 

Vou postar o meu código para ver se tem algo de errado e fica mais facil de entender eu acho, o que acontece, ele emite todos os alerta que coloquei mas quando eu mudo o status do botão ele não executa o php.

<script type="text/javascript">
	

            $(document).bind("mobileinit", function() {
                $.mobile.allowCrossDomainPages = true;
            });
	</script>
 
 
 <script type="text/javascript">
 


$(document).delegate("#page", "pageshow", function(e) {

var val = 'on';

$('select#flag').change(function() {

   if(val!==$(this).val()){
        alert($(this).val());


$.ajax({
      type: 'GET',
      url: 'conecta.php',
      data: $('select#flag'),
      success: function(valor) {
      alert(valor);
      alert("OFF ENIADO PARA O PHP");
      
}});



}else{
	
val = $(this).val();
alert($(this).val());	

$.ajax({
      type: 'GET',
      url: 'conecta.php',
      data: $('select#flag'),
      success: function(valor) {
      alert(valor);
      alert("ON ENVIADO PARA O PHP");
      
}});

	
}

});

});

		
 </script>

Código PHP.

<?php


	echo "<pre>";
	print_r($_GET);
	echo "</pre>";
	
	exit();	
 


	
	//$val = $_GET[$('select#flag')];
		

	
	if ($val != 'on'){
	
	echo "OFF php";
	
	
	}else{
	
	echo "ON php";

	
	} 

?>

Obrigado pela atenção de todos.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Diogom42    0

Diogom42
Postado 




<body class='default'>



    <h4>Horizontal Switch Button</h4>


 


 



<div id="page" data-role="page">


 



	<div data-role="content">


 



	<form>



	<label for="flip">Testando o botão</label>



		<select name="flag" id="flag" data-role="flipswitch">



  			<option value="off">OFF</option>



  			<option value="on" selected="selected">ON</option>



		</select>



	</form>


 



	</div>


 



</div>


 


 



</body>







			
		


		

			
				
					

	
	
		

			
				
				

					
				

			
			
			
		

	


				
			
			
    
				
					
					
					
				
				
  • 
					
				
    • 
			

		


		
	


	

		

			
Compartilhar este post

			

			
Link para o post

			
			
			

			
				
Compartilhar em outros sites

				

	

			
		

	



	



					
				
			
			



		

	


	
	

	

	







	

		
			
				Ir para a lista de tópicos
				Javascript
			
		
	

	




	

	

	




						


	

		
	


					

					

	

		
        


	

		
    
			
				
					
					
  • 
				
					
					
  • 
				
					
					
  • 
				
			
		

	


		
            
			

	

		
		

			

				
			

		

	



		
	


					

				

			

			
		

		
		


	×
	

		

			

			

				
			


			
		

	



		

	































	
















		
			
		
		
		
		







	




	







	

		

			

				
Informação importante

				
Ao usar o fórum, você concorda com nossos Termos e condições.

			

			

				  Aceito