web-dev-qa-db-fra.com

Comment puis-je pré-remplir les champs de saisie de formulaire html à partir des paramètres url?

J'ai une page HTML Vanilla qui contient un formulaire. Une exigence est entrée pour pouvoir pré-remplir le formulaire via l'URL. Quelque chose comme:

http://some.site.com/somePage.html?forename=Bob&surname=Jones

Je n'arrive pas à trouver de solution simple à cela. Quelqu'un peut-il m'orienter dans la bonne direction avec du javascript pour accomplir cela? Heureux d'utiliser une solution javascript, mais je préfère éviter de tirer une bibliothèque entière uniquement pour cette seule utilisation (aucune n'est actuellement utilisée). Merci.

htmlformsurlparameters
21
Chris Knight

Utilisez une fonction Javascript de chaîne de requête personnalisée.

function querySt(ji) {

    hu = window.location.search.substring(1);
    gy = hu.split("&");

    for (i=0;i<gy.length;i++) {
        ft = gy[i].split("=");
        if (ft[0] == ji) {
            return ft[1];
        }
    }
}
var koko = querySt("koko");

Attribuez ensuite la valeur récupérée au contrôle d'entrée; quelque chose comme:

document.getElementById('mytxt').value = koko;
23
Ian

Utilisez-vous PHP? Si c'est le cas, cela rend les choses beaucoup plus faciles. En supposant votre lien comme ci-dessus, vous pouvez utiliser:

<?php
$forename = $_GET['forename'];
$surname = $_GET['surname'];
?>
----------
<input id='forename' type='text' value='<?php echo $forename; ?>' >
<input id='surname' type='text' value='<?php echo $surname; ?>' >

Cela devrait être pré-rempli pour vous.

14
paradox870
function getUrlVars()
{
    var vars = [], hash;
    var hashes = window.location.href.slice(window.location.href.indexOf('?') + 1).split('&');

    for(var i = 0; i < hashes.length; i++)
        {
         hash = hashes[i].split('=');
         vars.Push(hash[0]);
         vars[hash[0]] = hash[1];
         }

     return vars;
}

var get = getUrlVars();

//returns get['forename'] == bob; surname == jones
10
Chris Sobolewski