<form action=page.php> en javascript

Signaler
-
Messages postés
31121
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 janvier 2021
-
Bonjour à tous,

Je suis en train de mettre en place un formulaire qui demande adresse aux visiteurs.

Je me base sur le script de Google pour empêcher les erreurs de saisie : lien

Le script fonctionne bien, j'arrive à passer les données dans l'URL via un GET mais je n'arrive pas à changer la page via le action="page.php". Auriez vous des idées sur ce qui bloque ? J'ai vu pas mal de script pour faire ça dans des forum mais des que j'ajoute des scripts le script de gmaps ne fonctionne plus

Merci pour vos réponses,

2 réponses

Messages postés
31121
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 janvier 2021
342
Bonjour,

L'attribut ACTION d'une FORM est prise en compte lors d'un SUBMIT .
Tu peux, en javascript, soit faire une redirection en utlisant window.location
soit faire le SUBMIT de ton form via la méthode submit() http://www.w3schools.com/jsref/met_form_submit.asp .... tout dépend de tes besoins.

PS : il est d'usage ici de poster le code qui pose problème (et non de mettre un lien) ... en utilisant la coloration syntaxique:
Explications disponibles ici :
http://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code
Bonjour Jordane54, merci pour ton aide.

Ci-joint le code, permettant de récupérer l'adresse, j'ai testé avec ta solution, cela ne semble pas fonctionner.

Merci,



<!DOCTYPE html>
<html>
<head>
<title>Place Autocomplete Address Form</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<style>
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
</style>
<link type="text/css" rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500">
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&libraries=places"></script>
<script>
// This example displays an address form, using the autocomplete feature
// of the Google Places API to help users fill in the information.

var placeSearch, autocomplete;
var componentForm = {
street_number: 'short_name',
route: 'long_name',
locality: 'long_name',
administrative_area_level_1: 'short_name',
country: 'long_name',
postal_code: 'short_name'
};

function initialize() {
// Create the autocomplete object, restricting the search
// to geographical location types.
autocomplete = new google.maps.places.Autocomplete(
/** @type {HTMLInputElement} */(document.getElementById('autocomplete')),
{ types: ['geocode'] });
// When the user selects an address from the dropdown,
// populate the address fields in the form.
google.maps.event.addListener(autocomplete, 'place_changed', function() {
fillInAddress();
});
}

// [START region_fillform]
function fillInAddress() {
// Get the place details from the autocomplete object.
var place = autocomplete.getPlace();

for (var component in componentForm) {
document.getElementById(component).value = '';
document.getElementById(component).disabled = false;
}

// Get each component of the address from the place details
// and fill the corresponding field on the form.
for (var i = 0; i < place.address_components.length; i++) {
var addressType = place.address_components[i].types[0];
if (componentForm[addressType]) {
var val = place.address_components[i][componentForm[addressType]];
document.getElementById(addressType).value = val;
}
}
}
// [END region_fillform]

// [START region_geolocation]
// Bias the autocomplete object to the user's geographical location,
// as supplied by the browser's 'navigator.geolocation' object.
function geolocate() {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var geolocation = new google.maps.LatLng(
position.coords.latitude, position.coords.longitude);
var circle = new google.maps.Circle({
center: geolocation,
radius: position.coords.accuracy
});
autocomplete.setBounds(circle.getBounds());
});
}
}
// [END region_geolocation]

</script>

<style>
#locationField, #controls {
position: relative;
width: 480px;
}
#autocomplete {
position: absolute;
top: 0px;
left: 0px;
width: 99%;
}
.label {
text-align: right;
font-weight: bold;
width: 100px;
color: #303030;
}
#address {
border: 1px solid #000090;
background-color: #f0f0ff;
width: 480px;
padding-right: 2px;
}
#address td {
font-size: 10pt;
}
.field {
width: 99%;
}
.slimField {
width: 80px;
}
.wideField {
width: 200px;
}
#locationField {
height: 20px;
margin-bottom: 2px;
}
</style>
</head>

<body onload="initialize()">
<div id="locationField">
<input id="autocomplete" placeholder="Enter your address"
type="text"></input>
</div>

<table id="address">
<tr>
<td class="label">Street address</td>
<td class="slimField"><input class="field" id="street_number"
disabled="true"></input></td>
<td class="wideField" colspan="2"><input class="field" id="route"
disabled="true"></input></td>
</tr>
<tr>
<td class="label">City</td>
<td class="wideField" colspan="3"><input class="field" id="locality"
disabled="true"></input></td>
</tr>
<tr>
<td class="label">State</td>
<td class="slimField"><input class="field"
id="administrative_area_level_1" disabled="true"></input></td>
<td class="label">Zip code</td>
<td class="wideField"><input class="field" id="postal_code"
disabled="true"></input></td>
</tr>
<tr>
<td class="label">Country</td>
<td class="wideField" colspan="3"><input class="field"
id="country" disabled="true"></input></td>
</tr>
</table>
</body>
</html>


Messages postés
31121
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 janvier 2021
342

j'ai testé avec ta solution, cela ne semble pas fonctionner.

Et tu as testé laquelle (parmis les deux proposées) ?

Surtout que dans le code que tu nous donnes.. je ne vois nul par une référence à ACTION .. ni même à une URL de type : page.php.......
>
Messages postés
31121
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 janvier 2021

Bonjour, Oui désolé je ne voulais pas mettre mon code (qui ne fonctionne pas) à la suite du code de google qui fonctionne.

Donc j'ai ajouté à la fin du code :


<form method="post" action="page.php">
<input id="street_number" name="street_number" disabled>
<input id="route" name="route" disabled>
<input id="locality" name="locality" disabled>
<input id="country" name="country" disabled>
<INPUT TYPE="submit" NAME="adresse" VALUE=" Envoyer ">
</form>
Messages postés
31121
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 janvier 2021
342 > frou28
Bon.. ça amène d'autres questions... ^^

Tu mets des INPUT ... ok ... mais de quel type ? TEXT ? (il est préférable de le spécifier)
<input type=text" id="street_number" name="street_number" disabled>


Ensuite... tu les mets en DISABLED ... donc non modifiables ... mais où récupères tu les données ?

Après... tu nous parles de VARIABLES GET dans ta question... hors je vois que ton FORM est en POST ..... encore une anomalie....

Et enfin .... Il nous manque ta page page.php .... et surtout .. il faudrait que tu nous expliques CLAIREMENT et en DETAIL ce que tu cherches à faire et/ou à obtenir... car là ce n'est pas très compréhensible....