如何在使用原型的特定行之前附加表中的行

Question

我想使用原型追加表中的行，但它總是會在表的末尾追加行如何在特定的行之後添加它這裏是我的代碼我習慣追加行使用模板。我想附加行上面buttonsrow id。此ID分配給特定的行。

//<![CDATA[ 


var groupPriceRowTemplate = '<tr>' 
    + '<td class="label"><input name="extraoption[]" value="" type="text" class="input-text"></td>' 
    + '<td class="value"><input name="extravalues[]" value="" type="text" class="input-text"></td>' 
    +'<td class="value"><button title="Delete Group Price" type="button" class="scalable delete icon-btn delete-specification"><span>Delete</span></button></td>' 
    + '</tr>'; 



var groupPriceControlspec = { 
    template: new Template(groupPriceRowTemplate, new RegExp('(^|.|\\r|\\n)({{\\s*(\\w+)\\s*}})', '')), 
    addItem : function (event) { 
     console.log(Event.findElement(event, 'tr')); 
     Element.insert($('specification_container'), { 
      bottom : this.template.evaluate() 
     }); 
     this.bindRemoveButtons(); 

      }, 
    deleteItem: function(event) { 
     var tr = Event.findElement(event, 'tr'); 
     if (tr) { 
      Element.select(tr, ['td']).each(function(element) { 
       element.remove(); 
      }); 
     } 
     return false; 
    }, 
    bindRemoveButtons : function(){ 
     var buttons = $$('div.specification-container .delete-specification'); 
     for(var i=0;i<buttons.length;i++){ 
      if(!$(buttons[i]).binded){ 
       $(buttons[i]).binded = true; 
       Event.observe(buttons[i], 'click', this.deleteItem.bind(this)); 
      } 
     } 

} 
} 
groupPriceControlspec.bindRemoveButtons(); 
if($('addnewspecrow')){ 
    Event.observe('addnewspecrow', 'click', groupPriceControlspec.addItem.bind(groupPriceControlspec)); 
} 
//]]> 

Answer 1

其實它應該很容易做到。

給你想要把HTML以前都是buttonsrow元素的ID -

var content = "<tr><td></td></tr>"; 
$('buttonsrow').insert({'before':content}); 

http://api.prototypejs.org/dom/Element/prototype/insert/