JavaScript - Comment puis-je ouvrir une nouvelle page et de passer des données JSON?

J'ai une page de recherche.jsp. Lorsque l'utilisateur sélectionne un dossier et l'appuie sur la touche edit, j'aimerais ouvrir une nouvelle page (dans la même fenêtre) avec les données de l'enregistrement (qui est stocké dans un objet json et transmis à la nouvelle page). Comment puis-je utiliser Javascript (jQuery) pour ouvrir une nouvelle page et de passer les données JSON?

Merci à tous pour les réponses. Les pages sont sur le même domaine. Je m'excuse pour ne pas faire que dans le post original.

OriginalL'auteur James | 2012-12-06

2

Si les deux pages sont sur le même domaine, une troisième façon est d'utiliser HTML5 localStorage: http://diveintohtml5.info/storage.html

En fait localStorage est justement prévu pour ce que vous voulez. Traiter avec OBTENIR params ou de la fenêtre du document ou de la JS références n'est pas très portable (même si, je le sais, tous les navigateurs ne prennent pas en charge localStorage).

J'ai pensé local de stockage a été limitée par le domaine d'une certaine manière (bien que je ne me souviens pas des détails)? Après tout, vous ne voulez pas malicious.website.com accéder à la localStorage qui a été définie par your.bank.com droit?
Vous avez tout à fait raison. La question a été posée dans un sens, je pensais que les deux pages seraient sur le même domaine. Modifié la réponse avec la précision. Et j'ai trouvé les autres solutions un peu moche..
Oui, les deux pages sont sur le même domaine si cela fonctionne bien. Je dois juste faire attention à effacer le stockage après utilisation.

OriginalL'auteur Ulflander
2

En supposant que les deux pages sont sur le même domaine, vous pouvez utiliser le retour de l'objet créé par la fenêtre.open (), d'accès (et de modifier) l'objet de la fenêtre d'une fenêtre nouvellement ouverte.

Je dois garder la nouvelle page dans la même fenêtre (la fenêtre.open('modifier.jsp', '_self')), Comment puis-je manipuler la page d'édition de la fenêtre d'objet à partir de la page de recherche lors de la recherche page n'existe plus?
pouvez-vous donner un bout de code qui peut décrire de plus votre réponse

OriginalL'auteur Jack
2

Hmm, par exemple, vous avez un objet
```
var dataObject = {
    param  : 'param',
    param2 : 'param2'
};
```
Vous pouvez le traduire dans la chaîne, à l'aide de JSON.stringify méthode
```
var dataObjectString = JSON.stringify(dataObject);
```
Alors vous devriez utiliser l'encodage Base64 pour encoder les données (base64 encode/décode méthodes peuvent être facilement trouvés dans les moteurs de recherche)
```
var dataObjectBase64 = base64encode(dataObjectString);
```
Vous obtiendrez quelque chose comme ceci
```
e3BhcmFtIDogJ3BhcmFtJyxwYXJhbTIgOiAncGFyYW0yJ307
```
Ensuite, vous pouvez passer cette chaîne de caractères comme paramètre:
```
iframe src="http://page.com/?data=e3BhcmFtIDogJ3BhcmFtJyxwYXJhbTIgOiAncGFyYW0yJ307"
```
Enfin, à l'inverse des actions sur la page chargée.

OriginalL'auteur bonbonez

Vous pouvez créer "à la volée" un formulaire avec un hidden/de la saisie de texte valeur de celle-ci contiendra la valeur json, vous pouvez ensuite soumettre ce formulaire via javascript.

Quelque chose comme ça...

Im en utilisant JQUERY ET le trait de SOULIGNEMENT(pour le modèle objet)

c'est le modèle

<form method='<%= method %>' action="<%= action %>" name="<%= name %>" id="<%= id %>" target="_blank">
    <input type='hidden' name='json' id='<%= valueId %>' />
</form>

vous pouvez ensuite publier l'utiliser sur javascript

function makePost(){
    var _t = _.template("use the template here");              
    var o = {
            method : "POST",
            action :"someurl.php",
            name : "_virtual_form",
            id : "_virtual_form_id",
            valueId : "_virtual_value"
        }

    var form = _t(o); //cast the object on the template
            //you can append the form into a element or do it in memory                   
    $(".warp").append(form);        

            //stringify you json        
        $("#_virtual_value").val(JSON.stringify(json)); 
        $("#_virtual_form_id").submit();
        $("#_virtual_form_id").remove();                        
}

maintenant, vous n'avez pas à vous soucier de la longueur de vous json ou du nombre de variables à envoyer.

meilleur!

Merci pour la réponse. Je crois que la solution de stockage local (proposé par Ulflander) pourrait être un peu plus simple puisque les deux pages sont sur le même domaine.
Eh bien, ce est un crossbrowser solution tout en Ulflander pas, mais vous avez droit à sa réponse est beaucoup plus simple cause est juste de prendre avantage des nouvelles fonctionnalités de html5. Et bien sûr, comme vous le dites, cette solution peut vous aider lors de vos pages sont dans des domaines différents. les meilleures ...

OriginalL'auteur ncubica

1

Si le JSON est assez petit, vous pouvez simplement l'inclure comme un paramètre GET à l'URL lorsque vous ouvrez une nouvelle fenêtre.

Quelque chose comme:
```
window.open(yourUrl + '?json=' + serializedJson)
```
Mais j'aime Jack la réponse de mieux; pas de JSON limites de longueur et de pas de géant gâchis de JSON dans l'URL que l'utilisateur peut voir.
Récemment, j'ai couru dans cette déclaration, "si JSON est assez petit" Comment est suffisamment Petite et quelles en sont les limites?
stackoverflow.com/questions/2659952/...

OriginalL'auteur machineghost

Voici quelques très simple JavaScript (pas de HTML, pas de jQuery), qui convertit un objet en JSON et l'envoie vers une autre page:

/*
    submit JSON as 'post' to a new page
    Parameters:
    path        (URL)   path to the new page
    data        (obj)   object to be converted to JSON and passed
    postName    (str)   name of the POST parameter to send the JSON
*/
function submitJSON( path, data, postName ) {
    //convert data to JSON
    var dataJSON = JSON.stringify(data);

    //create the form
    var form = document.createElement('form');
    form.setAttribute('method', 'post');
    form.setAttribute('action', path);

    //create hidden input containing JSON and add to form
    var hiddenField = document.createElement("input");
    hiddenField.setAttribute("type", "hidden");
    hiddenField.setAttribute("name", postName);
    hiddenField.setAttribute("value", dataJSON);
    form.appendChild(hiddenField);

    //add form to body and submit
    document.body.appendChild(form);
    form.submit();
}

Utiliser PHP comme ceci sur la page cible pour obtenir le JSON:

$postVarsJSON = $_POST['myPostName'];
$postVars = json_decode( $postVarsJSON );

Ou, plus simplement pour JavaScript:

var postVars = JSON.parse( <?php $_POST['myPostName']; ?> );

OriginalL'auteur terrymorse

Assumer si vos données json
var data={"name":"abc"};

La page qui envoie les données JSON devriez avoir le code suivant dans la balise script.

                $.getJSON( "myData.json", function( obj ) {
                console.log(obj);
                for(var j=0;j

<obj.length;j++){
                tData[j]=obj;
                //Passing JSON data in URL
                tData[j]=JSON.stringify(tData[j]);
                strTData[j]=encodeURIComponent(tData[j]);
                //End of Passing JSON data in URL
                tr = $('\


    <tr/>
                    ');
                    //Send the json data as url parameter
                    tr.append("


    <td>" + "

        <a href=\"fetchJSON.html?jsonDATA="+strTData[j]+"\" target=\"_blank\">" +Click here+ "</a>" + "

    </td>
                    ");                 
                    }
                    });

La page qui reçoit les données JSON devrait avoir le code.

<html>
                    <head></head>
                    <script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.js"></script>
                    <body>
                        <p id="id"></p>
                    </body>
                    <script type="text/javascript">
                            function getQuery() {
                                          var s=window.location.search;
                                          var reg = /([^?&=]*)=([^&]*)/g;
                                          var q = {};
                                          var i = null;
                                          while(i=reg.exec(s)) {
                                            q[i[1]] = decodeURIComponent(i[2]);
                                          }
                                          return q;
                            }
                                        var q = getQuery();
                                        try {
                                          var data = JSON.parse(q.jsonDATA);
                                          var name=data.name;
                                          console.log(name);
                                        document.getElementById("id").innerHTML=name;
                                        } catch (err) {
                                          alert(err + "\nJSON=" + q.team);
                                        }

                            </script>
                </html>

OriginalL'auteur immanual

Vous devez vous connecter pour publier un commentaire.