How can I get access to value of a field in a HTML page inside other pages

Question

My problem is that I want to take the value of a text field from one HTML page to another one.

According to the following code, at the first page, I can get the value of the sms_name text field by using onclick attribute. But I can not get access to that at the other page.

I used many solutions but no success until now.

HTML file #1:

<div style="width:100%;height:34%;;margin-top:20%" >
    <div class="message-onclick"  onclick="
        var sms_name= document.getElementById('recepient-name').value;
        alert(sms_name);
    "> </div>
</div>

HTML file #2:

<div class="log-divs" style="height:7%;border:1px solid red" onclick="
    alert(sms_name); ">
</div>

Use [cookie](https://developer.mozilla.org/en-US/docs/Web/API/document.cookie) or [localStorage](https://developer.mozilla.org/en-US/docs/Web/Guide/DOM/Storage) — Hashem Qolami, Jul 18 '13 at 08:18
Why dont you use a POST or a GET HTTP request on Submit form??? — Lulzim, Jul 18 '13 at 08:23
Well.. Does his host allows a server side technology which can handle the POST request ? :) — DarkBee, Jul 18 '13 at 08:27

score 0 · Answer 1 · edited May 23 '17 at 10:32

You'll need to add the jQuery library to the header of the page sending. Then, just add the codes below to the headers of each page accordingly (on the page sending, after the jQuery library).

Page sending:

<script type="text/javascript">
    var sms_name = $("#recepient-name").val();

    $.ajax({
        type: "GET",
        url: "your-other-page.html",
        data: { 
            sms_name: sms_name 
        }
    });
</script>

Page receiving:

<script type="text/javascript">
    var urlParams;

    (window.onpopstate = function () {
        var match,
            pl     = /\+/g,  // Regex for replacing addition symbol with a space
            search = /([^&=]+)=?([^&]*)/g,
            decode = function (s) { return decodeURIComponent(s.replace(pl, " ")); },
            query  = window.location.search.substring(1);

        urlParams = {};
        while (match = search.exec(query))
           urlParams[decode(match[1])] = decode(match[2]);
    })();

    alert(urlParams["sms_name"]);
</script>

Based on this post: How can I get query string values in JavaScript?

score 0 · Accepted Answer · answered Jul 18 '13 at 08:45

If your really want to do this using javascript only, you don't need any particular js library, just pass the value to your second page using a get parameter:

In your first file:

window.location.href = 'secondfile.html?sms_name=' + sms_name;

In your second file:

var param = 'sms_name';

// get the position of your parameter in the url

var paramIndex = window.location.href.indexOf(param + '=')

  , value = window.location.href.substr(paramIndex + param.length);

// find where your value ends

var valueEndIndex = value.indexOf('&');

// if other params follow, take them off

if (valueEndIndex !== -1) value = value.substr(0, valueEndIndex);

// that should do it

alert(value);

look , ur code need some fixing , when i do ur code , it is work but the proplem is he took me to the other page , i dont need that , i hope to give me guide — OSAMA NADER, Jul 18 '13 at 09:19
or look , it is work , can u give me how to send two parameters , not just sms_name , another sms_number — OSAMA NADER, Jul 18 '13 at 09:22

How can I get access to value of a field in a HTML page inside other pages

2 Answers2