Clone div and saving to database

I have used Jquery to clone a div by clicking on a button. The div contains input fields of a table. I am unable to save the cloned part data to database.

Any help is appreciated.


Hi, I just want to hear a little more about what you’re trying to do. What is the point of the page you’re working with? Can you describe the process you’re going for a little better?

I have a BIG FORM(student info) which has input fields from many tables(personal,addresses,acads,documents etc).

PROBLEM: create a button when clicked on it should be able to show extra copy of already present input fields.

EXAMPLE1:Let there be 2 text field. For example Name,city.

Now I want a button(ADD PERSON) beneath that so that when clicked on it

I should get these textfields again.

Before clicking




After clicking






Finally I will save the form and should be able to save them to database.

Here I should be able to create as many as possible and save them successfully.

EXAMPLE2: In the form,address details such as street, city, county, country, zip etc are present.In case of addition of any more(such as temporary) address to student create a button so that all the above fields should come up again.

What i have done is:

put the address details in div and clone the div using jquery. Till here its fine later When I am trying to save the data entered in the cloned div I am unable to save it.

Generally we pass model to view and in controller


then save it. Here I think I am going wrong.

other things I tried for this problem are:

  1. created two models for same table(address) and pass it to view. Create a div which is hidden when click on it will be visible.Problem I faced is the DATA IS REPLICATED. That is

addr1 and addr2 be models then



posts same data. Then I followed this from cookbook


And also THERE IS A EMPTY SPACE OF THE HIDDEN DIV. when clicked to visible this empty space is filled. This looks clumpsy and dropped the idea.

Here I have small query : is it possible to make my method work?

2)created jquery dialog box(I followed the cookbook http://www.yiiframew…oc/cookbook/72/ ) but faced problem with database(foreign key exception) as it depends on other table foreignkey which is created with BIG FORM(mentioned in first line).

Is there any way to store data from dialog box and then save the information along with the form.

Hope you have understood the problem. Sorry If I am too long.

Thanks a lot


it’s an array data

try to direct echo


btw, i use this for clone input

the demo is really simple.

hope it help… :)

I’ve been doing stuff like this lately. I’ll share my technique, but it may not be the way you want to do it. It really only works when doing an UPDATE to an existing record. This is because I just use ajax to post when you hit the Add button, so you need the ID of the main record.

In my application, I start with a few of the most basic fields to get started. After they create it the first time, then there’s more information that can be added. I actually use tabs where the first one is the only thing visible on Create.

So if this was your case, you’d have the two fields NAME and CITY with the ADD PERSON button below. When you hit this button, ajax the fields with the student record ID to a special action in your Student controller, like student/addperson. I recommend a json return, so you can tell if it was successful or not. When it returns success, I actually replace the first set of text inputs with simple span tags and add a remove icon next to the line. The remove icon will post to student/removeperson, and on success will remove the div.

Like I said, I’m not sure if this will work for what you want to do. I guess if you want to process these records all at once, when you post up the whole form, you’d have to create an array of input items by doing something like the following:

<input type="text" name="person[0][name]"/>

<input type="text" name="person[0][city]"/>

<input type="text" name="person[1][name]"/>

<input type="text" name="person[1][city]"/>

<input type="text" name="person[2][name]"/>

<input type="text" name="person[2][city]"/>

If you can come up with a way to keep the names going like this, then you can process them in PHP like this:

foreach($_POST['person'] as $person){

  $student_person = new Student_person;

  $student_person->student_id = $model->student_id;

  $student_person->name = $person['name'];

  $student_person->city = $person['city']



Thanks a lot for ur suggestion. Finally worked out.

Thanks a lot fastcrash…

you made my debugging easy. :)

problem solved by following above suggestions along with

Thanks everyone. :)

i got same problem too, i want to save my clone info to database but when i confirm my details it only mail part will save

Maybe the extension multimodelform can help.