मेरे पास एक टेबल है जिसमें 2 <td>
का एक चेकबॉक्स है और अन्य का मूल्य है:
मेरी तालिका इस प्रकार है:
<table border="1" id="table_sundry">
<tr>
<td><input type="checkbox" id="chk_1"></td>
<td id="val1">a</td>
</tr>
<tr>
<td><input type="checkbox" id="chk_2"></td>
<td id="val2">b</td>
</tr>
<tr>
<td><input type="checkbox" id="chk_3"></td>
<td id="val3">c</td>
</tr>
<tr>
<td><input type="checkbox" id="chk_4"></td>
<td id="val4">d</td>
</tr>
<tr>
<td><input type="checkbox" id="chk_5"></td>
<td id="val3">e</td>
</tr>
</table>
<input type="button" id="btn_del" value="deleterow">
मेरे पास उस विशेष पंक्ति की जाँच करने के बाद पंक्तियों को हटाने के लिए एक बटन है।
हटाने के रूप में मैं क्या कर रहा है:
$("#btn_del").click(function(){
var checked = $("#table_sundry tr input:checked").size();
var total = $("#table_sundry tr").size()-1;
var rowcnt = document.getElementById("table_sundry").rows.length-1;
var flag = 0;
if($("#chk_"+rowcnt).prop('checked') == true){ //if delete contains last row
$("#table_sundry tr input:checked").parents('tr').remove();
flag =1;
//updateRowCount(flag);
}
else{
$("#table_sundry tr input:checked").parents('tr').remove();
//updateRowCount(flag);
}
});
कॉमा को अलग करते हुए मुझे दूसरे कॉलम के मूल्यों को संग्रहीत करने की आवश्यकता है। मान लीजिए अगर मैं पहला और आखिरी कॉलम हटाता हूं तो मुझे चर में a,e
मिलना चाहिए।
संदर्भ देखें: FIDDLE
3 जवाब
JS Fiddle: https://jsfiddle.net/7ft6qtja/2/
एचटीएमएल
<table border="1" id="table_sundry">
<tr>
<td><input type="checkbox" id="chk_1"></td>
<td id="val1">a</td>
</tr>
<tr>
<td><input type="checkbox" id="chk_2"></td>
<td id="val2">b</td>
</tr>
<tr>
<td><input type="checkbox" id="chk_3"></td>
<td id="val3">c</td>
</tr>
<tr>
<td><input type="checkbox" id="chk_4"></td>
<td id="val4">d</td>
</tr>
<tr>
<td><input type="checkbox" id="chk_5"></td>
<td id="val3">e</td>
</tr>
</table>
<input type="button" id="btn_del" value="deleterow">
जावास्क्रिप्ट
var values = [];
var csv = ""; // Store Comma separated values in this variable;
$(document).ready(function(){
$("#btn_del").click(function(){
var checkboxes = $("#table_sundry tr input:checked");
if (checkboxes.length > 0) {
$.each(checkboxes, function (index, checkbox) {
var tr = $(checkbox).closest("tr");
var value = tr.find("td:eq(1)").html();
values.push(value);
csv = values.join();
tr.remove();
});
alert(csv);
}
else {
alert("Please select an item.");
}
});
});
हम इसका उपयोग करके भी इसे हल कर सकते हैं
var value=[];
var allValue;
$('#btn_del').click(function (){
$("table tr :checkbox:checked").each(function (){
var attrValue=$(this).closest('tr').find("td:eq(1)").attr('id') ;
console.log('value is'+attrValue);
value.push($('#'+attrValue).html());
allValue=value.join();
alert('Values Are'+allValue);
if($(this).closest('tr').length>0){
$(this).closest('tr').remove();
}
});
छोटे बदलाव करके आप इसे हासिल करेंगे
<table border="1" id="table_sundry">
<tr>
<td><input type="checkbox" value='a' id="chk_1"></td>
<td id="val1">a</td>
</tr>
<tr>
<td><input type="checkbox" value='b' id="chk_2"></td>
<td id="val2">b</td>
</tr>
<tr>
<td><input type="checkbox" value='c' id="chk_3"></td>
<td id="val3">c</td>
</tr>
<tr>
<td><input type="checkbox" value='d' id="chk_4"></td>
<td id="val4">d</td>
</tr>
<tr>
<td><input type="checkbox" value='e' id="chk_5"></td>
<td id="val3">e</td>
</tr>
और इस तरह से jquery
$(document).ready(function(){
$("#btn_del").click(function(){
var checked = $("#table_sundry tr input:checked").size();
var total = $("#table_sundry tr").size()-1;
var values="";
var rowcnt = document.getElementById("table_sundry").rows.length-1;
var flag = 0;
if($("#chk_"+rowcnt).prop('checked') == true){ //if delete contains last row
console.log("ëe"+ $("#chk_"+rowcnt).prop('value'));
$("#table_sundry tr input:checked").parents('tr').remove();
flag =1;
//updateRowCount(flag);
}
else{
var vals=$("#table_sundry tr input:checked");
for(var i=0;i<vals.length;i++){
if(i>0)
values+=",";
values+=vals[i].value;
}
console.log(values);
$("#table_sundry tr input:checked").parents('tr').remove();
//updateRowCount(flag);
}
});
});
वैरिएबल में वैल्यू में कॉमा सेपरेटेड वैल्यूज होती हैं
संबंधित सवाल
नए सवाल
jquery
jQuery एक जावास्क्रिप्ट लाइब्रेरी है, जावास्क्रिप्ट टैग को जोड़ने पर भी विचार करें। jQuery एक लोकप्रिय क्रॉस-ब्राउज़र जावास्क्रिप्ट लाइब्रेरी है, जो दस्तावेज़ ऑब्जेक्ट मॉडल (DOM) ट्रैवर्सल, इवेंट हैंडलिंग, एनिमेशन और AJAX इंटरैक्शन को ब्राउज़रों की विसंगतियों को कम करके सुविधाजनक बनाता है। JQuery से संबंधित एक प्रश्न jQuery से संबंधित होना चाहिए, इसलिए jQuery को प्रश्न में कोड द्वारा उपयोग किया जाना चाहिए और कम से कम jQuery के उपयोग से संबंधित तत्वों को प्रश्न में होना चाहिए।