Automatticly add a div after filling input

Question

I have a form that gets the data from database (loop)

<div class="row">

<div><input name="Url"></div>

<div><input name="Tekst"></div>

<div><input name="description"></div>

<div>

    <select name="Links" style='display:none;')>

        <option  value="buy+sell">buy+sell</option>

        <option  value="sell">sell</option>

        <option  value="buy">buy</option>

    </select>

</div>

The data is filled in this div.

What i try to do is

if i write in the div (with class row) it automaticly creates the same div

so if i put something in input with the name Url i will get the whole

<div class="row">

<div><input name="Url"></div>

<div><input name="Tekst"></div>

<div><input name="description"></div>

<div>

    <select name="Links""style='display:none;'">

        <option  value="buy+sell">buy+sell</option>

        <option  value="sell">sell</option>

        <option  value="buy">buy</option>

    </select>

</div>

under it

so that i alway have 1 empty div

Answer 1

I hope I understood your question right:

Is this what you are looking for? https://jsfiddle.net/cqenvvt9/1/

I used jQuery`s clone() and checked if there is already a cloned object.

$(document).on("input", ".yourDiv", function(){
    if ($(this).next(".yourDiv").length > 0){
    console.log("There is already a Clone of this Div")
  } else {
        $(this).clone().insertAfter( this ).find("input:text").val("");
  }
});

Automatticly add a div after filling input

Sign up