diff --git a/files/assets/js/submit.js b/files/assets/js/submit.js
index db136f27e..8903d63d8 100644
--- a/files/assets/js/submit.js
+++ b/files/assets/js/submit.js
@@ -216,3 +216,50 @@ if (location.href == '/submit') {
 	const sub = document.getElementById('sub')
 	if (sub) sub.value = localStorage.getItem("sub")
 }
+
+const uploadfilelist = document.getElementById('upload-filelist');
+const bar = document.getElementById('file-progress');
+const percentIndicator = document.getElementById('progress-percent');
+
+function handleUploadProgress(evt) {
+	uploadfilelist.classList.remove("d-none")
+	if (evt.lengthComputable) {
+		const progressPercent = Math.floor((evt.loaded / evt.total) * 100);
+		bar.setAttribute('value', progressPercent);
+		percentIndicator.textContent = progressPercent + '%';
+	}
+}
+
+function submit(form) {
+	const xhr = new XMLHttpRequest();
+
+	formData = new FormData(form);
+
+	formData.append("formkey", formkey());
+	actionPath = form.getAttribute("action");
+
+	xhr.open("POST", actionPath);
+	xhr.upload.onprogress = handleUploadProgress;
+	xhr.setRequestHeader('xhr', 'xhr');
+
+	xhr.onload = function() {
+		uploadfilelist.classList.add("d-none")
+		if (xhr.status >= 200 && xhr.status < 300) {
+			const post_id = JSON.parse(xhr.response)['post_id'];
+			location.href = "/post/" + post_id
+		} else {
+			document.getElementById('toast-post-error-text').innerText = "Error, please try again later."
+			try {
+				let data=JSON.parse(xhr.response);
+				bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-error')).show();
+				document.getElementById('toast-post-error-text').innerText = data["error"];
+				if (data && data["details"]) document.getElementById('toast-post-error-text').innerText = data["details"];
+			} catch(e) {
+				bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-success')).hide();
+				bootstrap.Toast.getOrCreateInstance(document.getElementById('toast-post-error')).show();
+			}
+		}
+	};
+
+	xhr.send(formData);
+}
diff --git a/files/routes/posts.py b/files/routes/posts.py
index 84af0c3ad..7ef2189dc 100644
--- a/files/routes/posts.py
+++ b/files/routes/posts.py
@@ -532,10 +532,7 @@ def submit_post(v:User, sub=None):
 	body = sanitize_raw_body(request.values.get("body", ""), True)
 
 	def error(error):
-		if g.is_api_or_xhr: abort(400, error)
-
-		SUBS = [x[0] for x in g.db.query(Sub.name).order_by(Sub.name).all()]
-		return render_template("submit.html", SUBS=SUBS, v=v, error=error, title=title, url=url, body=body), 400
+		return {"error": error}, 400
 
 	if not title:
 		return error("Please enter a better title!")
@@ -804,9 +801,7 @@ def submit_post(v:User, sub=None):
 	if v.client: return post.json(g.db)
 	else:
 		post.voted = 1
-		if post.new: sort = 'new'
-		else: sort = v.defaultsortingcomments
-		return render_template('submission.html', v=v, p=post, sort=sort, render_replies=True, offset=0, success=True, sub=post.subr)
+		return {"post_id": post.id}
 
 @app.post("/delete_post/<int:pid>")
 @limiter.limit(DEFAULT_RATELIMIT_SLOWER)
diff --git a/files/templates/submit.html b/files/templates/submit.html
index b64ff234c..a02040659 100644
--- a/files/templates/submit.html
+++ b/files/templates/submit.html
@@ -12,7 +12,7 @@
 {% block content %}
 		{% block form %}
 		<div class="submit-grid-view">
-			<form id="submitform" action="{% if sub %}/h/{{sub}}{% endif %}/submit" method="post" enctype="multipart/form-data" style="grid-column: 2">
+			<form id="submitform" action="{% if sub %}/h/{{sub}}{% endif %}/submit" method="post" enctype="multipart/form-data" style="grid-column: 2" data-nonce="{{g.nonce}}" data-onsubmit="submit(this)">
 				<div class="container">
 						<div class="row justify-content-center mb-5">
 								<div class="col p-3 py-md-0">
@@ -93,15 +93,18 @@
 								</div>
 						</div>
 				<div class="container">
-						<div class="row fixed-bottom bg-white border-top p-3" style="z-index: 100; bottom: 0px; transition: bottom 220ms cubic-bezier(0, 0, 0.2, 1) 0s;">
-								<div class="col">
-										<a href="/" class="btn btn-secondary">Cancel</a>
-								</div>
-								<div class="col text-right">
-										{% if error %}<span class="text-danger text-large mr-2">{{error | safe}}</span>{% endif %}
-										<button type="submit" class="btn btn-primary" id="create_button" type="submit" data-nonce="{{g.nonce}}" data-onclick="disable(this);remove_dialog()">Post</button>
-								</div>
+					<div class="row fixed-bottom bg-white border-top p-3" style="z-index: 100; bottom: 0px; transition: bottom 220ms cubic-bezier(0, 0, 0.2, 1) 0s;">
+						<div class="col">
+							<a href="/" class="btn btn-secondary">Cancel</a>
 						</div>
+						<div class="col text-right">
+							<span id="upload-filelist" class="d-none mr-2">
+								<progress id="file-progress" max="100"></progress>
+								<span id="progress-percent"></span>
+							</span>
+							<button type="submit" class="btn btn-primary" id="create_button" type="submit" data-nonce="{{g.nonce}}" data-onclick="disable(this);remove_dialog()">Post</button>
+						</div>
+					</div>
 				</div>
 			</form>
 		</div>