[Ajax-jQuery] problema click su bottone

[ANTAGONIA]

Buon giorno, non capisco come mai, lo script che posto di seguito, non mi permette di attivare la funzione attraverso il bottone...

$(document).ready(function() {

  $("#bottone").click(function(){
  	alert("asdasd");
    var nome = $("#nome").val();
    var cognome = $("#cognome").val();
	
    $.ajax({
      type: "POST",
      url: "file.php",
      data: "nome=" + nome + "&cognome=" + cognome,
      dataType: "html",
      success: function(msg)
      {
        $("#risultato").html(msg);
      },
      error: function()
      {
        alert("Chiamata fallita, si prega di riprovare...");
      }
    });
  });
});



 <form name="modulo">
    

Nome</p>
    

<input type="text" name="nome" id="nome"></p>
    

Cognome</p>
    

<input type="text" name="cognome" id="cognome"></p>
    <input type="button" id="bottone" value="Invia i dati">
</form>

<div id="risultato">Risultato: </div>

Sapete dirmi come mai?
Grazie

[ANTAGONIA]

salve ragazzi...buon giorno.
altra curiosità per lo stesso script.
se fate caso, ho due input text, dove digito nome e cognome, poi con l'invio, nel div #risultato
visualizzo cioò che ho inviato per POST.
Ora, se i dati sono all'nterno di tag span, come faccio ad inviarli per POST?
Perchè facendo nel modo seguente, non mi invia nulla..

/**** invio dati con method POST a file.php per la creazione del pdf***/
	$(document).ready(function() {
	  $("#bottone").click(function(){
		//var nome = $("#nome").val();//valore preso da input text
		var nome = $("#total_item_1").text();//valore preso da tag span
		//alert(nome);
		var cognome = $("#cognome").val();
		
		$.ajax({
		  type: "POST",
		  url: "file.php",
		  data: "nome=" + nome + "&cognome=" + cognome,
		  dataType: "html",
		  success: function(msg)
		  {
			$("#risultato").html(msg);
		  },
		  error: function()
		  {
			alert("Chiamata fallita, si prega di riprovare...");
		  }
		});
	  });
	});

Totale:<span id="total_item_1">0</span>

//nella pagina file.php
 $nome = $_POST["nome"];
    $cognome = $_POST["cognome"];
    if ($nome == "" || $cognome == "")
    {
        echo "Inserire nome e cognome!";
    }
    else
    {
        echo $nome . " " . $cognome;
    }

L'alert(nome); mi restituisce il valore dello span, ma purtroppo non invia nulla.
Dove sbaglio?
Grazie mille...

[ANTAGONIA]

risolto....era la condizione nel file.php, praticamente cosi com'è impostata mi restituiva sempre "Inserire nome e cognome":

var nome= $("#total_item_1").text();//valore preso da tag span

if ($nome == "" || $cognome == "")
    {
        echo "Inserire nome o cognome!";
    }
    else
    {
        echo $nome . " " . $cognome;
    } 

vabbè scusatemi...
buona giornata

[ANTAGONIA]

ho un'altra curiosità...
a questo script vorrei aggiungere un loader, con una gif che indica che sta "caricando" qualcosa...
Come ho fatto nello script che posto, appena apro la pagina si vedesubito il testo "Loading....", e quando clicco scompare la scritta giustamente, senza però caricarmi il risultato..

$(document).ready(function() {
	  $("#bottone").click(function(){
		var loader=$('#loader');
		var total_item_1 = $("#total_item_1").text();
		var total_item_2 = $("#total_item_2").text();
		loader.fadeIn();  
		$.ajax({
		  type: "POST",
		  url: "file.php",
		  data: "total_item_1=" + total_item_1 + "&total_item_2=" + total_item_2,
		  dataType: "text",
		  success: function(msg)
		  {
		  	//alert(total_item_1);
			$("#risultato").html(msg).hide();
			$("#risultato").html(msg).fadeIn();
			loader.fadeOut();
		  },
		  error: function()
		  {
			alert("Chiamata fallita, si prega di riprovare...");
		  }
		});
		return false;
	  });
	});

come fare?
grazie ancora...

[jlsweb]

Ciao! Per la gestione asincrona dei dati di solito uso jquery Form Plugin e mi trovo meravigliosamente bene in quanto ti dà la possibilità di gestire invio e ricezione dati facilmente. Il sistema è fatto interamente con le librerie jquery.

Nel tuo caso ad esempio potresti mostrare un preload prima ancora di inviare in dati da uan form contatti usando il "beforeSubmit" e il "success" per nascondere il preload oppure per mostrare eventualmente un messaggio d'errore o success dal server. Se la cosa ti può interessare ti posto il link del sito.

http://malsup.com/jquery/form/#ajaxForm

Spero di esserti stato d'aiuto.

[ANTAGONIA]

si ti ringrazio....volevo però capire, dove va' implementato il loading, nel mio script...
grazie mille

[jlsweb]

Ciao prova a fare così

$(document).ready(function() {
	  $("#bottone").click(function(){
		$('#loader').show();
		var total_item_1 = $("#total_item_1").text();
		var total_item_2 = $("#total_item_2").text();
		  
		$.ajax({
		  type: "POST",
		  url: "file.php",
		  data: "total_item_1=" + total_item_1 + "&total_item_2=" + total_item_2,
		  dataType: "text",
		  success: function(msg)
		  {
		  	//alert(total_item_1);
			$("#risultato").html(msg).hide();
			$("#risultato").html(msg).fadeIn();
			$('#loader').hide();
		  },
		  error: function()
		  {
			alert("Chiamata fallita, si prega di riprovare...");
		  }
		});
		return false;
	  });
	});

Nel loader mettici un preload.gif, poi imposta il css #loader { display:none; }