Setup registration functions

app/Http/Controllers/RegistrationController.php

@@ -0,0 +1,20 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use Illuminate\Http\Request;
+use App\User;
+use Illuminate\Support\Facades\Log;
+
+class RegistrationController extends Controller
+{
+	public function create(Request $request) {
+		Log::debug('this better work');
+		Log::debug($request->all());
+		$request->validate([
+			'name' => 'required',
+			'email' => 'required|email',
+			'password' => 'required'
+		]);
+	}
+}

public/main.js

@@ -1,23 +1,49 @@
 let toggle = document.querySelector(".nav-toggle");
 let heroText = document.querySelectorAll(".landing-hero h2,.landing-hero p");
 let registerToggles = document.querySelectorAll(".register-btn, .register-area	.cancel-button, .services-cards button");
-let form = new FormData(document.getElementById("register-form"));
 const passInput = document.getElementById("password");
 const passInput2 = document.getElementById("confirm_password");
+let token = getCookie("XSRF-TOKEN");
+console.log(document.getElementById("register-name"));
 function register(event) {
-  console.log("register triggered");
+  fetch("/sanctum/csrf-cookie", {
+    method: "GET"
+  }).then(function(response) {
+    token = getCookie("XSRF-TOKEN");
+    let form = new FormData();
+    console.log(document.getElementById("register-name").value);
+    form.append("name", "haha");
+    form.append("email", document.getElementById("register-email").value);
+    form.append("password", document.getElementById("register-password").value);
+    console.log(form);
+    console.log(JSON.stringify(form));
+    fetch("/register", {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+        "X-XSRF-TOKEN": token
+      },
+      body: JSON.stringify({
+        name: document.getElementById("register-name").value,
+        email: document.getElementById("register-email").value,
+        password: document.getElementById("register-password").value
+      })
+    }).then((response2) => {
+      console.log("hii new line");
+      console.log(response2.json());
+    });
+  });
   event.preventDefault();
-  fetch("/register", {
-    method: "POST",
-    headers: {"Content-Type": "application/json"},
-    body: JSON.stringify(form)
-  }).then(console.log((response) => console.log(response.json())));
+}
+function getCookie(name) {
+  var re = new RegExp(name + "=([^;]+)");
+  var value = re.exec(document.cookie);
+  return value != null ? unescape(value[1]) : null;
 }
 function checkPasswords() {
   if (passInput.value != passInput2.value) {
     passInput2.setCustomValidity("Passwords must be matching");
   } else {
-    console.log("pass checks work");
     passInput2.setCustomValidity("");
   }
 }

resources/js/main.js

@@ -2,25 +2,49 @@ let toggle = document.querySelector(".nav-toggle")
 let heroText = document.querySelectorAll(".landing-hero h2,.landing-hero p")
 let registerToggles = document.querySelectorAll(".register-btn, .register-area\
 	.cancel-button, .services-cards button")
- let form = new FormData( document.getElementById("register-form") )  
 const passInput = document.getElementById("password")
 const passInput2 = document.getElementById("confirm_password")
+let token = getCookie('XSRF-TOKEN')
+console.log(document.getElementById("register-name"))
 
 function register(event) {
-	console.log("register triggered")
+	fetch("/sanctum/csrf-cookie", {
+		method: 'GET'
+	}).then( function(response) {
+		token = getCookie('XSRF-TOKEN')
+		let form = new FormData()  
+		console.log(document.getElementById("register-name").value)
+		form.append('name', "haha")
+		form.append('email', document.getElementById("register-email").value)
+		form.append('password',
+			document.getElementById("register-password").value)
+		console.log(form)
+		console.log(JSON.stringify(form))
+		fetch("/register", {
+			method: 'POST',
+			headers: {'Content-Type': 'application/json',
+			'X-XSRF-TOKEN': token},
+			body: JSON.stringify({"name": document.getElementById("register-name").value,
+			"email": document.getElementById("register-email").value,
+			"password": document.getElementById("register-password").value})
+		}).then(response => {
+			console.log('hii new line');
+			console.log(response.json())
+		});
+	})
 	event.preventDefault();
-	fetch("/register", {
-		method: 'POST',
-		headers: {'Content-Type': 'application/json'},
-		body: JSON.stringify(form)
-	}).then(console.log(response => console.log(response.json())))
 }
 
+function getCookie(name) {
+  var re = new RegExp(name + "=([^;]+)");
+  var value = re.exec(document.cookie);
+  return (value != null) ? unescape(value[1]) : null;
+  }
+
 function checkPasswords() {
 	if (passInput.value != passInput2.value) {
 		passInput2.setCustomValidity('Passwords must be matching')
 	} else {
-		console.log("pass checks work")
 		passInput2.setCustomValidity('');
 	}
 }

resources/views/home.blade.php

@@ -16,22 +16,23 @@
 			@csrf
 			<div>
 			<label for='sender_name'>Name</label>
-			<input required type='name' name='sender_name' placeholder=''
+			<input id='register-name' required type='name' name='sender_name' placeholder=''
 			spellcheck='false'>
 			</div>
 			<div>
 			<label for='sender_email'>Email</label>
-			<input required type='email' name='sender_email' placeholder=''
+			<input id='register-email' required type='email' name='sender_email' placeholder=''
 			spellcheck='false'>
 			</div>
 			<div>
 			<label for='sender_password'>Password</label>
-			<input id='password' required type='password' name='sender_password'
+			<input id='register-password' required type='password' name='sender_password'
 			placeholder='' spellcheck='false'>
 			</div>
 			<div>
 			<label for='sender_password'>Confirm Password</label>
-			<input id='confirm_password' required type='password' name='sender_password' placeholder='' spellcheck='false'>
+			<input id='confirm_password' required type='password'
+			name='sender_password' placeholder='' spellcheck='false'>
 			</div>
 			<button class="submit-btn" type="submit">Submit</button>
 			<div class="cancel-button"></div>

routes/web.php

@@ -1,6 +1,7 @@
 <?php
 
 use Illuminate\Support\Facades\Route;
+use App\Http\Controllers\RegistrationController;
 
 /*
 |--------------------------------------------------------------------------
@@ -23,6 +24,4 @@ Route::get('/login', function () {
     return view('home');
 });
 
-Route::get('/register', function () {
-    return view('home');
-});
+Route::post('/register', [RegistrationController::class, 'create']);