CODEWITHSUNDEEP
javascriptforms
ciaoben
ciaoben

Reputation: 51

How to handle HTML <forms> with javascript

i'm studying javascript but i can't find some clear reference about how getting and treat data out of the HTML forms.

Here an example:

THE FORM:

<HTML>
              <HEAD>

<TITLE>Database Lookup</TITLE> 
<script src="basic.js"></script></HEAD>
<BODY>
<H1>Database Lookup</H1>
<FORM  action="javascript: submitForm();">
Please enter the ID of the publisher you want to find: <BR>
<INPUT TYPE="TEXT" NAME="id">
<BR>
<INPUT TYPE="SUBMIT" value="Submit" > </FORM>
          </BODY>
     <HTML>

    //HERE JAVASCRIPT Javascript BASIC.js:

function submitForm() 
{

var idsearched=document.getElementById("id").innerHTML;
document.write("idsearched");
}

I would like to know what i'm doing wrong, because nothing happen when i click submit. And which is the better solution for handling forms with javascript?? Using "action"? or which of other attributes?

Upvotes: 2

Views: 7847

Answers (3)

Chibuzo
Chibuzo

Reputation: 6117

The value of form elements are contained in their value attribute. Try the modified code snippet below. Note: ("idsearched") should be without quote because it is a variable and not a string.

var idsearched=document.getElementById("id").value;
document.write(idsearched);

You must add an id attribute to the form element.

<INPUT TYPE="TEXT" NAME="id" id="id">

Use this line to manually submit your form

<INPUT TYPE="button" value="Submit" onclick="submitForm();" >

Upvotes: 1

Tuxes3
Tuxes3

Reputation: 447

a full working example like you wanted is that:

<HTML>
   <HEAD>
      <TITLE>Database Lookup</TITLE>
      <script src="basic.js"></script>
   </HEAD>
   <BODY>
      <H1>Database Lookup</H1>
      <FORM  action="javascript: submitForm();">
         Please enter the ID of the publisher you want to find: <BR>
         <INPUT TYPE="TEXT" id="id" NAME="id">
         <BR>
         <INPUT TYPE="SUBMIT" value="Submit" > 
      </FORM>
      <script type="text/javascript">
         function submitForm() 
         {

         var idsearched=document.getElementById("id").innerHTML;
         document.write("idsearched");
         return false;
         }
      </script>
   </BODY>
   <HTML>

Upvotes: 0

Math chiller
Math chiller

Reputation: 4167

<INPUT TYPE="button" value="Submit" onclick="submitForm();" >

do not use document.write use document.getElementById("myID").innerHTML

Upvotes: 1

Related Questions