Adicionados dinamicamente JavaScript não encontrar campos adicionados dinamicamente no IE

Question

Eu tenho uma tabela que tem um botão para "adicionar linhas". Este botão adiciona um dinamicamente linha com JQuery. Ele funciona, copiando o primeiro ... e, em seguida, substituindo todo o id = ".." com um número incrementado.

O problema é que as linhas têm uma YUI AutoComplete que se parece com o seguinte:

<td>
    <input type="hidden" name="location_num[0]" value="508318" maxLength="25" style="width:230px" id="location_num[0]"/>
    <input type="textbox" name="location_numDisplayDesc[0]" value="WINNIPEG" maxLength="25" style="width:230px" id="location_numDisplayDesc[0]"/>
    <div id="Container_location_num[0]" style="display:inline;"></div>

    <script type="text/javascript">

        // Initialize autocomplete
        var location_numAC = new YAHOO.widget.AutoComplete(
            "location_numDisplayDesc[0]",
            "Container_location_num[0]",
            locationDataSource,
            acConfig);

        location_numAC.useShadow = true
        location_numAC.useIFrame = true
        location_numAC.dataErrorEvent.subscribe(acErrorFunction);

        // Format results to include the reference number
        location_numAC.formatResult = function(resultItem, query) {
            return resultItem[0];
        };

        // Clear key before request
        location_numAC.dataRequestEvent.subscribe(function fnCallback(e, args) {
        YAHOO.util.Dom.get("location_num[0]").value = ""; });

        // Set key on item select
        location_numAC.itemSelectEvent.subscribe(function(event, args) {
            YAHOO.util.Dom.get("location_num[0]").value = args[2][1];
        });

        // Clear key when description is cleared
        location_numAC.textboxBlurEvent.subscribe(function fnCallback(e, args) {
            if (isEmpty(YAHOO.util.Dom.get("location_numDisplayDesc[0]").value)) {
                YAHOO.util.Dom.get("location_num[0]").value = "";
            } // end if
        });
    </script>
</td>

Este código bem funciona no Firefox eo autocompletes recém-criado trabalho, mas no IE (6 e 7) Eu estou recebendo um erro, isso significa que o location_num_AC não está sendo criado com sucesso. Eu acredito que é porque que ele não está lendo as entradas ou div recém-criadas como deveria. Eu tentei envolver o javascript com

$("Container_location_num[0]").ready(function {...});

mas que não parecem funcionar. Alguém tem outras ideias?

Answer 1

Os campos do formulário que são inseridos no DOM no IE não adicionar à coleção formas como se poderia esperar.

Normalmente, você pode se referir a um campo de formulário de duas maneiras:

document.forms[0]["myFormName"];
document.forms[0][12];

Isto é, pelo seu nome de campo de formulário ou por seu índice. Mas quando você Adicionar um campo de formulário para o DOM no IE você não pode se referem a ele pelo nome, apenas por seu índice. Se o seu código (ou qualquer código de suporte) está à procura de um campo de formulário na coleção pelo seu nome você obviamente tem um problema.

Se a sua única chave é o nome que você pode percorrer todos os campos do formulário por índice e encontrar o que você está procurando, mas que, obviamente, vai ser uma operação linear. Você também pode percorrer e descobrir quais os campos do formulário são indexados numericamente, mas não pelo nome e atualizar o objeto de forma a si mesmo.

Eu não tenho detalhes suficientes para saber como (ou se) isso está ocorrendo em seu projeto, mas é um daqueles IE peculiaridades que soa como ele poderia estar desempenhando um papel desde que você está adicionando campos dinamicamente.