Question

JavaScriptからAJAXを使用してPHPファイルに変数を送信しようとしていますが、機能しません。私は似たような質問をすべて見てきましたが（束があります）、解決策を見つけることはまだありません。

これは（フォームと1 JavaScriptにデータを送信します）私の最初のPHPファイルです：

<option value="imageOne" data-cuteform-image='assets/SketchThumbnails/imageOne.png></option> 
<input id="inputURLID" type="text" name="inputURL"> 

<button type="submit" onclick="handleInputs(document.getElementById('sketch').value, document.getElementById('inputURLID').value); return false;">Submit</button> 

のJavaScript（AJAX呼び出しがある）：

var content = { 
    'sketch': pickedSketch, 
    'songUrl': enteredURL 
}; 
$.ajax({ 
    type: "POST", 
    url: "loadSketch.php", 
    data: content, 
    success: function (data, text) { 
     // alert("success"); 
     // console.log(data); 
     // console.log(text); 

     window.location.href = "loadSketch.php"; 

    }, 
    error: function (request, status, error) { 
     alert(request.responseText); 
    } 
}); 

PHP （loadSketch.php）：

if(isset($_POST['songUrl'])) 
{ 
    $temp = $_POST['songUrl']; 
    echo $temp; 
    echo "received AJAX data"; 
} else { 
    echo "nothing in post variable"; 
} 

loadSketch.php（正常なajax呼び出しから）にリダイレクトされると、「ポスト変数は何も出力されません」というメッセージが出力されます。私が間違っていることは何ですか？

洞察が大変ありがとうございます。 :)

Answer 1

あなたのAjax関数が返ってきたときにあなたがちょうどあなたが投稿したのと同じページにリダイレクトしているので、何もsongURLにありません。それは、それに送信されるデータなしで、そのPHPファイルへの新しいHTTP要求を作成しています。コンソールメッセージのコメントを削除すると、正しいエコーメッセージが表示されます。

$.ajax({ 
type: "POST", 
url: "loadSketch.php", 
data: content, 
success: function (data, text) { 
    alert("success"); 
    console.log(data); 

}, 
error: function (request, status, error) { 
    alert(request.responseText); 
} 
}); 

Answer 2

ページ全体がリロードされるため、送信ボタンは使用しないでください。通常のボタンを使用し、AJAX関数を呼び出すクリックイベントを処理します。

HTML：

<button onclick="doAjaxFunction(param1, param2);">Calling Ajax Function<button> 

はJavaScript：

function doAjaxFunction(val1,val2){ 
    $.ajax({ 
    type: "POST", 
    url: "loadSketch.php", 
    dataType: "json", 
    data: {"'value1':'"+ val1+"', 'value2':'"+ val2+"'"}, 
    success: function (data, text) { 
    // alert("success"); 
    // console.log(data); 
    // console.log(text); 
    window.location.href = "loadSketch.php"; 
    }, 
    error: function (request, status, error) { 
     alert(request.responseText); 
    } 
}); 

それからちょうどloadSketch.phpであなたのPOSTパラメータを選択し、それらを使用しています。

PHP：

$x = $_POST['value1']; 
$y = $_POST['value2'];