minni.maus
New member
Hallo liebe Forengemeinde,
dies hier ist mein erster Beitrag und ich brauche schon eure Unterstützung bei folgendem Problem:
Ich habe ein Webservice, bei dem man Karten hochladen kann, die dann am Server gespeichert werden.
Bevor das Forumlar mit den erforderlichen Angaben abgeschickt wird, soll der Inhalt überprüft werden, dafür habe ich eine javascript Funktion geschrieben: checkFormular().
Dieses rufe ich beim Forumlar mit onsubmit auf, allerdings wird die Funktion nie aufgerufen, sprich, es wird zurzeit alles hochgeladen.
Anbei mein html code und mein javascript code - ich hoffe ihr könnt mir helfen
Was ich bisher schon versucht habe:
- Seitenquelltext angeschaut (leider nichts genutzt)
- In der Funktion ein einfaches alert reingeschrieben, auch kein Ergebnis
- das onsubmit beim submit Button und/oder bei der Form angegeben.
Liebe Grüße!
Und die JavaScript Funktion:
dies hier ist mein erster Beitrag und ich brauche schon eure Unterstützung bei folgendem Problem:
Ich habe ein Webservice, bei dem man Karten hochladen kann, die dann am Server gespeichert werden.
Bevor das Forumlar mit den erforderlichen Angaben abgeschickt wird, soll der Inhalt überprüft werden, dafür habe ich eine javascript Funktion geschrieben: checkFormular().
Dieses rufe ich beim Forumlar mit onsubmit auf, allerdings wird die Funktion nie aufgerufen, sprich, es wird zurzeit alles hochgeladen.
Anbei mein html code und mein javascript code - ich hoffe ihr könnt mir helfen
Was ich bisher schon versucht habe:
- Seitenquelltext angeschaut (leider nichts genutzt)
- In der Funktion ein einfaches alert reingeschrieben, auch kein Ergebnis
- das onsubmit beim submit Button und/oder bei der Form angegeben.
Liebe Grüße!
HTML:
<?php
session_start();
include "./connection.php"; //braucht die connection.php Datei für die Datenbankverbindung
$dbh = connect(); //Verbindung zur Datenbank aufbauen
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="./checkFormular.js"></script>
<script type="text/javascript" src="./clearBG.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Manage Maps</title>
</head>
<body style="margin:0px; padding:0px;">
<div id="menu" style="height:800px; width:100%; margin:0px;">
<table width="50%" style="width:50%;">
<tr>
<td style="width:15%;" valign="top">
<!------- Für das Menü - Start ------>
<table width="100%" style="padding:10px; background-color:#999;">
<tr>
<td><input type="button" name="submit_mm" value="Manage maps" style="height:100px; width:300px; font-size:12px" onClick="self.location.href='./manage_maps.php'"></td>
<td><input type="button" name="submit_logout" value="Logout" style="height:100px; width:300px; font-size:12px" onClick="self.location.href='./homepage_index.php?logout=true'"></td>
</tr>
</table>
</td>
<td style="width:85%;" valign="top">
<!------- Für das Menü - Ende ------>
<!------- Um eine Karte hochzuladen - Start ------>
<?php
//Wenn noch nicht submit geklickt wurde, soll das Formular angezeigt werden
if(!isset($_GET['add_map']))
{
?>
<table width="50%" style="padding:10px;">
<form name="add_map" action="./manage_maps.php" method="post" accept-charset="ISO-8859-1" onsubmit="return checkFormular();" >
<tr>
<td colspan="2"><h3>Upload new Map</h3></td>
</tr>
<tr>
<td>Title: </td>
<td><input type="text" name="map_title" id="map_title" onClick="clearBG('map_title');"></td>
</tr>
<tr>
<td title="Describe what your map represents">Description: </td>
<td><input type="text" name="description" id="description" onClick="clearBG('description');"></td>
</tr>
<tr>
<td title="Write down some key words your map can be associated with">Tags: </td>
<td><input type="text" name="tags" id="tags" onClick="clearBG('tags');"></td>
</tr>
<tr>
<td>Obj File</td>
<td><input type="file" name="obj_file" id="obj_file" onClick="clearBG('obj_file');"></td>
</tr>
<tr>
<td>Mtl File</td>
<td><input type="file" name="mtl_file" id="mtl_file" onClick="clearBG('mtl_file');"></td>
</tr>
<tr>
<td>Jpg File</td>
<td><input type="file" name="jpg_file" id="jpg_file" onClick="clearBG('jpg_file');"></td>
</tr>
<tr>
<td title="Enter the website, organization, etc. where you got the map from">Image Source</td>
<td><input type="link" name="image_source" id="image_source" onClick="clearBG('image_source');"></td>
</tr>
<tr>
<td> </td>
<td><input type="submit" name="add_map" value="Upload Map"></td>
</tr>
</form>
</table>
<?php
}
?>
<!------- Um eine Karte hochzuladen Ende ------>
<!-- Wenn man auf den Button klickt, soll neuer Tabelleneintrag gespeichert werden in der Datenbank -->
<?php
if(isset($_POST['add_map']))
{
move_uploaded_file($_FILES['obj_file']['tmp_name'],'earthmodels/'.$_FILES['obj_file']['name']);
move_uploaded_file($_FILES['mtl_file']['tmp_name'],'earthmodels/'.$_FILES['mtl_file']['name']);
move_uploaded_file($_FILES['jpg_file']['tmp_name'],'earthmodels/'.$_FILES['jpg_file']['name']);
//Pfade zu den einzelnen Dateien
$path_obj = 'http://'.$_SERVER['HTTP_HOST'].'/earthmodels/'.$_FILES['obj_file']['name'];
$path_mtl = 'http://'.$_SERVER['HTTP_HOST'].'/earthmodels/'.$_FILES['mtl_file']['name'];
$path_jpg = 'http://'.$_SERVER['HTTP_HOST'].'/earthmodels/'.$_FILES['jpg_file']['name'];
//Aktuelles Datum abfragen
$date = date("Y-m-d H:i");
$query = ("INSERT INTO map_final(title,description,tags,upload_date,obj_file,mtl_file,jpg_file,image_source)
VALUES('$_POST[map_title]','$_POST[description]','$_POST[tags]','$date','$path_obj','$path_mtl','$path_jpg','$_POST[image_source]')");
$result = pg_query($query);
if (!$result)
{
echo "Upload of the map did not work!";
}
}
else
{}
?>
</td>
</tr>
</table>
</div>
</body>
</html>Und die JavaScript Funktion:
Code:
function checkFormular()
{
var change_Text = "";
var fl_validInput = true;
var title = document.getElementById("map_title").value;
var description = document.getElementById("description").value;
var tags = document.getElementById("tags").value;
var obj_file = document.getElementById("obj_file").value;
var mtl_file = document.getElementById("mtl_file").value;
var jpg_file = document.getElementById("jpg_file").value;
var image_source = document.getElementById("image_source").value;
if(title == "")
{
document.getElementById("map_title").style.backgroundColor="#CC0000";
change_Text += " - Title of the map\n";
fl_validInput = false;
}
if(description == "")
{
document.getElementById("description").style.backgroundColor="#CC0000";
change_Text += " - Description\n";
fl_validInput = false;
}
if(tags == "")
{
document.getElementById("tags").style.backgroundColor="#CC0000";
change_Text += " - Tags\n";
fl_validInput = false;
}
if(obj_file == "")
{
document.getElementById("obj_file").style.backgroundColor="#CC0000";
change_Text += " - Obj File\n";
fl_validInput = false;
}
if(mtl_file == "")
{
document.getElementById("mtl_file").style.backgroundColor="#CC0000";
change_Text += " - Mtl File\n";
fl_validInput = false;
}
if(jpg_file == "")
{
document.getElementById("jpg_file").style.backgroundColor="#CC0000";
change_Text += " - Jpg File\n";
fl_validInput = false;
}
if(image_source == "")
{
document.getElementById("image_source").style.backgroundColor="#CC0000";
change_Text += " - Image Source\n";
fl_validInput = false;
}
if(!fl_validInput) {
alert("Please check the following fields:\n" + change_Text);
}
return fl_validInput;
}
Zuletzt bearbeitet von einem Moderator:
