javascript - send data to server without page reload


I'm new to javascript and need some guidance.  I have a page with a form and a text input box.  I want to send  or I should say "submit" the data in the text box to the server but I don't want that page to be reloaded.  

Here's the challenge though: The server I'm using is an embedded server that is very limited in functionality.  The only way I can send data to it is in a "get" format (i.e. "ip addr/?c=xxx").  What is some javascript code that allows me to effectively do a submit without reloading the page?

Alternatively, what would the HTML / javascript code look like to put my text box into a frame, submit the text from that frame and just reload that frame?

Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Hello charlieopp,

>Alternatively, what would the HTML / javascript code look like to put my text box into a frame, submit the text from that frame and just reload that frame?

You can get content of iframe from parent... Sorry I should say : I don't know how to get content of iframe from parent

You can post content of a textbox with ajax or with an hidden (or not) iframe :

We set URL of an iframe
document.getElementById('likeAjax').src = 'mypage.php?field=' + encodeURI( document.getElementById('field1').value );

mypage.php use : $_GET['field'] to get the "field" value
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "">
Field: <input id="field1" name="field1" />
<input type="button" onClick="document.getElementById('likeAjax').src = 'mypage.php?field=' + encodeURI( document.getElementById('field1').value );" value="send value to mypage.php" />
<div style="display:none"><iframe id="likeAjax"></div>

Open in new window


Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
I would use jQuery. Nice, easy and simple.

You can check out an example and all the information on this page:
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today

From novice to tech pro — start learning today.