how to send parameters from javascript to html form

Question

i have spend great time in searching this type of problem but found no suitable answer. what i am trying is to get text name <input type='text' name="qname"> from java script and send in html form. is there is a possibilty? my stress is on this part. code:

<html>
<!-- skipped part-->
 <script type="text/javascript" defer="defer">
    function create()
    {
        var newDiv = document.createElement('div');
        var divId = "someId";
        newDiv.id = divId;
        var output = "<table id='e' border><tr><td><input type='text' name="qname"></td><td><input type='text1' name="qty"></td><td><input type='text' name="price"></td><button onclick=del('"+ divId +"')>delete</button></td></tr></table>";
        newDiv.innerHTML = output;
        newDiv.className = 'newClass';
        document.body.appendChild(newDiv);                          
    }


    function del (id) {
        var div = document.getElementById(id);
        div.parentNode.removeChild(div);
    }


    </script>


<body>
    <form method="post" action="transaction.php" onclick="create()">    
    <button onclick="create()">create</button>
    <input type="submit" value="submit" />

   </form>
</body>

You can see that you have improperly quoted string where you are setting var output = "<table ..." I would suggest single quotes around the entire string (except where concatenation is performed) and double quotes for each of the HTML properties. — Mike Brant
– Mike Brant, Commented Jan 16, 2014 at 16:37
Two problems. 1) You need to escape those quotes: name=\"qname\". 2) You need to append to the form, not the body, if you want it to post: document.getElementsByTagName("form")[0].appendChild(newDiv); — CodingIntrigue
– CodingIntrigue, Commented Jan 16, 2014 at 16:38
even it sends one whole div it would be more better but i just want to send parameter of row to html. — user3187733
– user3187733, Commented Jan 16, 2014 at 16:41
document.getElementsByTagName("form")[0].appendChild(newDiv); where shoul i write this. iside javascript function or outside? — user3187733
– user3187733, Commented Jan 16, 2014 at 16:43

Thomas Leu · Accepted Answer · 2014-01-16 16:40:40Z

2

You append the new HTML to the body instead of to the form. Give the form an id, e.g.

<form method="post" action="transaction.php" onclick="create()" id="myform">

and then append the input to the form with:

document.getElementById("myform").appendChild(newDiv);

answered Jan 16, 2014 at 16:40

Thomas Leu

8554 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

user3187733 Over a year ago

i understand the forum shell i place the document.getElementById("myform").appendChild(newDiv); before function end barackets?

user3187733 Over a year ago

not happening. and also can i place the whole row in database?

Thomas Leu Over a year ago

what do you mean by "not happening"? and what database?

user3187733 Over a year ago

when i placed document.getElementById("myform").appendChild(newDiv); before bracket end and run the page and selected on create button it does nothing. and as u see 4 input types in javascript is it possible to send the whole row to database through forum id??

Thomas Leu Over a year ago

You did escape the quotes, right? Now, since nothing is happening, probably the error console will tell you something useful...

|

Stachu · Accepted Answer · 2014-01-16 16:43:32Z

1

You have your output variable string formed improperly.

If you check the console, you'll see:

Uncaught SyntaxError: Unexpected string

Try formatting your string like this:

var output = "<table id='e' border><tr><td><input type='text' name='qname'></td><td><input type='text1' name='qty'></td><td><input type='text' name='price'></td><button onclick=del('" + divId + "')>delete</button></td></tr></table>";

Demo: http://jsfiddle.net/IrvinDominin/Lcnet/

edited Jan 16, 2014 at 16:43

Stachu

5,9473 gold badges32 silver badges36 bronze badges

answered Jan 16, 2014 at 16:41

Irvin Dominin

31k9 gold badges83 silver badges114 bronze badges

1 Comment

Stachu Over a year ago

Alternatively, escape those quotes: "<table id=\"e\" border etc

Collectives™ on Stack Overflow

how to send parameters from javascript to html form

2 Answers 2

6 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related