elementos Como você move irmãos encomendar cima / baixo no protótipo 1.5.1?

Question

Eu estou tentando configurar uma função que permite mover 'up' e 'baixo' de uma linha da tabela em um formulário. O número de linhas da tabela é dinâmica - o usuário pode apertar um botão para adicionar linhas adicionais. Existem vários campos em cada linha da tabela. Há uma linha de cabeçalho e linha de rodapé com nomes de classes diferentes, daí a verificação de hasClassName.

A primeira vez que escreveu esta função com sucesso para uso com Prototype 1.6 antes de perceber que eu preciso para que ele funcione com a versão 1.5.1. Nós será atualizar para a versão mais recente do protótipo quando o tempo está disponível para testes, mas eu preciso disso para o trabalho sob a versão atual do nosso projeto.

O principal problema é que, em 1,5 você não pode simplesmente inserir um elemento como o conteúdo de uma inserção. Isso significa que eu precisam de HTML do Elemento eu quero inserir. Isso levanta a questão de que quando eu acessar o HTML para o elemento (variável "insertHtml"), este é o HTML original e não inclui a informação entrou em elementos de formulário relacionados por parte do usuário.

Qualquer ajuda seria muito apreciada.

moveDataDef: function(num, dir) {
    var targRow = $('dataDefItem'+num);
    var content = targRow.innerHTML;
    var siblings;
    var insertHTML = targRow.inspect() + targRow.innerHTML + '</tr>';

    if(dir == 'up')
        siblings = targRow.previousSiblings();
    else
        siblings = targRow.nextSiblings();

    if (siblings[0].hasClassName('dataDefItem')) {
        targRow.remove();
        if(dir == 'up')
            new Insertion.Before(siblings[siblings.length - 1].id, targRow);
        else
            new Insertion.After(siblings[0].id, targRow);
    }
}

Answer 1

Eu acho que, você poderia usar parte deste código, para substituir o seu mais baixo se bloco. Ele usa a função DOM nativa, ou seja, insertBefore () :

if (siblings[0].hasClassName('dataDefItem')) {
  var targetParent = targRow.parentNode;
  var sibling = siblings[0];

  if(dir == 'up'){
    targRow.remove();
    targetParent.insertBefore(targRow, sibling);
  } else {
    sibling.remove();
    targetParent.insertBefore(sibling, targRow);
  }
}

Para sua referência, se você estiver interessado, este é o meu código de POC:

<table id="tb1">
<tbody>
<tr id="tr1"><td>1</td></tr>
<tr id="tr2"><td>2</td></tr>
<tr id="tr3"><td>3</td></tr>
</tbody>
</table>

<script type="text/javascript">
/* <![CDATA[ */
(function(){
var trr3 = $('tr3');
var tp = trr3.parentNode; 
var trr1 =trr3.previousSiblings();
trr3.remove();
tp.insertBefore(trr3, trr1[0]);
})();
/* ]]> */
</script>

Graças.

Update:. Fix erro de digitação (faltando '{' e '}')