डार्ट में टेबललेमेंट में पंक्तियां कैसे जोड़ें?

Question

मैं डार्ट के साथ खेल रहा हूं, और मैं एक शीर्षलेख और एक पंक्ति में एक पंक्ति के साथ एक नया टेबललेट बनाने की कोशिश कर रहा हूं।

TableElement table = new TableElement(); 

    Element head = table.createTHead(); 
    TableRowElement headerRow = table.tHead.insertRow(-1); 
    headerRow.insertCell(0).text = "9"; 
    headerRow.insertCell(1).text = "aaa"; 
    headerRow.insertCell(2).text = "bbb"; 
    headerRow.insertCell(3).text = "ccc"; 

    var tBody = table.createTBody(); 
    TableRowElement newLine = table.insertRow(-1); // add at the end 
    newLine.insertCell(0).text = "9"; 
    newLine.insertCell(1).text = "aaa"; 
    newLine.insertCell(2).text = "bbb"; 
    newLine.insertCell(3).text = "ccc"; 

दुर्भाग्यवश, दोनों पंक्तियां थैड सेक्शन में समाप्त होती हैं। उस के शीर्ष पर, अगर मैं केवल

TableElement table = new TableElement(); 

    var tBody = table.createTBody(); 
    TableRowElement newLine = table.insertRow(-1); // add at the end 
    newLine.insertCell(0).text = "9"; 
    newLine.insertCell(1).text = "aaa"; 
    newLine.insertCell(2).text = "bbb"; 
    newLine.insertCell(3).text = "ccc"; 

अपेक्षा के अनुरूप पंक्ति, खंड tbody जाता छोड़ दें। कोई विचार? डार्ट एसडीके 9474.

Answer 1

आपके उदाहरण में, आप सीधे बनाई गई तालिका शीर्षलेख में पहली पंक्ति जोड़ रहे हैं।

TableElement table = new TableElement(); 

// ... See below ... 

var tBody = table.createTBody(); 
TableElement newLine = tBody.insertRow(-1); 
newLine.insertCell(0).text = "9"; 
newLine.insertCell(1).text = "aaa"; 
newLine.insertCell(2).text = "bbb"; 
newLine.insertCell(3).text = "ccc"; 

टिप्पणी में उल्लेख किया है, वर्तमान में डार्ट:: एचटीएमएल पुस्तकालय तालिका का समर्थन नहीं करता लेकिन दूसरी पंक्ति, आप अपनी तालिका में सीधे जोड़ने के लिए (अपने tbody में)

निम्नलिखित का प्रयास करें कोशिश कर रहे हैं हेडर तत्व जैसे ही काम के इतने छोटे काम किए जाने की जरूरत है। तथापि (के रूप में वे लागू करने के लिए है कि जावास्क्रिप्ट विधि नहीं चुना है)

Element head = table.createTHead(); 
TableRowElement headerRow = table.tHead.insertRow(-1); 
var cell = new Element.tag('th'); 
cell.text = '9'; 
headerRow.insertAdjacentElement('beforeend', cell); 
cell = new Element.tag('th'); 
cell.text = 'aaa'; 
headerRow.insertAdjacentElement('beforeend', cell); 
cell = new Element.tag('th'); 
cell.text = 'bbb'; 
headerRow.insertAdjacentElement('beforeend', cell); 
cell = new Element.tag('th'); 
cell.text = 'ccc'; 
headerRow.insertAdjacentElement('beforeend', cell); 

// ... See above ... 

ध्यान दें कि insertAdjacentElement फ़ायरफ़ॉक्स के लिए काम नहीं करता है: बनाने तालिका हेडर आप निम्नलिखित का उपयोग कर सकते हैं। और विकल्प का उपयोग करने के लिए है:

headerRow.nodes.add(cell); 

ध्यान दें कि यह चारों ओर एक काम है और insertCell के रूप में एक ही तरीके से अनुक्रमण के लिए अनुमति नहीं है और व्यक्तिगत रूप से कोशिकाओं को बनाने के लिए और अधिक काम शामिल है। यह टिप्पणियों में सूचीबद्ध दो बग का उपयोग करने के आसपास एक काम प्रदान करता है।

Answer 2

नीचे कोड मेरे साथ ठीक काम किया:

TableElement table2 = new TableElement(); 
table2.style.width='100%'; 
var tBody2 = table2.createTBody(); 

table2.tHead.insertRow(-1)..insertCell(0).nodes.add(new Element.tag('th')..text = '1') 
         ..insertCell(1).nodes.add(new Element.tag('th')..text = '2') 
         ..insertCell(2).nodes.add(new Element.tag('th')..text = '3') 
         ..insertCell(3).nodes.add(new Element.tag('th')..text = '4'); 

tBody2.insertRow(0)..insertCell(0).text = "9" 
       ..insertCell(1).text = "aaa" 
       ..insertCell(2).text = "bbb" 
       ..insertCell(3).text = "ccc"; 

tBody2.insertRow(1)..insertCell(0).text = "9" 
       ..insertCell(1).text = "aaa" 
       ..insertCell(2).text = "bbb" 
       ..insertCell(3).text = "ccc"; 

tBody2.insertRow(2)..insertCell(0).text = "9" 
       ..insertCell(1).text = "aaa" 
       ..insertCell(2).text = "bbb" 
       ..insertCell(3).text = "ccc";