?
Solved

Get value of textbox from different forms

Posted on 2003-03-31
8
Medium Priority
?
1,066 Views
Last Modified: 2012-08-13
Hi all,

I've got multiple HTML files that share this javascript file. I would like to know, how is it possible to store the value somewhere (After performing javascript calculations from a page [file.html]) from a textbox and display it in another HTML (file2.html) [IE: call up the value stored in the form of file.html] file, on a particular textbox?

BTW, the javascript calculations are all performed in a function and on submit of the form, it will call the function which will display the results.
0
Comment
Question by:localhost
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
8 Comments
 
LVL 30

Accepted Solution

by:
third earned 200 total points
ID: 8243544
main.html
-------------
<html>
<body>
<form name="form1" action="next.html">
  <input type="text" name="txt1">
  <input type="submit" value="Submit">
</form>
</body>
</html>


next.html
-------------
<html>
<head>
<script>
  function showTextValue(){
    var val = document.location.search.substring(1).split('=')[1];
    document.getElementById('txt').innerHTML = 'The value of txt1 is ' + val;
  }
</script>
</head>
<body onload="showTextValue();">
<div id="txt"></div>
</body>
</html>
0
 
LVL 2

Expert Comment

by:miskate
ID: 8243725
I'm a bit confused by your question, but...

A javascript file, if added to several pages using <script src="blah.js></script> is still operating in the context of whichever page you're calling it's functions from - ie, it will work in much the same way as if each of those pages simply had an indentical block of javascript code in them. The only advantages of separating it out into a file are a)one stop fixes/updates and b)it can  be cached on the user's machine, speeding up downloads.

That means that you need to reference things very specifically by window if you're trying to call some common element. If you're trying to keep a hidden form element that every page can access, it will either need to be on every page or on whichever page is in one specific window/frame - something you can get at by using (for example) window.top from everywhere.
0
 
LVL 1

Author Comment

by:localhost
ID: 8250639
Hmm,

Mistake: Sorry for the unclear explaination. I was in a rush though :) Ok, here's a short description of what I meant.

1) I have a combine.js file where there are plenty of functions in it. Each function serve different purposes such as performing different calculations when user input data in different HTML files.

2) Yes, I used <script src="combine.js"></script> on all pages that needs to use the file.

3) What I meant was, for example, I have 2 different HTML files (namely: file.html, file2.html). In file.html (form name="something"), there are textbox etc for user to input data and submit it for calculations where the result will be displayed on the result textbox on that page.

On the other hand, in file2.html, I have another form (IE: form name="something2") and again, with textbox for user to enter its data. Hence, I would like to know how is it possible to:

-> extract (get) the either the data entered by the user in file.html, or the results calculated in file.html and display it in file2.html (EG: once user submit data for calculation in file.html is completed and user clicks on the link to file2.html, data wanted from file.html will be displayed in those textbox chosen to display the data of file2.html).

PS: I'm not using frames. Everything is on a page itself.

Hope I'm not making it worst :)

As for third's solution:

Hi, thanks for the solution. I'll give it a try and see if it works. Will keep this thread active :-)
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 30

Expert Comment

by:third
ID: 8250889
if you want it to show on another textbox on file2.html you should change my code to this,


next.html
-------------
<html>
<head>
<script>
 function showTextValue(){
   var val = document.location.search.substring(1).split('=')[1];
   document.form1.txt1.value = val;
 }
</script>
</head>
<body onload="showTextValue();">
<form name="form1">
<input type="text" name="txt1">
</form>
</body>
</html>


a much easier way to handle this is to use server side scripts like ASP. in ASP, you can simply recall the value submitted by referencing its name.

use this if you are using get method,

<form name="form1">
<input type="text" name="txt1" value="<%=request.querysting("txt1")%>">
</form>


or this if you are using post method,

<form name="form1">
<input type="text" name="txt1" value="<%=request("txt1")%>">
</form>

hope this helps....
0
 
LVL 1

Author Comment

by:localhost
ID: 8269426
Oh oh,

I'm really sorry third. Your scripts works perfectly fine for the way it meant to be... but, I know I'm dumb for not opening my eyes wide enough. I missed out something in my second clarification.

-> 3) What I meant was, for example, I have 2 different HTML files (namely: file.html, file2.html). In file.html (form name="something"), there are textbox etc for user to input data and submit it for calculations where the result will be displayed on the result textbox on that page.

Should Be:

There are few textbox in main.html. Hence, when user enter data in textbox 1 and textbox 2 in main.html and press submit, it will display results in textbox 3, which is also in main.html. What I mean is, How do I take the value calculated in textbox 3 of main.html and display in next.html?

I'm really sorry for the misintepretation.

Thanks :)
0
 
LVL 30

Expert Comment

by:third
ID: 8288305
just the same try this,

main.html
----------------

<html>
<body>
<form name="form1" action="next.html" onsubmit="this.txt3.value=parseInt(txt1.value)+parseInt(txt2.value);alert(this.txt3.value);">
  <input type="text" name="txt1" value="1">+
  <input type="text" name="txt2" value="2">=
  <input type="text" name="txt3" readonly>
  <input type="submit" value="Submit">
</form>
</body>
</html>


next.html
--------------

<html>
<head>
<script>
function showTextValue(){
  var val = document.location.search.substring(1).split('=')[3];
  document.form1.txt1.value = val;
}
</script>
</head>
<body onload="showTextValue();">
<form name="form1">
<input type="text" name="txt1">
</form>
</body>
</html>

there is no direct way on getting the value from the main.html to next.html. you have to pass it as a querystring variable on next.html parse the value and display it on the textbox.
0
 
LVL 75

Expert Comment

by:Michel Plungjan
ID: 10137382
localhost,
No comment has been added lately (284 days), so it's time to clean up this TA.
I will leave a recommendation in the Cleanup topic area for this question:

RECOMMENDATION: Award points to third http:#8288305

Please leave any comments here within 7 days.

-- Please DO NOT accept this comment as an answer ! --

Thanks,

mplungjan
EE Cleanup Volunteer
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

801 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question