Javascriptの確認ダイアログからPHPファイルの処理を実行する方法

Question

htmlファイル内にJavascriptで

<button onclick="popup()">応募する</button>
<script type="JavaScript">
function popup(){
    $myRet = confirm("この写真で応募しますか？");
    if ( $myRet == true ){
     
        alert("応募が完了しました。");
    }
}
</script>

のように応募ボタンと確認ダイアログを作成し、
応募しますか→はい
の時、「応募が完了しました」と表示される前（上記ソースコード内の空白部分）に、別のphpファイルの処理（処理内容は、写真の応募者情報や応募日時をデータベースに記録するというものです）を実行する命令を記述したいです。しかし、やり方が分かりません。

分かる方がいらっしゃいましたら、ご教授お願いいたします。

Comments

[kei344]

コードはコードブロックで囲んでいただけませんか？ ```（バッククオート3つ）で囲み、前後に改行をいれるか、コードを選択して「</>」ボタンを押すとコードブロックになります。

[tsenda1004]

すみません、修正いたしました。

Answer 1

画面遷移しないならAjaxが必須ですが、formをsubmitしてしまって、「応募が完了しました。」をPHP側で出力してしまうという手段もあると思います。

<form name="my_form"><!-- （省略） --></form>

function popup(){
	var $myRet = confirm( 'この写真で応募しますか？' );
	if ( $myRet == true ) {
		document.my_form.submit();
	}
}

Answer 2

ajaxでサーバーにデータを投げる処理が必要です

ひとつ気になったのはjavascriptで$myRetを変数名として利用していますが
できれば$で始まるものは使わないほうがよいです。
（他の言語やライブラリと競合する可能性があるため）

Comments

[harashow1701]

というよりは、変数がグローバルで宣言代入されてるのが気になります。$はjqueryオブジェクトを代入する変数名の先頭につけることは割と一般的だと思います。

[tsenda1004]

ありがとうございます。

ajaxの記述は、

$.ajax({
type: 'xxx',
url: 'xxx.php',

success:function(xxx) {
alert("応募が完了しました。");
}

というような感じでしょうか（API？も必要？）。
また、ajaxを使わずsubmitを使う方法もあるのでしょうか？

プログラム初心者なので、あまり詳しいことが分かりません・・・。