web-dev-qa-db-fra.com

Comment ajouter un paramètre à l'URL?

Mon URL actuelle est: http://something.com/mobiles.php?brand=samsung

Maintenant, quand un utilisateur clique sur un filtre de prix minimum (disons 300), je veux que mon URL devienne

http://something.com/mobiles.php?brand=samsung&priceMin=300

En d'autres termes, je recherche une fonction javascript qui ajoute un paramètre spécifié à l'URL actuelle, puis redirige la page Web vers la nouvelle URL.

Remarque: Si aucun paramètre n'est défini, la fonction doit ajouter ? au lieu de &.

c'est-à-dire que si l'URL actuelle est http://something.com/mobiles.php, la page doit être redirigée vers http://something.com/mobiles.php?priceMin=300 au lieu de http://something.com/mobiles.php&priceMin=300

phpjavascripturlweb-applications
14
Sumit Gupta

essayez quelque chose comme ça, il faut aussi considérer les cas où vous avez déjà ce paramètre dans l'URL

function addOrUpdateUrlParam(name, value)
{
  var href = window.location.href;
  var regex = new RegExp("[&\\?]" + name + "=");
  if(regex.test(href))
  {
    regex = new RegExp("([&\\?])" + name + "=\\d+");
    window.location.href = href.replace(regex, "$1" + name + "=" + value);
  }
  else
  {
    if(href.indexOf("?") > -1)
      window.location.href = href + "&" + name + "=" + value;
    else
      window.location.href = href + "?" + name + "=" + value;
  }
}

alors vous l'invoquez comme dans votre cas:

addOrUpdateUrlParam('priceMin', 300);
16
petho

En réalité, ceci est totalement trivial, car l’objet de localisation javascript en traite déjà. Encapsulez simplement cette ligne dans une fonction pour la réutiliser avec des liens, etc.:

<script>
    function addParam(v) {
        window.location.search += '&' + v;
    }
</script>

<a href="javascript:addParam('priceMin=300');">add priceMin=300</a>

Il n'est pas nécessaire de vérifier ? car il s'agit déjà de la partie search et il vous suffit d'ajouter le paramètre.

Si vous ne voulez même pas utiliser une fonction, vous pouvez écrire comme ceci:

<a href="javascript:location.search+='&priceMin=300';">add priceMin=300</a>

N'oubliez pas que cela répond exactement à ce que vous avez demandé: ajouter ce paramètre spécifique. Il peut déjà faire partie de la partie search car vous pouvez avoir le même paramètre plusieurs fois dans un URI. Vous voudrez peut-être normaliser cela dans votre application, mais c'est un autre domaine. Je centraliserais la normalisation d'URL dans une fonction qui lui est propre.

Modifier:

Au cours de la discussion sur la réponse acceptée ci-dessus, il est apparu clairement que les conditions suivantes devaient être remplies pour obtenir une fonction fonctionnelle:

  • si le paramètre existe déjà, il devrait être changé.
  • si le paramètre existe déjà plusieurs fois, seule la copie modifiée doit survivre.
  • si le paramètre existe déjà mais n'a pas de valeur, la valeur doit être définie.

Comme search fournit déjà la chaîne de recherche, il ne reste plus qu'à analyser cette partie requête-info dans les paires nom/valeur, modifier ou ajouter le nom et la valeur manquants, puis les rajouter à search:

<script>
    function setParam(name, value) {
        var l = window.location;

        /* build params */
        var params = {};        
        var x = /(?:\??)([^=&?]+)=?([^&?]*)/g;        
        var s = l.search;
        for(var r = x.exec(s); r; r = x.exec(s))
        {
            r[1] = decodeURIComponent(r[1]);
            if (!r[2]) r[2] = '%%';
            params[r[1]] = r[2];
        }

        /* set param */
        params[name] = encodeURIComponent(value);

        /* build search */
        var search = [];
        for(var i in params)
        {
            var p = encodeURIComponent(i);
            var v = params[i];
            if (v != '%%') p += '=' + v;
            search.Push(p);
        }
        search = search.join('&');

        /* execute search */
        l.search = search;
    }
</script>

<a href="javascript:setParam('priceMin', 300);">add priceMin=300</a>

C'est au moins un peu plus robuste car il peut gérer des URL comme celles-ci:

test.html?a?b&c&test=foo&priceMin=300

Ou même:

test.html?a?b&c&test=foo&pri%63eMin=300

De plus, le nom et la valeur ajoutés sont toujours correctement codés. Cela pourrait échouer si un nom de paramètre entraînait une étiquette illégale de propriété js.

15
hakre
if(location.search === "") {
    location.href = location.href + "?priceMin=300";
} else {
    location.href = location.href + "&priceMin=300";
}

Dans le cas location.search === "", alors il n'y a pas de pièce ?.

Ajoutez donc ?newpart pour qu’il devienne .php?newpart.

Sinon, il existe déjà une partie ?.

Ajoutez donc &newpart pour qu’il devienne .php?existingpart&newpart.

Grâce à hakre, vous pouvez également le configurer simplement comme:

location.search += "&newpart";

Il ajoutera automatiquement ? si nécessaire (s'il n'est pas apparent, cela le fera ?&newpart de cette façon, mais cela ne devrait pas avoir d'importance).

5
pimvdb

Je réécris le corriger répondre en PHP:

function addOrUpdateUrlParam($name, $value){
$href = $_SERVER['REQUEST_URI'];
$regex = '/[&\\?]' . $name . "=/";
if(preg_match($regex, $href)){
    $regex = '([&\\?])'.$name.'=\\d+';
    $link = preg_replace($regex, "$1" . $name . "=" . $value, $href);
}else{
    if(strpos($href, '?')!=false){
        $link = $href . "&" . $name . "=" . $value;
    }else{
        $link = $href . "?" . $name . "=" . $value;
    }
}
return $link;
}

J'espère que cela aide quelqu'un...

2
Leon Bauer
var applyMinPrice = function(minPrice) {
    var existingParams = (location.href.indexOf('?') !== -1),
        separator = existingParams ? '&' : '?',
        newParams = separator + 'priceMin=' + minPrice;

    location.href += newParams;
}
1
Martin

utilisez var urlString = window.location pour obtenir l'URL

vérifiez si l'URL contient déjà un '?' avec urlString.indexOf('?'), -1 signifie qu'il n'existe pas.

régler window.location pour rediriger

c'est comme 101 de javascript. essayez des moteurs de recherche!

0
zeal
<FORM action="" method="get">
<P>
<LABEL for="brand">Brand: </LABEL>
          <INPUT type="text" id="brand"><BR>
<LABEL for="priceMin">Minimum Price: </LABEL>
          <INPUT type="text" id="priceMin"><BR>
</P>

0
Sherif elKhatib
<html>
<body>
..
..
..

<?php
$priceMinValue= addslashes ( $_GET['priceMin']);
if (!empty($priceMin)) {
        $link = "currentpage.php?priceMin=". $priceMinValue;
        die("<script>location.href = '".$link. "'</script>");    
}
?>
</body>
</html>
0
Suresh

Si vous demandez à l'utilisateur de renseigner un champ de texte avec un prix minimal, pourquoi ne pas laisser le formulaire se soumettre sous la forme d'une demande GET avec une action vide? IIRC, cela devrait faire exactement ce que vous voulez, sans javascript. 

0
bjelleklang