forms aninhados

[jmfpinto 0]

Olá,

desenvolvi uma pequena biblioteca usando javascript, html e css que tem a finalidade de inserir em um documento controles input type="file" para upload de arquivos. A chamada é mais ou menos assim:

        <div id="principal">
            <h3>Criação dinâmica de controles para upload de arquivos</h3>
            <button class="btn btn-primary" onclick="eu_buildControl('principal', true, '', true, '')">Insere novo controle</button>
            <button class="btn btn-primary" onclick="eu_uploadAllFiles('principal')">Executa upload</button>
        </div>
 

Ao receber um click o botão "Insere novo controle" dispara a função eu_buildControl(...) que injeta no documento via javascript um código HTML devidamente preparado para permitir ao usuário escolher arquivos para upload. Um exemplo da tela que resulta após cliques no botão de inserção está anexa. Cada linha/conjunto de input, barra de progresso, botão preview e botão delete é inserido automaticamente no documento.

 

Até aí tudo certo, mas quando parti para o uso em um app esbarrei no problema de aninhamento de forms que não é suportado no HTML. O form "principal" (que é o form que permite ao sistema se comunicar com o servidor via php) conflita com o form usado dentro da função eu_buildControl(...) para enviar via ajax os uploads. No caso do Chrome (não cheguei a testar nos outros) as linhas contendo o form mais interno são simplesmente rejeitadas e não aparecem no código carregado.

 

Andei olhando vários posts na web a respeito desta situação mas ainda não sei bem como contornar esse problema. Peço então alguma orientação do pessoal mais experiente no sentido de encontrar a melhor saída.

 

Andei lendo que o uso de iframes poderia resolver o problema, mas não testei ainda. Me pareceu relativamente simples mas neste caso eu gostaria de perguntar se há alguma maneira de injetar o conteúdo de uma variável (que obviamente terá um trecho html consistente dentro de si) no parâmetro source do elemento iframe. Algo assim:

<iframe src= minha_variavel_js ...></iframe>

 

Bem, desde já agradeço a atenção.

 

Att,

Jorge.