Ergebnis 1 bis 3 von 3

Thema: Problem Ajax-Aufruf bei dragable div

  1. #1
    Neuer Benutzer
    Registriert seit
    09.08.2016
    Beiträge
    9

    Problem Ajax-Aufruf bei dragable div

    Hallo,

    ich habe folgende Problemstellung. Bei einem Tagesterminkalender möchte ich gerne, dass beim Loslassen eines durch drag & drop bewegten Terminevent per Ajax ein PHP-Script aufgerufen wird, demm zum einen die Event-ID und zum anderen die Y-Position aus dem Offset übergeben wird. Derzeit lässt sich ein Testevent verschieben und ein Alert gibt beim Drop auch den X-Offset und den Y-Offset aus. Allerdings scheint das Ajax nicht ausgeführt zu werden. Hier der Code

    Code:
    
    $( init );
    
    function init() {
      $('#makeMeDraggable').draggable( {
        cursor: 'move',
        containment: 'document',
        start: handleDragStart,
        stop: handleDragStop
        
      } );
    }
    
    function handleDragStart( event, ui ) {
      var offsetXPos = parseInt( ui.offset.left );
      var offsetYPos = parseInt( ui.offset.top );
      //alert( "Drag started!\n\nOffset: (" + offsetXPos + ", " + offsetYPos + ")\n");
      
      // Ajax-Script mit Ermittlung der Event-ID und Eintrag in Draglog-Tabelle
      // zur Verarbeitung nuzr die Y-Position wichtig
    }
    
    function handleDragStop( event, ui ) {
      var offsetXPos = parseInt( ui.offset.left );
      var offsetYPos = parseInt( ui.offset.top );
      alert( "Drag stopped!\n\nOffset: (" + offsetXPos + ", " + offsetYPos + ")\n");
      
    	// Ajax-Script mit Ermittlung mit Vergleich Endposition und neuer Uhrzeit
    	// Abgriff von Draglog-Tabelle und Update des jeweiligen Events   
      
      
      $.ajax ({
    	  	method: "POST",
      		url: "ajax_div_update_test.php",  
       	data: { id: id, ypos: offsetYPos },
       	success: function(data) {
       		alert("erfolgreich");
    		},
    		error: function(XMLHttpRequest, textStatus, errorThrown) { 
            alert("Status: " + textStatus); alert("Error: " + errorThrown); 
        }   
        
      });
    	  
      
    }
    Ich habe auch versucht die Ajax-Aufruf innerhalb der Init-Funktion aufzurufen, allerdings dann lässt sich das Div-Element nicht mehr verschieben. Bislang wird über Ajax nur ein PHP-Testscript aufgerufen, dass die Inhalte der Variablen id und ypos ausgeben soll. Allerdings wird weder >>erfolgreich<< noch der Fehlerfall mit dem Grund ausgegeben. Aufgerufen wird das Jquery-Script an dieser Stelle, wobei das Div auf 12 Pixel von oben ausgerichtet wird und auch den anderen Wert aus einer Datenbanktabelle bekommt. Hier der PHP-Teil

    PHP-Code:
    echo '<div id="content">';
                echo 
    '<div style="top: '.$top.'px" id="makeMeDraggable">'.$row->Betreff.'</div>';
                
    // echo '<div style="top: '.$top.'px" id="makeMeDraggable_'.$row->ID;.'">'.$row->Betreff.'</div>';
                
    echo '</div>'
    Vermutlich wird es ein logischer Fehler sein, da ich an Syntaxfehlern jetzt nichts erkennen konnte.

  2. #2
    Neuer Benutzer
    Registriert seit
    09.08.2016
    Beiträge
    9
    Zwischenzeitlich habe ich herausgefunden, dass die Variable id im Jquery-Script nicht definiert war. Die Variable könnte ich nach in ds umbenennen, damit sie nicht mit der id des DIV-Elements kollidiert. Allerdings scheinen keine Variableninhalte an das PHP-Script übergeben zu werden.

  3. #3
    Neuer Benutzer
    Registriert seit
    09.08.2016
    Beiträge
    9
    Inzwischen funktioniert es bei einem Testscript wie gewünscht. Allerdings habe ich die Übergabemethode von POST auf GET umgestellt.
    Die Übergabe der Variablen lasse ich einfach in URL-Zeile übergeben. Der Variablen ds hatte ich natürlich zuvor einen festen Wert zugewiesen.

    Code:
    url: "ajax_div_update_test.php?ds="+ds+"&ypos="+offsetYPos,

Lesezeichen

Lesezeichen

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •