Jyothy February 2016

Save dynamic data created using createElement(Javascript) to database

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);

Answers


Aleksey Bykov February 2016

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):

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:

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

Post Status

Asked in February 2016
Viewed 1,705 times
Voted 6
Answered 1 times

Search




Leave an answer