Passing input values between pages.

I've been referred here from the HTML forum as I'm told the answer lies in javascript.

I'm sure this should be simple enough but I'm really struggling to get my mind around this. I don't have access to a server but am developing a site and I need to pass information from input boxes on one form to a paragraph of text on another.

The simplest example I could think of would be a first page with input boxes for Title and Surname, The pages will be within the same browser session and I would like it to all be client side.

[HTML]<head>

<title>Test</title>

<table>

<tr>
<td>Title:</td>
<td><p>
<input name="Title" type="text" id="Title" size="20" maxlength="4">
</p> </td>
</tr>
<tr>

<td>Surname:</td>
<td><input name="Surname" type="Text" id="Surname" size="35" maxlength="50"></td>
</tr>

<td><input name="Reset" type="Reset"
value="Clear Form" />
<a href="Test_Page2.html">Next</a>
</body>
</html>
[/HTML]

and a second page which would then show the values in text.

[HTML]<head>

<title>Untitled Document</title>
</head>

<body>
Hello
</body>

</html>
[/HTML]
So if I open the first page and put in Mr and Smith the second page reads "Hello Mr Smith"

What would the javascipt be on the two pages in the example above?

Thanks.

Sep 2 '07 #1

Subscribe Post Reply

5626

gits

5,390

Expert Mod 4TB

hi ...

let me give you an idea:

you may append your values to the url you want to call ... so that the url looks like:

Expand|Select|Wrap|Line Numbers

'Test_Page2.html?value1=val1&value2=val2'

now on page 2 you use:

Expand|Select|Wrap|Line Numbers

var url = window.location;

to retrieve the url and now you have to parse it to get the value out of it. you may use a regEx or js builtin stringoperations for that.

are you familiar with javascript? try something and then post back if you have more questions.

kind regards

Sep 2 '07 #2

DLP35

No, i'm not used to Javascript and only just getting used to the HTML that web editors create. If I was doing this in MS Access using forms and VB I would be OK to muddle through.

I know there are a lot of examples on the net but they seem complicated and I'm just not "getting it"! Can we take it a step at a time?

Are you saying I change the link A href code to something like:

[HTML]<a href="Test_Page2.html?Title=val1&Surname=val2">Nex t</a>[/HTML]

which carries forward a querystring on the url on the second page - although with the above it contains the text of "Title" and "Suraname" and not the values of Mr & Smith.

Sep 2 '07 #3

gits

5,390

Expert Mod 4TB

exactly :) ... now we need a javascript that builds the querystring for you ;)

Expand|Select|Wrap|Line Numbers

 function goto_page(page) {

    var title = document.getElementById('Title').value;

    var surname = document.getElementById('Surname').value;
 
    var q_str = '?Title=' + title + '&Surname=' + surname;
 
    var url = page + q_str;
 
    window.location = url;

}

and now your link should look like:

[HTML]<a href="#" onclick="goto_page('Test_Page2.html');">Next</a>[/HTML]
kind regards

Sep 2 '07 #4

DLP35

Excellent.

I googled and found that I had to place the function inside script markers and now my url on page 2 includes the words Mr and Smith.

sorry, but this could be a slow night for you!

Sep 2 '07 #5

gits

5,390

Expert Mod 4TB

heya ...

you are doing well with the bits i show you ;) ... what we have to do now is to retrieve the url and put it on your page:

Expand|Select|Wrap|Line Numbers

 <script type="text/javascript">

function get_params() {

    var url = window.location.href;

    var q_str_part = url.match(/\?(.+)$/)[1];
 
    var val_pairs = q_str_part.split('&');

    var params = {};
 
    for (var i = 0; i < val_pairs.length; i++) {

        var tmp = val_pairs[i].split('=');

        params[tmp[0]] = typeof tmp[2] != 'undefined' ? tmp[2] : '';

    }
 
    return params;

}
 
function write_params() {

    var params = get_params();
 
    var txt = ' ';
 
    for (var i in params) {

        txt += params[i] + ' ';

    }
 
    var body = document.getElementsByTagName('body')[0];

    body.innerHTML += txt;

}

</script>

call the write_params()-function in onload of your page2-body :)

kind regards

Sep 2 '07 #6

DLP35

Hi thanks again gits.

I'm not there yet, am I right putting the text e.g the word hello in the function?
I found the body onload option and this seems to reference back ok but doesn't pick up the parameters, so i think I'm still missing something (apart from brain cells!)

Expand|Select|Wrap|Line Numbers

 <html>

<head>

<title>Untitled Document</title>
 
<script type="text/javascript">

function get_params() {

    var url = window.location.href;

    var q_str_part = url.match(/\?(.+)$/)[1];
 
    var val_pairs = q_str_part.split('&');

    var params = {};
 
    for (var i = 0; i < val_pairs.length; i++) {

        var tmp = val_pairs[i].split('=');

        params[tmp[0]] = typeof tmp[2] != 'undefined' ? tmp[2] : '';

    }
 
    return params;

}
 
function write_params() {

    var params = get_params();
 
    var txt = 'Hello ';
 
    for (var i in params) {

        txt += params[i] + ' ';

    }
 
    var body = document.getElementsByTagName('body')[0];

    body.innerHTML += txt;

}

</script>

</head>
 
<body onLoad="write_params()">
 
</body>
 
</html>

Cheers

Sep 2 '07 #7

gits

5,390

Expert Mod 4TB

ahrg, sorry my bad ... replace the params line with the following:

Expand|Select|Wrap|Line Numbers

params[tmp[0]] = typeof tmp[1] != 'undefined' ? tmp[1] : '';

kind regards

ps: you note the difference? please tell me ... because i think you are doing well and learn quickly :)

Sep 2 '07 #8

DLP35

Thanks gits for all your help. Got it now! at least to a stage where I can try some different variations on fields etc.

The next step for me to learn is "to pass input values or parameters to a client side cookie and then extract them for use in other pages or send them to a server later". Is this still javascipt or am I back to HTML? and do I need to start a new thread?

Any suggestions or good (easy) links where i can start.

Cheers

Sep 4 '07 #9

gits

5,390

Expert Mod 4TB

hi :)

it stays javascript ... ;) and may be to start with cookies have a look here

kind regards

Sep 4 '07 #10

DLP35

Thanks for the Cookies link.

One last question on parameters - if i wanted to just call the parameters directly into the <Body> as part of a block of text how would i do this?

eg "Thank you for calling Mr Smith, I hope that we will talk again". Where Mr is called from the Title parameter and Smith from the Surname parameter.

to replace the concatenation I would do in MS Access. e.g.
"Thank you for calling " & [Title]& " " & [Surname] & ", I hope that we will talk again".

Regards

Sep 4 '07 #11

gits

5,390

Expert Mod 4TB

hi ...

we have the params-read method already ... ok? we call it onload and put it in the body already ... ok? ... now we want to put it at a specific position in a floating text ... right?

do something like the following:

[HTML]<body onload="write_params();">
Thank you for calling <span id="title"></span> <span id="surname"></span>, I hope that we will talk again
</body>[/HTML]

in our write_params function you need:

Expand|Select|Wrap|Line Numbers

 var title_container = document.getElementById('title');

var surname_container = document.getElementById('surname');

and you have to assign the parameters we already have as innerHTML to the appropriate container we refered the above way :)

kind regards

Sep 5 '07 #12

DLP35

Hi gits.

Nope, thought I was doing OK but you lost me with:

"and you have to assign the parameters we already have as innerHTML to the appropriate container we refered the above way :)"

Sep 5 '07 #13

gits

5,390

Expert Mod 4TB

hi ...

ok ... we have our two span containers ... right. you have to put that into the 'write_params()'-method ... and now we have our params to assign to the particular container. we don't need the loop we have there already ... delete it, and put something like the following there:

Expand|Select|Wrap|Line Numbers

title_container.innerHTML = params.Title;

kind regards

Sep 5 '07 #14

DLP35

Thanks for your help, but I find your answers are becoming cryptic, "put something like this in somewhere!" doesn't help.

I would have been able to learn from this by putting the principle from this "simple" query into practice in my actual web pages - but this is way too slow a process for me. I'll pay for someone to do it!

Please consider this thread closed.

Sep 6 '07 #15

gits

5,390

Expert Mod 4TB

nope ... its not cryptic, i thought you wanted to learn and at the beginning you did well ... you need patience and have to try things for yourself to get some learning success - simply copy&pasting code gets your things to work but you didn't do it for yourself - so you might ask questions when things are not clear ... however have a look at the following working example:

[HTML]<html>
<head>
<title>Untitled Document</title>

<script type="text/javascript">
function get_params() {
var url = window.location.href;
var q_str_part = url.match(/\?(.+)$/)[1];

var val_pairs = q_str_part.split('&');
var params = {};

for (var i = 0; i < val_pairs.length; i++) {
var tmp = val_pairs[i].split('=');
params[tmp[0]] = typeof tmp[1] != 'undefined' ? tmp[1] : '';
}

return params;
}

function write_params() {
var params = get_params();

var title_container = document.getElementById('title');
var surname_container = document.getElementById('surname');

title_container.innerHTML = params.Title;
surname_container.innerHTML = params.Surname;
}
</script>
</head>

<body onLoad="write_params()">
Thank you for calling <span id="title"></span> <span id="surname"></span>, I hope that we will talk again
</body>

</html>[/HTML]

regards

Sep 7 '07 #16

by: Hermes | last post by:

Hi Everyone, I'm using the following asp to execute an SQL query and I'm trying to pass input variables into the stored procdure but I'm getting ADODB.Command (0x800A0BB9) Arguments are of the...

ASP / Active Server Pages

testing input values

by: TechNovice | last post by:

Hi: I'm trying to find a way to test input values. To test an integer I tried this code: ******Code****** int input_number; cin>>input_number; while(!input_number) cout<<"invalid...

C / C++

carrying the user input across pages..

by: ani | last post by:

Hi, I need to carry the user input across pages and then at the end insert all the values into the DB. There is one single .aspx page that is paginated and the values have to be passed across...

ASP.NET

Preserving input values in innerHTML with Mozilla

by: mypublicmail | last post by:

I'm moving big chunks of html into and out of divs using innerHTML. Or, I thought I was until I tested it on Firefox 1.5. Firefox will move the html just fine, but if you have changed any input...

Javascript

Passing input values between pages.

by: DLP35 | last post by:

I'm sure this should be simple enough but I'm really struggling to get my mind around this. I don't have access to a server but am developing a site and I need to pass information from input boxes...

HTML / CSS

Count input values?

by: dadimar | last post by:

I'm trying to write a program that reads unspecified number of positive and negative values, counts them and computes the average of the input values, not counting zeros. The program should end with...

Java

Passing info between pages.

by: Mufasa | last post by:

Are the only two real options for passing info between pages using QueryString and Session Variables? Am I missing any other viable way? TIA - Jeff.

ASP.NET

Dreamweaver problem passing form values with server behaviour

by: jmartmem | last post by:

Greetings, I have built an Update Record Form in an ASP page. This form contains a number of fields, such as text boxes and menus, to name a few. Upon clicking the 'submit' button, I want the...

ASP / Active Server Pages

Passing data between pages

by: dbuchanan | last post by:

newbie question What are the various ways that data can be passed between pages. For example; How is data about the logged in user passed to subsequent pages Thank you, Doug

ASP.NET

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

Windows Server

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

by: tracyyun | last post by:

Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

General

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice

Passing input values between pages.

Similar topics