How do I use File Handlers in Sweetalert?
up vote
0
down vote
favorite
I am very new to JavaScript so I am guessing, that this problem will be fairly simple for most of you guys (or at least I hope so...)
I have this SweetAlert Code. It asks the User to upload two images and one text. I am able to add the text to my database but I am struggling with the images... I know that I need to pass the Images using the File Handlers, but I don't know how...
This is my Server that I run my Code on: https://mars.iuk.hdm-stuttgart.de/~mk304/Web_Projekt/webpage/ui/sweetalert/sweetalert_eingabe.php
This is my SweetAlert2/JavaScript Code
<script>
var kuerzeltest = "mk304";
var channeltest = "3";
$(document).ready(function () {
$('#new-btn').click(function () {
swal.mixin({
input: 'text',
confirmButtonText: 'Next →',
showCancelButton: true,
progressSteps: ['1', '2', '3']
}).queue([
{
input: 'file',
title: 'Profilbild hochladen',
text: 'Empfohlen wird 1X1'
},
{
input: 'file',
title: 'Hintergrundbild hochladen',
text: 'Empfohlen wird 16X9'
},
{
title: 'Über mich',
text: ''
},
]).then((result) => {
if (result.value) {
$.ajax({ type: "POST", url: "../../register/profil_update.php",
data: {"post":result.value[2],"bild":result.value[0],"bild2":result.value[1], "kuerzel": kuerzeltest },
});
swal(
"Super!",
"Dein Profil wurde erfolgreich aktualisiert ",
"success"
)
}
})
});
})
and this is my backend code for the database
<?php
include_once '../../userdata.php';
//Posts in Datenbank schreiben
$kuerzel = $_SESSION["kuerzel"];
$bild = $_POST["bild"];
$bild2 = $_POST["bild2"];
$post = $_POST["post"];
$pdo = new PDO ($dsn, $dbuser, $dbpass, array('charset'=>'utf8'));
$sql = "INSERT INTO user_bilder (kuerzel, bild, bild2, post) VALUES (?, ?, ?, ?)";
$statement = $pdo->prepare($sql);
$statement->execute(array("$kuerzel", "$bild", "$bild2", "$post"));
$row = $statement->fetchObject();
header("Location: ../home/home.php");
?>
this is a photo of my database
my database
javascript ajax filehandle sweetalert2 photo-upload
add a comment |
up vote
0
down vote
favorite
I am very new to JavaScript so I am guessing, that this problem will be fairly simple for most of you guys (or at least I hope so...)
I have this SweetAlert Code. It asks the User to upload two images and one text. I am able to add the text to my database but I am struggling with the images... I know that I need to pass the Images using the File Handlers, but I don't know how...
This is my Server that I run my Code on: https://mars.iuk.hdm-stuttgart.de/~mk304/Web_Projekt/webpage/ui/sweetalert/sweetalert_eingabe.php
This is my SweetAlert2/JavaScript Code
<script>
var kuerzeltest = "mk304";
var channeltest = "3";
$(document).ready(function () {
$('#new-btn').click(function () {
swal.mixin({
input: 'text',
confirmButtonText: 'Next →',
showCancelButton: true,
progressSteps: ['1', '2', '3']
}).queue([
{
input: 'file',
title: 'Profilbild hochladen',
text: 'Empfohlen wird 1X1'
},
{
input: 'file',
title: 'Hintergrundbild hochladen',
text: 'Empfohlen wird 16X9'
},
{
title: 'Über mich',
text: ''
},
]).then((result) => {
if (result.value) {
$.ajax({ type: "POST", url: "../../register/profil_update.php",
data: {"post":result.value[2],"bild":result.value[0],"bild2":result.value[1], "kuerzel": kuerzeltest },
});
swal(
"Super!",
"Dein Profil wurde erfolgreich aktualisiert ",
"success"
)
}
})
});
})
and this is my backend code for the database
<?php
include_once '../../userdata.php';
//Posts in Datenbank schreiben
$kuerzel = $_SESSION["kuerzel"];
$bild = $_POST["bild"];
$bild2 = $_POST["bild2"];
$post = $_POST["post"];
$pdo = new PDO ($dsn, $dbuser, $dbpass, array('charset'=>'utf8'));
$sql = "INSERT INTO user_bilder (kuerzel, bild, bild2, post) VALUES (?, ?, ?, ?)";
$statement = $pdo->prepare($sql);
$statement->execute(array("$kuerzel", "$bild", "$bild2", "$post"));
$row = $statement->fetchObject();
header("Location: ../home/home.php");
?>
this is a photo of my database
my database
javascript ajax filehandle sweetalert2 photo-upload
Suggest you first learn how to do this using a simple form and do a search for "ajax upload" to learn how to use FormData API in javascript and $_FILES in php
– charlietfl
Nov 10 at 15:14
thank you so much for the advice! do you know a good tutorial :)?
– Moritz Klug
Nov 10 at 15:28
Shouldn't be hard to find them by searching things like "ajax upload php"
– charlietfl
Nov 10 at 15:32
add a comment |
up vote
0
down vote
favorite
up vote
0
down vote
favorite
I am very new to JavaScript so I am guessing, that this problem will be fairly simple for most of you guys (or at least I hope so...)
I have this SweetAlert Code. It asks the User to upload two images and one text. I am able to add the text to my database but I am struggling with the images... I know that I need to pass the Images using the File Handlers, but I don't know how...
This is my Server that I run my Code on: https://mars.iuk.hdm-stuttgart.de/~mk304/Web_Projekt/webpage/ui/sweetalert/sweetalert_eingabe.php
This is my SweetAlert2/JavaScript Code
<script>
var kuerzeltest = "mk304";
var channeltest = "3";
$(document).ready(function () {
$('#new-btn').click(function () {
swal.mixin({
input: 'text',
confirmButtonText: 'Next →',
showCancelButton: true,
progressSteps: ['1', '2', '3']
}).queue([
{
input: 'file',
title: 'Profilbild hochladen',
text: 'Empfohlen wird 1X1'
},
{
input: 'file',
title: 'Hintergrundbild hochladen',
text: 'Empfohlen wird 16X9'
},
{
title: 'Über mich',
text: ''
},
]).then((result) => {
if (result.value) {
$.ajax({ type: "POST", url: "../../register/profil_update.php",
data: {"post":result.value[2],"bild":result.value[0],"bild2":result.value[1], "kuerzel": kuerzeltest },
});
swal(
"Super!",
"Dein Profil wurde erfolgreich aktualisiert ",
"success"
)
}
})
});
})
and this is my backend code for the database
<?php
include_once '../../userdata.php';
//Posts in Datenbank schreiben
$kuerzel = $_SESSION["kuerzel"];
$bild = $_POST["bild"];
$bild2 = $_POST["bild2"];
$post = $_POST["post"];
$pdo = new PDO ($dsn, $dbuser, $dbpass, array('charset'=>'utf8'));
$sql = "INSERT INTO user_bilder (kuerzel, bild, bild2, post) VALUES (?, ?, ?, ?)";
$statement = $pdo->prepare($sql);
$statement->execute(array("$kuerzel", "$bild", "$bild2", "$post"));
$row = $statement->fetchObject();
header("Location: ../home/home.php");
?>
this is a photo of my database
my database
javascript ajax filehandle sweetalert2 photo-upload
I am very new to JavaScript so I am guessing, that this problem will be fairly simple for most of you guys (or at least I hope so...)
I have this SweetAlert Code. It asks the User to upload two images and one text. I am able to add the text to my database but I am struggling with the images... I know that I need to pass the Images using the File Handlers, but I don't know how...
This is my Server that I run my Code on: https://mars.iuk.hdm-stuttgart.de/~mk304/Web_Projekt/webpage/ui/sweetalert/sweetalert_eingabe.php
This is my SweetAlert2/JavaScript Code
<script>
var kuerzeltest = "mk304";
var channeltest = "3";
$(document).ready(function () {
$('#new-btn').click(function () {
swal.mixin({
input: 'text',
confirmButtonText: 'Next →',
showCancelButton: true,
progressSteps: ['1', '2', '3']
}).queue([
{
input: 'file',
title: 'Profilbild hochladen',
text: 'Empfohlen wird 1X1'
},
{
input: 'file',
title: 'Hintergrundbild hochladen',
text: 'Empfohlen wird 16X9'
},
{
title: 'Über mich',
text: ''
},
]).then((result) => {
if (result.value) {
$.ajax({ type: "POST", url: "../../register/profil_update.php",
data: {"post":result.value[2],"bild":result.value[0],"bild2":result.value[1], "kuerzel": kuerzeltest },
});
swal(
"Super!",
"Dein Profil wurde erfolgreich aktualisiert ",
"success"
)
}
})
});
})
and this is my backend code for the database
<?php
include_once '../../userdata.php';
//Posts in Datenbank schreiben
$kuerzel = $_SESSION["kuerzel"];
$bild = $_POST["bild"];
$bild2 = $_POST["bild2"];
$post = $_POST["post"];
$pdo = new PDO ($dsn, $dbuser, $dbpass, array('charset'=>'utf8'));
$sql = "INSERT INTO user_bilder (kuerzel, bild, bild2, post) VALUES (?, ?, ?, ?)";
$statement = $pdo->prepare($sql);
$statement->execute(array("$kuerzel", "$bild", "$bild2", "$post"));
$row = $statement->fetchObject();
header("Location: ../home/home.php");
?>
this is a photo of my database
my database
<?php
include_once '../../userdata.php';
//Posts in Datenbank schreiben
$kuerzel = $_SESSION["kuerzel"];
$bild = $_POST["bild"];
$bild2 = $_POST["bild2"];
$post = $_POST["post"];
$pdo = new PDO ($dsn, $dbuser, $dbpass, array('charset'=>'utf8'));
$sql = "INSERT INTO user_bilder (kuerzel, bild, bild2, post) VALUES (?, ?, ?, ?)";
$statement = $pdo->prepare($sql);
$statement->execute(array("$kuerzel", "$bild", "$bild2", "$post"));
$row = $statement->fetchObject();
header("Location: ../home/home.php");
?>
<?php
include_once '../../userdata.php';
//Posts in Datenbank schreiben
$kuerzel = $_SESSION["kuerzel"];
$bild = $_POST["bild"];
$bild2 = $_POST["bild2"];
$post = $_POST["post"];
$pdo = new PDO ($dsn, $dbuser, $dbpass, array('charset'=>'utf8'));
$sql = "INSERT INTO user_bilder (kuerzel, bild, bild2, post) VALUES (?, ?, ?, ?)";
$statement = $pdo->prepare($sql);
$statement->execute(array("$kuerzel", "$bild", "$bild2", "$post"));
$row = $statement->fetchObject();
header("Location: ../home/home.php");
?>
javascript ajax filehandle sweetalert2 photo-upload
javascript ajax filehandle sweetalert2 photo-upload
asked Nov 10 at 15:09
Moritz Klug
85
85
Suggest you first learn how to do this using a simple form and do a search for "ajax upload" to learn how to use FormData API in javascript and $_FILES in php
– charlietfl
Nov 10 at 15:14
thank you so much for the advice! do you know a good tutorial :)?
– Moritz Klug
Nov 10 at 15:28
Shouldn't be hard to find them by searching things like "ajax upload php"
– charlietfl
Nov 10 at 15:32
add a comment |
Suggest you first learn how to do this using a simple form and do a search for "ajax upload" to learn how to use FormData API in javascript and $_FILES in php
– charlietfl
Nov 10 at 15:14
thank you so much for the advice! do you know a good tutorial :)?
– Moritz Klug
Nov 10 at 15:28
Shouldn't be hard to find them by searching things like "ajax upload php"
– charlietfl
Nov 10 at 15:32
Suggest you first learn how to do this using a simple form and do a search for "ajax upload" to learn how to use FormData API in javascript and $_FILES in php
– charlietfl
Nov 10 at 15:14
Suggest you first learn how to do this using a simple form and do a search for "ajax upload" to learn how to use FormData API in javascript and $_FILES in php
– charlietfl
Nov 10 at 15:14
thank you so much for the advice! do you know a good tutorial :)?
– Moritz Klug
Nov 10 at 15:28
thank you so much for the advice! do you know a good tutorial :)?
– Moritz Klug
Nov 10 at 15:28
Shouldn't be hard to find them by searching things like "ajax upload php"
– charlietfl
Nov 10 at 15:32
Shouldn't be hard to find them by searching things like "ajax upload php"
– charlietfl
Nov 10 at 15:32
add a comment |
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
active
oldest
votes
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53240263%2fhow-do-i-use-file-handlers-in-sweetalert%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Suggest you first learn how to do this using a simple form and do a search for "ajax upload" to learn how to use FormData API in javascript and $_FILES in php
– charlietfl
Nov 10 at 15:14
thank you so much for the advice! do you know a good tutorial :)?
– Moritz Klug
Nov 10 at 15:28
Shouldn't be hard to find them by searching things like "ajax upload php"
– charlietfl
Nov 10 at 15:32