Jnnbo: fancybox - Beitrag bearbeiten

Hallo,

ich möchte vermeiden, dass bei jeder Aktion meine Seite neu geladen wird. Hab mich nun für die fancybox entschieden.

Mein Code sieht so aus:

<a class="various fancybox.ajax" href="inc/ajax.php?get=5258255">Ajax</a>
$(document).ready(function() {
	$(".various").fancybox({
		maxWidth	: 800,
		maxHeight	: 600,
		fitToView	: false,
		width		: '70%',
		height		: '70%',
		autoSize	: false,
		closeClick	: false,
		openEffect	: 'none',
		closeEffect	: 'none'
	});
});

Meine ajax.php derzeit so

<?php
$test = htmlspecialchars($_GET["get"]);
?>
<form name="form1" method="post" action="">
  <p>
    <label for="test">Test</label>
    <input type="text" name="test" id="test" value="<?php echo $test;?>">
  </p>
  <p>
    <input type="submit" name="senden" id="senden" value="Senden">
  </p>
</form>

Funktioniert auch, allerdings wenn ich auf den Senden Button klicke, wird das Fenster einfach geschossen, ich kann kein Hinweis mehr ausgeben lassen. Daher die Frage, ist es möglich nach dem Senden noch im Fenster zu bleiben, sprich es soll nicht geschlossen werden.

  1. Hallo,

    ok, ich muss in meine ajax.php wohl ein weiteres jQuery Script einbinden, das dafür sorgt, die Daten abzuschicken

    <form name="form1" id="ajax_form" method="post" action="">
      <p>
        <label for="test">Test</label>
        <input type="text" name="test" id="test" value="<?php echo $test;?>">
      </p>
      <p>
        <input type="submit" name="senden" id="senden" value="Senden">
      </p>
    </form>
    
    $(document).ready(function () {
        $('#ajax_form').bind('submit', function() {
            var form = $('#ajax_form');
            var data = form.serialize();
            $.post('ajax.php', data, function(response) {
                alert('Test');            
            });
            return false;           
        });             
    });
    
    1. Hallo,

      ok, hab es fast geschafft. Mein Script sieht nun so aus

      require_once 'zugangsdaten.php';
      
      $test = htmlspecialchars($_GET["get"]);
      
      if(isset($_POST['moin'])) {
         
          $wert = htmlspecialchars($_POST["moin"]);
      	
      		if ($stmt = $mysqli->prepare("INSERT INTO test (test) VALUES (?)"))
      		 {    
      			$test = $wert;
      			
      			$stmt->bind_param("s", $test);
      			$stmt->execute();
      			}
      			else {
      				echo $mysqli -> error;
      			}
      	exit;
      }
      
      <form name="form1" id="ajax_form" method="post" action="">
        <p>
          <label for="moin">Test</label>
          <input type="text" name="moin" id="moin" value="<?php echo $test;?>">
        </p>
        <p>
          <input type="submit" name="senden" id="senden" value="Senden">
        </p>
      </form>
      
      $(document).ready(function () {
          $('#ajax_form').bind('submit', function() {
              var form = $('#ajax_form');
              var data = form.serialize();
              $.post('inc/ajax.php', data);
              return false;           
          });             
      });
      

      Nach dem Abschicken ist auch ein Eintrag in der Datenbank, aber ich habe irgendwie keine Möglichkeit, mir eine Meldung ausgeben zu lassen z.B. Eintrag war erfolgreich. Als JS Meldung würde es klappen aber ich möchte dieses gerne überhalb meines Eingabefeldes haben.

      Hat hier vielleicht noch jemand eine Idee?

      1. Moin!

        Als JS Meldung würde es klappen aber ich möchte dieses gerne überhalb meines Eingabefeldes haben.

        Also...

        Wenn alert(string) geht, dann geht auch document.getElementById.innerHTML=data bzw. halt das jquery-Pendant.

        Jörg Reinholz

        1. Hallo Jörg,

          Wenn alert(string) geht, dann geht auch document.getElementById.innerHTML=data bzw. halt das jquery-Pendant.

          hab es jetzt so umgesetzt

          ajax.php

          require_once 'zugangsdaten.php';
          
          $test = htmlspecialchars($_GET["get"]);
          
          if(isset($_POST['moin'])) {
             
              $wert = htmlspecialchars($_POST["moin"]);
          	
          		if ($stmt = $mysqli->prepare("INSERT INTO test (test) VALUES (?)"))
          		 {    
          			$test 	= $wert;
          			
          			$stmt->bind_param("s", $test);
          			$stmt->execute();
          			echo "Daten wurden erfolgreich gespeicher";
          			exit;
          						}
          			else {
          				echo $mysqli -> error;
          			}
          }
          

          Meine HTML Datei

          <form name="form1" id="ajax_form" method="post" action="">
            <p>
              <label for="moin">Test</label>
              <input type="text" name="moin" id="moin" value="<?php echo $test;?>">
            </p>
            <p>
              <input type="submit" name="senden" id="senden" value="Senden">
            </p>
          </form>
          <div id="response"></div>
          

          Und zu guter letzt meine jQuery Script

          $(document).ready(function () {
          	
              $("#ajax_form").submit(function() {
          
          	$("#response").html("Daten werden gespeichert...");
          				$.ajax({
          					type: "POST",
          					url: "inc/ajax.php",
          					data: "moin=" + $("#moin").val(),
          					success: function(msg)
          				{
          										$("#response").html(msg);
          			}
          });
          
             return false;           
              });             
          });
          
          1. Hallo,

            vielleicht findet ihr ja den Fehler, ich kann kein Beitrag bearbeiten

            Mein PHP Script

            $code_get = htmlspecialchars($_GET["get"]);
            
            // Datensatz aus der Datenbank auslesen
            $stmt = $mysqli->prepare("SELECT id, test, code FROM test WHERE code=?");
            $stmt->bind_param("s", $code_get);
            $stmt->execute();
            $stmt->bind_result($id, $test, $code);
            $stmt->fetch();
            $stmt->close();
            
            if(isset($_POST['moin'])) {
               
            	
              if ($stmt = $mysqli->prepare("Update test SET test=? WHERE code = ?"))
            		 {    
            			$test 	= $_POST["moin"];
            			$code 	= $code_get;
            			
            			$stmt->bind_param("ss", $test, $code);
            			$stmt->execute();
            			
            			echo "<div class=\"ok\">Daten wurden erfolgreich gespeicher</div>";
            			exit;
            		}
            		else {
            			echo $mysqli -> error;
            		}
            }
            

            Mein HTML Code

            <form name="form1" id="ajax_form" method="post" action="">
              <p>
                <label for="moin">Test</label>
                <input type="text" name="moin" id="moin" value="<?php echo $test;?>">
              </p>
              <p>&nbsp;</p>
              <p>
                <input type="submit" name="senden" id="senden" value="Senden">
              </p>
            </form>
            

            Und zu guter letzt mein JS Code

            $(document).ready(function () {
            	
                $("#ajax_form").submit(function() {
                $("#response").html("<div class=\"data\">Daten werden gespeichert...</div>");
                
                $.ajax({
            		type: "POST",
            		url: "inc/ajax.php",
            		data: "moin=" + $("#moin").val(),
                            
                            success: function(msg) {
            		  $("#response").html(msg);
            		}
            });
             return false;           
                });             
            });
            

            In der Datenbank kommt das Update einfach nicht an, Fehler erhalte ich ebenfalls keine, die Logfiles sind leer.

            1. Hallo,

              zu meinem Code, von gerade: Ich muss scheinbar hier

              url: "inc/ajax.php,
              

              ein get mitgeben, wenn ich es so schreibe

              url: "inc/ajax.php?get=<?php echo $code_get;?>",
              

              Wird es auch ausgeführt. Warum werden solche Fehler nicht in den Logs gespeichert?

              1. Tach!

                zu meinem Code, von gerade: Ich muss scheinbar hier

                url: "inc/ajax.php,
                

                ein get mitgeben, wenn ich es so schreibe

                url: "inc/ajax.php?get=<?php echo $code_get;?>",
                

                Das ist die erste Zeile deines Codes:

                $code_get = htmlspecialchars($_GET["get"]);
                

                Wenn du da einen Parameter namens get abfragst, solltest du ihn auch liefern. Und vor allem prüfen, ob er kommt und nicht einfach gutgläubig darauf zugreifen. (Das das htmlspecialchars() an der Stelle zu früh angewendet wird, haben wir dir sicher schon gesagt, deswegen geh ich da nicht weiter drauf ein.)

                Wird es auch ausgeführt. Warum werden solche Fehler nicht in den Logs gespeichert?

                Weil ein Zugriff auf eine nicht vorhandene Variable oder ein Array-Element nur ein Fehler vom Typ Notice ist, der in der Standardeinstellung vom error_reporting meist ausgeklammert ist. error_reporting(E_ALL) im Code zeigt sie alle an. Alternativ kann man das in der Entwicklungsumgebung auch irgendwo zentral einstellen. (display_errors sollte auch während der Entwicklungsphase angeschaltet sein.)

                dedlfix.

            2. Tach!

              In der Datenbank kommt das Update einfach nicht an, Fehler erhalte ich ebenfalls keine, die Logfiles sind leer.

              Das war schon mal ein Anfang, aber das ist nur der erste kleine Schritt, den ein Programmierer mehr tun muss als ein Anwender. Der nächste ist, den Fehler einzukreisen. Dazu muss man debuggen.

              Es gibt eine Nutzeraktion und von der aus soll eien Folge von Anweisungen etwas tun. Also verfolgt man nun diese Kette. Wenn Javascript im Spiel ist, geht man in die Entwicklerwerkzeug des Browsers und setzt Breakpoints an die strategisch wichtigen Stellen. Die Ausführung muss dort anhalten (oder man hat schon eher ein anderes Problem) und dann kann man die Variableninhalte im einfachsten Fall mit Mausdraufhalten untersuchen.

              Ist da alles ok, dann geht es weiter auf den Server. Da ist unter PHP üblicherweise kein Debugger verfügbar. Man muss sich die Werte geeignet ausgeben, zum Beispiel mit var_dump().

              Man kann auch erstmal generell das Zusammenspielen von Client und Server testen, indem man das was der Client hinschickt wieder zurückshickt, vielleicht auf einfache Weise verändert (wie wärs mit strrev()?), damit man sieht, dass der Server was gemacht hat. Im zweiten Schritt kann man dann die komplexe eigentliche Aufgabe durchführen lassen.

              Debuggen ist das ungeliebte Kind des Programmierers, aber das ist eine esentielle Technik, die man können muss, weil sie oftmals der einzige Weg zur fehlerfreien Lösung ist. Es kann natürlich immer noch sein, dass du an einer Stelle nicht weiterkommst, aber dann weißt du wenigstens schon, wo diese Stelle ist und ersparst den Helfern eine Menge Arbeit.

              dedlfix.

  2. Hallo,

    ich verstehe ein Verhalten von meinem Script leider nicht, vielleicht könnt ihr mir dieses erklären. Mein Code sieht unverändert aus:

    $("#ajax_form").submit(function() {
    
    	$("#response").html("<div class=\"data\">Daten werden gespeichert...</div>");
    		$.ajax({
    			type: "POST",
    			url: "inc/ajax.php?get=<?php echo $code_get;?>",
    			data: "p_preis=" + $("#p_preis").val() + "p_vk1=" + $("#p_vk1").val() + "p_vk2=" + $("#p_vk2").val() + "p_vk3=" + $("#p_vk3").val(),
    			success: function(msg)
    				{
    				$("#response").html(msg);
    				}
    		});
    
            return false;           
    });             
    

    Mein PHP Code

    if(isset($_POST['p_preis'])) {
       
       if ($stmt = $mysqli->prepare("Update web_produkte SET p_preis=?, p_vk1=?, p_vk2=?, p_vk3=? WHERE p_code = ?"))
    	{    
    	  $p_preis 	= $_POST["p_preis"];
    	  $p_vk1 	= $_POST["p_vk1"];
    	  $p_vk2 	= $_POST["p_vk2"];
    	  $p_vk3 	= $_POST["p_vk3"];
    			
    	$stmt->bind_param("sssss", $p_preis, $p_vk1, $p_vk2, $p_vk3, $code_get);
    	$stmt->execute();
    			
    	echo "<div class=\"ok\">Preise wurden erfolgreich gespeichert!</div>";
    	exit;
    	}
    	else {
    	echo $mysqli -> error;
    	}
    }
    

    Mein HTML Code

    <form name="form1" id="ajax_form" method="post" action="">
      <p>
        <label for="p_preis">EK-Preis</label>
        <input type="text" name="p_preis" id="p_preis" value="<?php echo htmlspecialchars($p_preis);?>">
      </p>
    
      <p>
        <label for="p_vk1">Preis 1</label>
        <input type="text" name="p_vk1" id="p_vk1" value="<?php echo htmlspecialchars($p_vk1);?>">
      </p>
      <p>
        <label for="p_vk2">Preis 2</label>
        <input type="text" name="p_vk2" id="p_vk2" value="<?php echo htmlspecialchars($p_vk2);?>">
      </p>
      <p>
        <label for="p_vk3">Preis 3</label>
        <input type="text" name="p_vk3" id="p_vk3" value="<?php echo htmlspecialchars($p_vk3);?>">
      </p>
      <p>
        <input type="submit" name="senden" id="senden" value="Senden">
      </p>
    </form>
    

    Wenn ich ein Update von einem Feld mache, wird dieses in der Datenbank in ein Feld und zwar in "p_preis" gespeichert. Die Frage ist warum? Ich sage doch zu keinem Zeitpunkt füge mir bitte alles zusammen? Ich verstehe es einfach nicht. Sehr ihr zufällig den Fehler?

    In der Datenbank im besagten Feld kommt dieses an "1,00p_vk1=25,00p_vk2=35,00p_vk3=45,00"

    1. Hallo,

      ok, so geht es, alle Daten kommen richtig an:

      $("#ajax_form").submit(function() {
      
      $("#response").html("<div class=\"data\">Daten werden gespeichert...</div>");
      			
      var form = $('#ajax_form');
      var data = form.serialize();	
      				
      		$.ajax({
      			type: "POST",
      			url: "inc/ajax.php?get=<?php echo $code_get;?>",
      			data: data,
      			success: function(msg)
      					{
      					$("#response").html(msg);
      				}
      		});
      
          return false;           
      });             
      

      An diesen beiden Zeilen lag es:

      var form = $('#ajax_form');
      var data = form.serialize();
      
    2. Hi,

      
      
      > 			data: "p_preis=" + $("#p_preis").val() + "p_vk1=" + $("#p_vk1").val() + "p_vk2=" + $("#p_vk2").val() + "p_vk3=" + $("#p_vk3").val(),
      
      

      Wenn ich ein Update von einem Feld mache, wird dieses in der Datenbank in ein Feld und zwar in "p_preis" gespeichert. Die Frage ist warum? Ich sage doch zu keinem Zeitpunkt füge mir bitte alles zusammen?

      Schau Dir den zitierten Code nochmal an - bist Du dann immer noch der Meinung, daß Du nicht alles zusammenfügst?

      cu,
      Andreas a/k/a MudGuard

      1. Hallo MudGuard,

        Schau Dir den zitierten Code nochmal an - bist Du dann immer noch der Meinung, daß Du nicht alles zusammenfügst?

        ist mir später dann auch klar geworden, hab mir dieses Video dazu angesehen. Für einen eMail Versand war es auch genau richtig, der Fehler ist mir zu Beginn nicht aufgefallen weil ich es nur mit einem Feld getestet hatte.

        1. Moin!

          hab mir dieses Video dazu angesehen. Für einen eMail Versand war es auch genau richtig

          Also mir fallen auf Anhieb 3 grobe Fehler auf:

          Na prima! (1)

          In diesem Tutorial wird allen Ernstes empfohlen die Prüfung des Inhalts der Formularfelder mit Javascript, also clientseitig vorzunehmen.

          Ganz klasse-Sache für die Formularspammer. Zumindest für diejenigen, die das Formular zwar auf existierende Felder hin untersuchen, es aber ansonsten einfach nicht benutzen, sondern die Daten an die in <form action="senden_ohne_js.php"> angegebene URL senden. (Das Extra-Script ist im Übrigen auch so nötig wie ein Kropf.)

          Na prima! (2)

          In diesem Tutorial wird die PHP-Notiz auagegeben, dass mail nicht funktionierte und dann die nicht zutreffende Meldung, dass die Nachricht eingegangen sei.

          Na prima! (3)

          Die Daten werden nicht url-kodiert. Wenn im eingegebenen Text was steht wie:

          Hallo!
          
          Geht das so
          
          URL:http://example.com/?bar=foo&foo=bar
          
          Bitte um Nachricht!
          
          

          oder im Subjekt:

          Frage zu http://example.com/bar=foo&foo=bar
          

          dann gibt es Datenmurks vom Allerfeinsten.

          Ich hab neulich schon geschrieben, Du sollst Deine Sachen nicht aus Videos zusammenstöpseln sondern die Grundlagen des Programmierens selbst lernen.

          Jörg Reinholz

          1. Hallo Jörg,

            Ich hab neulich schon geschrieben, Du sollst Deine Sachen nicht aus Videos zusammenstöpseln sondern die Grundlagen des Programmierens selbst lernen.

            um etwas zu lernen muss ich entweder eine Fortbildung besuchen, mir Videos ansehen und oder ein Buch bzw. Tutorials aus dem Netz durchlesen. Oder hier im Forum ständig nachfragen wo ich mir auf dauer auch etwas dumm vorkomme. Also entscheide ich mich erstmal fürs Video schauen, weil ich eigentlich immer noch der Meinung bin etwas erklärt zu bekommen und Gleichzeitig etwas zu sehen wie es funktioniert ist am besten.

            Hab mir dann dieses Video angesehen und hier wird es besser erklärt, aber lass mich wetten, auch hier findest du bestimmt wieder mindestens 3 Fehler?

            1. Moin!

              Du hast es so gewollt!

              aber lass mich wetten, auch hier findest du bestimmt wieder mindestens 3 Fehler?

              Einen peinlichen. Einen der merkwürdiges Verhalten nach sich zieht. Einen ganz simplen:

              <form></from>
              

              Alles drin!

              Jörg Reinholz