2017-07-19 5 views
5

मैं केवल एक विशेष कॉलम स्थानांतरित करना चाहता हूं। क्रिप्या मेरि सहायता करे।पंक्ति में विशिष्ट कॉलम कैसे प्राप्त करें और इसे किसी अन्य तालिका में स्थानांतरित करें

btnAdd.on('click', function() { 

         var trItem = $(this).closest("tr").clone(); 
         trItem.find("input").remove(); 
         trItem.add("<tr>").append("</tr>"); 

         $("#products").append(trItem); 

         console.log(btnAdd); 

}) 

आप बहुत बहुत धन्यवाद:

यहाँ मेरी कोड है।

+0

$ उपयोग करने का प्रयास (यह) .closest ("tr") को हटाने();। इसके बजाए, अब क्या हो रहा है? कृपया निर्दिष्ट करें कि क्या काम नहीं कर रहा है। –

+0

आपकी त्वरित प्रतिक्रिया के लिए बहुत बहुत धन्यवाद। यह पूरी पंक्ति हो रही है। मैं सिर्फ 2 विशिष्ट कॉलम दिखाना चाहता हूं। –

+0

तो आप दूसरी तालिका में एक नई पंक्ति जोड़ना चाहते हैं, जिसमें केवल एक सेल है जो स्रोत तालिका की पंक्ति में किसी विशेष सेल की एक प्रति है? '.append (" ") 'समझ में नहीं आता है। याद रखें कि आप HTML की अंतर्निहित स्ट्रिंग में हेरफेर नहीं कर रहे हैं, आप डोम में हेरफेर कर रहे हैं, इसलिए एक बंद टैग जोड़ने की कोशिश करना समझ में नहीं आता है। – nnnnnn

उत्तर

0

आपको सभी कोशिकाओं को क्लोन करने की आवश्यकता है निर्दिष्ट करने की आवश्यकता है।

फ़ंक्शन "funcCloneRow" एक पंक्ति (tr) क्लोन करेगा और "tdKeyArr" द्वारा सेल की सामग्री जोड़ देगा। याद रखें कि "tdKeyArr" एक सरणी शामिल कोशिकाओं की स्थिति चुना, इस तरह है:

$(function() { 
 
\t var funcCloneRow = function($table1, $table2, trIndex, tdKeyArr) { 
 
\t \t // define. If tdKeyArr == undefinded, all the cell in choosen tr will be cloned 
 
\t \t if($table1 == undefined || $table2 == undefined || trIndex == undefined) { 
 
\t \t \t return; 
 
\t \t } 
 
\t \t // clone row 
 
\t \t var $tr = $table1.find('tr').eq(trIndex).clone(); 
 
\t \t // get cell content 
 
\t \t if(tdKeyArr != undefined) { 
 
\t \t \t $tr.children('td').text(''); 
 
\t \t \t for (var i = 0; i < tdKeyArr.length; i++) { 
 
\t \t \t \t $tr.children('td').eq(tdKeyArr[i]).html($table1.find('tr').eq(trIndex).children('td').eq(tdKeyArr[i]).html()); 
 
\t \t \t } 
 
\t \t } 
 
\t \t // append new row to second table 
 
\t \t if ($table2.children('tbody').length) { 
 
\t \t \t $table2.children('tbody').append($tr); 
 
\t \t } 
 
\t \t else { 
 
\t \t \t $table2.append($tr); 
 
\t \t } 
 
\t } 
 
\t $('table button').on('click', function(event) { 
 
\t \t funcCloneRow($('#table1'), $('#table2'), $(this).closest('tr').index(), [$(this).parent().index(), 1]); 
 
\t }); 
 
});
table { 
 
\t float:left; 
 
\t margin-right:100px; 
 
\t border-collapse:collapse; 
 
\t text-align:center; 
 
\t vertical-align:top; 
 
} 
 
table th, 
 
table td { 
 
\t border:1px solid #000; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> 
 
<body> 
 
\t <table id="table1"> 
 
\t \t <tr> 
 
\t \t \t <th>head 1</th> 
 
\t \t \t <th>head 2</th> 
 
\t \t \t <th>head 3</th> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>row 1</td> 
 
\t \t \t <td>row 1</td> 
 
\t \t \t <td><button>Append</button></td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>row 2</td> 
 
\t \t \t <td>row 2</td> 
 
\t \t \t <td><button>Append</button></td> 
 
\t \t </tr> 
 
\t \t <tr> 
 
\t \t \t <td>row 3</td> 
 
\t \t \t <td>row 3</td> 
 
\t \t \t <td><button>Append</button></td> 
 
\t \t </tr> 
 
\t </table> 
 
\t <table id="table2"> 
 
\t \t <tr> 
 
\t \t \t <th>head 1</th> 
 
\t \t \t <th>head 2</th> 
 
\t \t \t <th>head 3</th> 
 
\t \t </tr> 
 
\t </table> 
 
</body>

संबंधित मुद्दे

 संबंधित मुद्दे