como construir um construtor dinâmico de formulários com jquery

quero desenvolver um construtor dinâmico de formulários com jquery onde os utilizadores possam construir a sua própria forma e mudar o nome do formulário, tipo de entrada, tamanho, etc. Eu sei que há algum drag e drop fresco construtores de formulários on-line, mas eu quero desenvolver um construtor de formulários muito simples .

Quando o utilizador carrega no rótulo (campo de entrada), cria um campo de entrada dinamicamente com o jquery com o botão Editar e apagar.

o código em baixo está a adicionar um campo de entrada num div que está vazio neste momento.

$(document).ready(function() {
  $(".text").click(function(){
    $("#textInput").append('<input class="form-control"  type="text">' + '<input class="btn btn-default" type="button" value="Edit" id="editbtn"><input class="btn btn-default"  type="button" value="Delete" >'             ).show().css('display', 'block')});
});


    

.items {
  border: 1px solid lightgray; 
  display: none;  
  padding: 0 10px 10px 10px;
  }

<div class="items" id="textInput">
  <h3>Your Form</h3>
  <hr>    
</div>

ao carregar na entrada de texto, Quero mostrar uma tabela ou modal onde o utilizador pode gravar as alterações no campo de entrada, em primeiro lugar, o botão Editar não está a funcionar e, em segundo lugar, como editar e gravar as alterações no campo de entrada(como o processo irá funcionar).