प्रोग्रामिंग, सवालों के जवाब में मदद करें / jQuery / डेटाटेबल टूल टिप दूसरे पेज में काम नहीं कर रही है। केवल पहले पृष्ठ पर काम करता है - jquery, टूलटिप, डेटाटैबल्स

डेटाटेबल टूल टिप दूसरे पेज में काम नहीं कर रही है। केवल प्रथम पृष्ठ का काम करता है - jquery, टूलटिप, डेटाटेबल्स

मुझे कुछ अजीब समस्या हो रही है जहां टूल टिप केवल पृष्ठ 1 पर काम कर रहा है। अगर मैं अगले पेज पर क्लिक करता हूं, तो मुझे कोई टूल टिप दिखाई नहीं देता है।

मैं jquery dataTable का उपयोग कर रहा हूं। मेरा नमूना कोड jsfiddle में है: http://jsfiddle.net/agorur/3r54F/

कोई विचार ?

var data = {
"sEcho": 1,
"iTotalRecords": 6416,
"iTotalDisplayRecords": 5,
"aaData": [{
"0": 421367,
"1": "Test1",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421368,
"1": "Test2",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421369,
"1": "Test3",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421370,
"1": "Test4",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:13 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421371,
"1": "Test5",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:13 GMT",
"5": "TestBench",
"6": "NA"
},{
"0": 421372,
"1": "Test1",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421373,
"1": "Test2",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421374,
"1": "Test3",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:12 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421375,
"1": "Test4",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:13 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421376,
"1": "Test5",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:13 GMT",
"5": "TestBench",
"6": "NA"
},
{
"0": 421377,
"1": "Test4",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:13 GMT",
"5": "TestBench",
"6": "NA"
}, {
"0": 421378,
"1": "Test5",
"2": "NEW",
"3": "Default",
"4": "18 Aug 2011 20:27:13 GMT",
"5": "TestBench",
"6": "NA"
}]
};

$(document).ready(function () {
$("#events").dataTable({
"bProcessing": true,
"aaData": data.aaData,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"aoColumns": [{
"mData": "0"
}, {
"mData": "1"
}, {
"mData": "2"
}, {
"mData": "3"
}, {
"mData": "4"
}, {
"mData": "5"
}, {
"mData": "6"
}, ]
});


$("#events tbody tr").each(function () {
this.setAttribute("title", "ToolTip");
});
});

उत्तर:

उत्तर № 1 के लिए 6

यदि मैं अगले पृष्ठ पर क्लिक करता हूं, तो मुझे कोई टूल टिप नहीं दिखाई देता है।

ऐसा इसलिए है क्योंकि आपके दस्तावेज़ में शीर्षक विशेषता सेट कर रहे हैं। पहले से ही फ़ंक्शन ... इसलिए यह सभी के लिए काम करता है <tr> जो दस्तावेज तैयार होने पर पाया जाता है, न कि उन लोगों के लिए जो अगले पेज पर आते हैं जो आपके अगले प्रेस के दौरान आते हैं ...

एक तरह से चारों ओर एक समारोह बनाने के लिए और यह दस्तावेज़ में पहले से ही क्लिक करें और अगले क्लिक करें ... (हालांकि एक आकर्षक तरीका नहीं है ..) (आपको प्रिव क्लिक के लिए भी इसकी आवश्यकता हो सकती है)

इसे इस्तेमाल करे

function toolTip() {
$("#events tbody tr").each(function () {
this.setAttribute("title", "Ajay");
});
}

$(document).ready(function () {
...
toolTip(); //<--- call this when document is ready so it gets all tr
$(".next").click(function () {
toolTip();  //and in next click which gets for next tr
});
});

fiddlehere

उत्तर № 2 के लिए 1

मुझे पता है कि यह थोड़ा देर से है, लेकिन मैं बस एक समान मुद्दे में भागता हूं और यह होगा कि मेरा समाधान आपके मामले पर कैसे लागू होता है।

डेटाटेबल्स में एक $ फ़ंक्शन होता है जो नियमित jQuery $ फ़ंक्शन की तरह काम करता है, सिवाय इसके कि यह डेटा टेबल के उस उदाहरण तक सीमित है। http://datatables.net/api डेटा तालिका की प्रत्येक पंक्ति का चयन करने के लिए आप "डी करते हैं" $("#id").dataTable().$("tr");

हर बार यूजर नेक्स्ट पर क्लिक करने के बजाए टाइटल विशेषता का उपयोग करते हुए इसे एक बार सौंपा जाता है। यह डेटा टेबल के सभी पृष्ठों पर भी काम करता है।

आपके कार्यान्वयन के लिए यह इस तरह से काम करेगा:jsFiddle)

$(document).ready(function () {
$("#events").dataTable({
"bProcessing": true,
"aaData": data.aaData,
"bJQueryUI": true,
"sPaginationType": "full_numbers",
"aoColumns": [{
"mData": "0"
}, {
"mData": "1"
}, {
"mData": "2"
}, {
"mData": "3"
}, {
"mData": "4"
}, {
"mData": "5"
}, {
"mData": "6"
}, ]
}).$("tr").each(function () {
this.setAttribute("title", "Ajay");
});
});

उत्तर № 3 के लिए 1

एक बेहतर उपाय

इस कोड को अपने डेटाटैबल्स में शामिल करें

"drawCallback": function( settings ) {

toolTipShow(); // your tootlip function.

},

उत्तर के लिए 1 № 4

प्रारंभिक टूलटिप को हर बार तालिका को फिर से तैयार किया जाता है।

$("#your-datatable-id").on("draw.dt", function() {
$("[data-toggle="tooltip"]").tooltip(); // Or your function for tooltips
});

जवाब के लिए 0 № 5

बस अपनी js फ़ाइल में या अपनी स्क्रिप्ट के भीतर निम्नलिखित कोड जोड़ें।

$ ( "एक [rel =" टूलटिप "]") टूलटिप ()।

लेकिन डॉन "t इसे डॉक्यूमेंट.ड्रेड () फ़ंक्शन में शामिल करता है

डेटाटेबल टूल टिप दूसरे पेज में काम नहीं कर रही है। केवल प्रथम पृष्ठ का काम करता है - jquery, टूलटिप, डेटाटेबल्स

उत्तर:

संबंधित सवाल