Button und AJAX reagiert nicht

Question

Ich arbeite an dem Versuch, eine Schaltfläche zum Ausführen eines PHP-Skript mit AJAX zu erhalten. Um klar zu sein, ich bin wirklich neu in Java Script und PHP, so dass mein Code völlig falsch sein könnte. Ich denke, dass das Problem in meinem Button-Klick-Code nicht so sehr der Ajax-Code ist. Jede Hilfe ist groß

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript"> 
    $(".submit").click(function myCall() { 
     var subdata = $("#form").serializeArray(); 
     var request = $.ajax({ 
      url: "construct_new.php", 
      type: "GET", 
      data: subdata 
     }); 
     return false; 
    }); 
    </script> 
    <div> 
     <form id="form"> 
      Name of Product: <input type="text" name="productName" value="Enter Here"> 
      <input type="button" name="submit" value="Submit" class="submit"> 
     </form> 
    </div> 

Answer 1

Sie benötigen einen DOM ready wrapper um die jQuery, weil es wird ausgeführt, bevor das Element vorhanden ist (oder wird vom Browser gerendert).

Sie können entweder $(function(){ }) oder $(document).ready(function(){ }); verwenden.

$(function(){ 
    $(".submit").click(function myCall() { 
     var subdata = $("#form").serializeArray(); 
     var request = $.ajax({ 
      url: "construct_new.php", 
      type: "GET", 
      data: subdata 
     }); 
     return false; 
    }); 
}); 

In diesem Fall brauchen Sie nicht serializeArray() sondern einfach serialize().

Es wurde kein Erfolg oder eine vollständige Funktion definiert und Sie würden nichts sehen, wenn Sie dies einreichen, es sei denn, Sie sehen natürlich die Registerkarte "Entwicklerkonsole/net".

Die Verwendung des Sendeereignisses eines Formulars wird dem Klickereignis des Absenden-Buttons vorgezogen.

$(function(){ 
    $("#form").submit(function myCall() { 
     var subdata = $(this).serialize(); 
     var request = $.ajax({ 
      url: "construct_new.php", 
      type: "GET", 
      data: subdata, 
      success : function(response){ 
       console.log("success!"); 
      } 
     }); 
     return false; 
    }); 
}); 

Answer 2

in einem Dokument bereit, wie dies Setzen Sie Ihre jQuery, und verhindern, dass die Standardaktion (um das Formular abschicken):

<script type="text/javascript"> 
    $(document).ready(function(){ 
      $(".submit").click(function(e) { 
       e.preventDefault(); 
       var subdata = $("#form").serializeArray(); 
       $.get("construct_new.php",{data: subdata}, function(){ 
        console.log(data); // whatever returned by php 
       }); 
      }); 
     }); 
    </script> 

Dokument bereit stellt sicher, Seite alles fertig geladen ist. e.preventDefault() stoppt die Standardaktion (für ein Formular, eine Submission, für ein a-Tag, dem Link folgend).