garder les cases cochées après rafraichissement de la page

J'ai un couple de cases à cocher. lorsque l'un quelconque d'entre eux sont clickd/vérifié et à la recherche de bouton est cliqué, va récupérer leurs valeurs et de passer à l'url dans la chaîne de recherche et d'actualisation de la page de retour des résultats qui correspondent à la requête des valeurs.
comme ceci: mysite.com/result.aspx?k="Hôpital" ou "Bureau" OU "d'Urgence"

Je suis en mesure de saisir les valeurs après 'k='. J'ai "l'Hôpital" OU "Bureau" OU "d'Urgence" capturée et stockée dans une variable. Maintenant, j'ai besoin de réinitialiser l'état coché des cases à cocher sur la base de ces valeurs après le rechargement de la page et oublie le précédent état des contrôles. Je ne pouvais pas aller plus loin que cela. Quelqu'un peut-il m'aider?

  var checkedOnes=decodeURI(location.href.match(/\&k\=(.+)/)[1]);
        if (value.length == 2) {
            $('input[name="LocType"][value="' + value[1] + '"]').prop('checked', true);
        }

C'est comment je suis capturer les cases de valeurs et de passer à l'URL:

var checkboxValues = $("input[name=LocType]:checked").map(function() {
        return "\"" + $(this).val() + "\"";}).get().join(" OR ");

    window.location= url+checkboxValues;
    <div class="LocTypeChkBoxesSearch">
    <div class="LocTypeChkBoxes">
        <input name="LocType" type="checkbox" value="Hospital"/>HOSPITALS&#160;&#160;
        <input name="LocType" type="checkbox"  value="Office"/>  PHYSICIAN OFFICES&#160;&#160;
        <input name="LocType" type="checkbox"  value="Emergency"/>EMERGENCY CENTERS&#160;&#160;
        <input name="LocType" type="checkbox"  value="Out-Patient"/>OUT-PATIENT CENTERS&#160;&#160;
        <input name="LocType" type="checkbox" value="Facility"/>FACILITIES
    </div>
    <div class="searchBtnHolder"><a class="searchButton" href="#" type="submit" ><span>GO</span></a></div>
</div>
avez-vous envisagé d'utiliser localStorage ?
pas tous les navigateurs ne supportent html5 encore??!!
Vérifier sur les cookies, vous allez avoir à économiser de quelque part, il me semble, et puisque vous indiquer côté serveur, la session n'est pas une option, il me semble.

OriginalL'auteur Anjana Sharma | 2012-02-27

  1. 1

    J'ai rencontrés le même problème, et ma solution est le Stockage Local HTML5.
    Ajouter une fonction pour colect cases à cocher valeurs

    function(){
var data = $('input[name=checkboxName]:checked').map(function(){
        return this.value;
    }).get();
    localStorage['data']=JSON.stringify(data);
}

    Et onload de fonction pour vérifier les cases à cocher

    function(){
    if(localStorage&&localStorage["data"]){
        var localStoredData=JSON.parse(localStorage["data"]);
        var checkboxes=document.getElementsByName('checkboxName');
        for(var i=0;i<checkboxes.length;i++){
            for(var j=0;j<localStoredData.length;j++){
                if(checkboxes[i].value==localStoredData[j]){
                    checkboxes[i].checked=true;
                }
            }
        }
        localStorage.removeItem('data');
    }
}

    Cela fonctionne bien pour moi.

    OriginalL'auteur Braggae

  2. 0

    Vous ne devriez pas besoin de JavaScript pour cela. Vous pouvez vérifier le $_GET paramètres dans votre code, et de servir de la page avec le formulaire adéquat attributs de l'élément.

    En PHP, par exemple:

    <input name="LocType" type="checkbox" value="Facility" <?php if (isset($_GET['LocType'] && $_GET['LocType'] == 'Facility') { ?> checked="checked" <?php } ?> /> FACILITIES
    pas de back-end de l'accès côté client...

    OriginalL'auteur Jacob S

  3. 0

    De l'essayer.

    //Split the url parameter value and get all the values in an array
var checkedOnes = decodeURI(location.href.match(/\&k\=(.+)/)[1]).split(" OR ");

//Find all the checkbox with name="LocType" and cache them in local variable
var $checkBoxes = $('input[name=LocType]');

//Loop through the array and find the corresponding checkbox element using filter
$.each(checkedOnes, function(i, val){
    $checkBoxes.filter('value=[' + $.trim(val.replace(/\"/g, '')) +']').prop('checked', true);
});

    Je suis le fractionnement de la valeur de k par OR qui vous donnera toutes les valeurs dans un tableau. Ensuite, parcourir le tableau et de trouver la case à cocher correspondante par la correspondance de sa valeur d'attribut et de définir sa checked propriété true à l'aide de prop méthode.

    Comment est-ce que ça va obtenir toutes les cases sauf si vous disposez de cette variable à l'intérieur d'un "chacun"?var $cases = $('input[name=LocType]');
    Vous n'avez pas à garder à l'intérieur de each boucle. La raison je l'ai gardé à l'extérieur et mis en cache le résultat dans une variable pour éviter de trouver toutes les cases à cocher de nouveau et de nouveau dans la boucle.
    Cette logique doit être à l'intérieur du document.prêt() ??Sa ne fonctionne pas. Je sais que je suis proche.. 🙁
    Pouvez-vous vérifier quelle est la valeur de checkedOnes avant l'exécution de la each boucle?
    Assurez-vous que vous exécutez ce code à l'intérieur de $(document).ready(function(){..}) de sorte que les éléments sont disponibles avant d'essayer de les trouver et de les mettre checked.

    OriginalL'auteur ShankarSangoli