Save dynamic data created using createElement(Javascript) to database

Question

I am new to this forum as well as webpage designing. I am trying to design a profile management tool using JSP in which there are dynamically added(through javascript createElement) input fields to which names are assigned. I am able to save only one record to database and others are ignored. My question is how to save all the data that is dynamically added? Please help me on this.

Javascript code:Using the below function, I am able to get Javascript array

function addedu()
{  
    $(document).ready(function(){
    $(".ed").each(function(input){
    var value = $(this).val();
    var id = $(this).attr('id');
    t= id+' : '+ value;
    arr.push(t);
    });
});

var newinput1 = document.createElement("input");
newinput1.name="i1"
newinput1.className="ed"    
newinput1.id="Education"
newinput1.innerHTML = "";
document.getElementById('edu').appendChild(newinput1);
}

JSP code:

String edu1=request.getParameter("i1");
Statement st1=con.createStatement();
String sql1="insert into education values('"+pno+"','"+edu1+"');
st1.executeUpdate(sql1);

Welcome to S.O please show us what you try – Thomas Rollet Feb 08 '16 at 13:32 — Thomas Rollet, Feb 08 '16 at 13:32

score 0 · Answer 1 · edited May 23 '17 at 11:45

On the client side you can use jQuery to dynamically add rows and read necessary values. To access the rows of the table you can use jQuery selectors. Then save the data in the JavaScript array, convert it to JSON and send it to the server side.

Here is an example (with using PHP, but in this case it doesn't matter):

Store HTML Table Values in a Javascript Array and Send to a PHP Script Using jQuery and Ajax

On the server side you'll need to make a lot of inserts via plain JDBC, use BATCH insert instead of hitting database once for each insert statement.

Here is an example:

Java: Insert multiple rows into MySQL with PreparedStatement

If you'll decide to use Spring, here is an example:

How to Insert multiple rows from web form into database using java spring framework

Thanks for your reply. I was able to save data in Javascript array. Updated the code above. I am trying the next steps now and will get back to you soon. — Jyothy, Feb 09 '16 at 09:21

Save dynamic data created using createElement(Javascript) to database

1 Answers1