Hallo Leute, ich bin neu hier und brauche mal eure Hilfe.
Ich möchte gerne eine kleine Seite mit einem dropzone Formular erstellen.
Das ist soweit einfach
Was soll die Seite machen:
Man soll dort ganz bestimmte Bilder in die Dropzone ziehen oder in ein Inputfeld einfügen.
Dann soll die Seite gucken ob es die URL gibt und wenn die URL vorhanden ist dann soll das Bild(URL) und der Name in der Dropzone ausgegeben werden.
Wenn die URL nicht richtig ist, dann soll eine Fehlermeldung kommen. Ausgabe in der Dropzone: Das ist kein gültiger Link.
Es soll kein Bild wirklich hochgeladen werden !
Meine Idee für eine Datenbank (SQL, XML oder Text) wäre:
ID, NR, NAME, URL1, URL2
1, 1, Monstername, https://www.tutorials.de/styles/tuts/xenforo/logo.png, https://www.tutorials.de/styles/tuts/xenforo/logo.png
Leider weiss ich nicht wie ich das anstellen soll, damit die Seite die URL prüft und wie man dann die Ausgabe steuert.
Ich bin nicht der große Programmierer, aber ich bin echt bemüht.
Die Google Suche hat nicht viel gebracht, also ich habe zu dem Thema leider nichts gefunden was mir geholfen hat.
Ich wäre echt dankbar wenn mir da einer helfen würde.
Vielen Dank !
Mein bisheriger code:
Ich möchte gerne eine kleine Seite mit einem dropzone Formular erstellen.
Das ist soweit einfach

Was soll die Seite machen:
Man soll dort ganz bestimmte Bilder in die Dropzone ziehen oder in ein Inputfeld einfügen.
Dann soll die Seite gucken ob es die URL gibt und wenn die URL vorhanden ist dann soll das Bild(URL) und der Name in der Dropzone ausgegeben werden.
Wenn die URL nicht richtig ist, dann soll eine Fehlermeldung kommen. Ausgabe in der Dropzone: Das ist kein gültiger Link.
Es soll kein Bild wirklich hochgeladen werden !
Meine Idee für eine Datenbank (SQL, XML oder Text) wäre:
ID, NR, NAME, URL1, URL2
1, 1, Monstername, https://www.tutorials.de/styles/tuts/xenforo/logo.png, https://www.tutorials.de/styles/tuts/xenforo/logo.png
Leider weiss ich nicht wie ich das anstellen soll, damit die Seite die URL prüft und wie man dann die Ausgabe steuert.
Ich bin nicht der große Programmierer, aber ich bin echt bemüht.
Die Google Suche hat nicht viel gebracht, also ich habe zu dem Thema leider nichts gefunden was mir geholfen hat.
Ich wäre echt dankbar wenn mir da einer helfen würde.
Vielen Dank !
Mein bisheriger code:
HTML:
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="css/bootstrap.css">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/dropzone.css" />
<title>dropzone</title>
</head>
<body>
<div class="container" style="position: relative;z-index: 20;">
<div class="row">
<div class="col-md-12 col-sm-12">
<div class="container">
<div class="row">
<div class="col-md-12 col-sm-12 " style="margin-top:20px;">
<div id="dropzone">
<span>Drag & Drop the Image here</span><br style="clear:both;">
<img id="result" src="css/drop-and-drag.png" height="265px">
<input type="hidden" id="resulthidden">
<span id="result2"></span>
<div style="height: 43px;" id="showresult"></div>
<input type="text" id="urlpaste" placeholder="or drag & drop the url here" name="urlpaste" maxlength="0">
</div>
</div>
<br style="clear:both;">
</div>
</div>
</div>
</div>
</div>
<script src="css/jquery-1.7.1.js"></script>
<script src="css/bootstrap.js"></script>
<script type="text/javascript" src="css/dropzone.js"></script>
<script type="text/javascript">
$(function(){
jQuery.event.props.push('dataTransfer');
$('#dropzone')
.bind( 'dragenter dragover', false)
.bind( 'drop', function( e ) {
e.stopPropagation();
e.preventDefault();
$('#showresult').html(e.dataTransfer.getData('text'));
});
});
</script>
</body></html>