so the question is the title pls help me, I’m working on this for several days now and this shit won’t work
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="../CSS/homepage.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="../pics/logow.png">
<meta charset="utf-8">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- Google Maps JavaScript library -->
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places&key=AIzaSyCqaoXSj1ISkOCYjiR6To8eBBJ_F2Cvsvg"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<title>Taxi-Discovery</title>
</head>
<body>
<header>
<div id="logo">
<img src="../pics/logo.png" alt="logo">
</div>
<nav id="nav">
<ul>
<li><a href="#Home" onclick="document.getElementById('home').scrollIntoView();">Home</a></li>
<li><a href="#Auftrag" onclick="document.getElementById('auftrag').scrollIntoView();">Auftrag</a></li>
<li><a href="#Über Mich" onclick="document.getElementById('überMich').scrollIntoView();">Über Mich</a></li>
</ul>
</nav>
</header>
<section id="home">
<hr>
<h1>Taxi-Discovery</h1>
<p>Sie brauchen ein Taxi? Kein problem! Geben sie jtzt einen Auftrag auf</p> <br>
<button type="submit" onclick="document.getElementById('auftrag').scrollIntoView();">Auftrag aufgeben</a></button>
</section>
<section id="auftrag">
<hr>
<h3>Auftrag</h3>
<button type="button" class="toggle-btn" class="inputText" onclick="show1()">Hin</button>
<button type="button" class="toggle-btn" class="inputText" onclick="show2()" >Hin & zurück</button><br>
<div>
<div id="div1">
<form method="post" >
<select name="Personen" class="inputText" id="option" required>
<option disabled="" selected="true" value="">Wie viele Personen?</option>
<option>1 Person</option>
<option>2 Personen</option>
<option>3 Personen</option>
<option>4 Personen</option>
</select> <br>
<input type="name" required="" class="inputText" id="name" name="name" placeholder="Name"> <br>
<input type="text" required="" class="inputText" id="search_input" name="o" placeholder="Abholort"> <br>
<input type="text" required="" class="inputText" id="search_inputzwei" name="d" placeholder="Wunschort"><br>
<input type="text" name="book" required="" id="datum" class="inputText" placeholder="Datum" onfocus="(this.type='datetime-local')"><br>
<input type="text" name="" placeholder="Flug-Nr (optional)" class="inputText">
<textarea name="wünsche" placeholder="Wünsche?" maxlength="100" id="wünsche"></textarea><br>
<input type="submit" class="submit" name="submit" placeholder="senden"><br>
</form>
</div>
<div id="div2">
<form >
<select name="Personen" class="inputText" id="option" required>
<option disabled="" selected="true" value="">Wie viele Personen?</option>
<option>1 Person</option>
<option>2 Personen</option>
<option>3 Personen</option>
<option>4 Personen</option>
</select> <br>
<input type="name" required="" class="inputText" id="name" name="name" placeholder="Name"> <br>
<input type="text" required="" class="inputText" id="search_inputdemo" placeholder="Abholort"> <br>
<input type="text" required="" class="inputText" id="search_inputzweidemo" placeholder="Wunschort"><br>
<input type="text" name="book" required="" id="datum" class="inputText" placeholder="Hin-Datum" onfocus="(this.type='datetime-local')"><br>
<input type="text" name="book" required="" id="datum" class="inputText" placeholder="Zurück-Datum" onfocus="(this.type='datetime-local')"><br>
<input type="text" name="" placeholder="Flug-Nr (optional)" class="inputText">
<textarea name="wünsche" placeholder="Wünsche?" maxlength="100" id="wünsche"></textarea><br>
<input type="submit" class="submit" name="submit" placeholder="senden"><br>
</form>
</div>
<p>Sie wollen den Preis erfahren?</p>
<input type="text" name="km" id="km" placeholder="geben sie die Kilometer ein" class="inputText"><br>
<input type="text" name="preis" readonly="" class="inputText" id="preis" placeholder="preis"><br>
<button id="preisA" onclick="getRoute()" class="toggle-btn">Preis ausrechnen!</button>
</div>
</section>
<section id="überMich">
<hr>
<h3>Über Mich</h3>
<p>Ich bin der Discovery Sport Taxifahrer Recep Ipek. Meine Firma wurde 2013 neugegründet und seitdem verrichte ich meine Arbeit in Innsbruck. Meine Ziele sind vor allem Pünktlichkeit und Zufriedenheit der Kunden!</p>
<div>
<img src="../pics/1.png" class="bilder" height="200px" width="auto">
<img src="../pics/2.png" class="bilder" height="200px" height="200px" width="auto">
<img src="../pics/3.png" class="bilder" height="200px" height="200px" width="auto">
</div>
</section>
<footer>
<p>© 2013-2022 Taxi Discovery!</p>
</footer>
<script>
function show1() {
document.getElementById('div1').style.display = "block";
document.getElementById('div2').style.display = "none";
}
function show2() {
document.getElementById('div2').style.display = "block";
document.getElementById('div1').style.display = "none";
}
var today = new Date().toISOString().slice(0, 16);
document.getElementsByName("book")[0].min = today
document.getElementsByName("book")[1].min = today
document.getElementsByName("book")[2].min = today
var autocomplete1 = new google.maps.places.Autocomplete(document.getElementById("search_input"),
{
componentRestrictions: {'country' : ['AT']},
fields: ['geometry', 'name'],
types: ['establishment', 'geocode']
})
var autocomplete2 = new google.maps.places.Autocomplete(document.getElementById("search_inputzwei"),
{
componentRestrictions: {'country' : ['AT']},
fields: ['geometry', 'name'],
types: ['establishment', 'geocode']
})
var autocomplete = new google.maps.places.Autocomplete(document.getElementById("search_inputdemo"),
{
componentRestrictions: {'country' : ['AT']},
fields: ['geometry', 'name'],
types: ['establishment', 'geocode']
})
var autocomplete2 = new google.maps.places.Autocomplete(document.getElementById("search_inputzweidemo"),
{
componentRestrictions: {'country' : ['AT']},
fields: ['geometry', 'name'],
types: ['establishment', 'geocode']
})
var directionsService = new google.maps.DirectionsService();
var request = {
origin : document.getElementById('search_input').value, // a city, full address, landmark etc
destination : document.getElementById('search_inputzwei').value,
travelMode : google.maps.DirectionsTravelMode.DRIVING
};
function getRoute(){
directionsService.route(request, function(response, status) {
if ( status == google.maps.DirectionsStatus.OK ) {
document.getElementById('preis').value = Math.round(response.routes[0].legs[0].distance.value / 1000 * 2) // the distance in metres
}
else {
// oops, there's no route between these two locations
// every time this happens, a kitten dies
// so please, ensure your address is formatted properly
}
});
}
document.getElementById('km').value * 1,9
function preis() {
if (document.getElementById('km').value.includes(",")) {
var x = document.getElementById('km').value
x = x.replace(/,/g, '.')
document.getElementById('preis').value = x * 1.9 + "€"
}
else {
document.getElementById('preis').value=document.getElementById('km').value * 1.9 + "€"
}
}
</script>
</body>
</html>so there is my whole html code so you won’t miss something, and i know it’s messy but i never worked with javascript before so it’s like my first time. I want to get the value of the fields search_input and search_inputzwei which are autocomplete fields.