php - JQuery Datatables फ़ंक्शन को रेंडर करने के दौरान एक और अधिक लिंक पढ़ें



codeigniter (1)

आप इस कोड को संदर्भित कर सकते हैं

$(function() {

  var minimized_elements = $('p.minimize');

  minimized_elements.each(function() {
    var t = $(this).text();
    if (t.length < 100) return;

    $(this).html(
      t.slice(0, 100) + '<span>... </span><a href="#" class="more">More</a>' +
      '<span style="display:none;">' + t.slice(100, t.length) + ' <a href="#" class="less">Less</a></span>'
    );

  });

  $('a.more', minimized_elements).click(function(event) {
    event.preventDefault();
    $(this).hide().prev().hide();
    $(this).next().show();
  });

  $('a.less', minimized_elements).click(function(event) {
    event.preventDefault();
    $(this).parent().hide().prev().show().prev().show();
  });

});

मैं इस जावास्क्रिप्ट कोड का उपयोग एक पाश में डेटाबेस से निकाले गए सामग्रियों की एक और अधिक लिंक जोड़ने के लिए कर रहा हूं:

<script type="text/javascript">
//continue reading
$(document).ready(function() {
    var showChar = 300;
    var ellipsestext = "...";
    var moretext = "continue reading";
    var lesstext = "collapse";
    $('.more').each(function() {
        var content = $(this).html();
        if(content.length > showChar) {
            var c = content.substr(0, showChar);
            var h = content.substr(showChar-1, content.length - showChar);
            var html = c + '<span class="moreellipses">' + ellipsestext+ '&nbsp;</span><span class="morecontent"><span>' + h + '</span>&nbsp;&nbsp;<a href="" class="morelink">' + moretext + '</a></span>';
            $(this).html(html);
        }
    });

    $(".morelink").click(function(){
        if($(this).hasClass("less")) {
            $(this).removeClass("less");
            $(this).html(moretext);
        } else {
            $(this).addClass("less");
            $(this).html(lesstext);
        }
        $(this).parent().prev().toggle();
        $(this).prev().toggle();
        return false;
    });
});
</script>

सीएसएस

a.morelink {
    text-decoration:none;
    outline: none;
 }
 .morecontent span {
    display: none;
 }

और मुझे हमेशा ऐसा करना पड़ता था, उदाहरण के लिए:

    <?php 
    $posts = $this->db->get_where('posts', array('display' => 'true'))->result_array();     
    foreach ($posts as $p) { ?>
        <div class="more"> <?php echo $p['comment']; ?></div>
        <hr/>
    <?php } ?> 

... और यह हमेशा काम करता है

अब, मैं अपने डेटाबेस से सर्वर-साइड प्रसंस्करण के साथ टिप्पणियां प्रदर्शित करने के लिए जेक्जरी डेटाटेबल का उपयोग कर रहा हूं। प्रदर्शन से पहले डेटा को प्रारूपित करने के लिए मैं रेंडर फ़ंक्शन का भी उपयोग कर रहा हूं। मेरे पास यह है:

<script type="text/javascript">
    "columnDefs": [
            { "targets": [1, 2, 3, 4, 5], className: "dt-hide-column" }, //hide columns, show all data inside first column - full[0] 
            { 
                "targets": [0],
                "orderable": false,
                "render": function ( data, type, full ) {
                    return '<div class="panel panel-default">' +
                    '<div class="panel-heading">' +
                    '<div class="row">' +
                    '<div class="col-md-1">' +
                    full[1] +                   
                    '</div>' +  
                    '<div class="col-md-11">' +        
                    '<span style="color: black"> Commented by: </span>' +                    
                    full[2] + '<br/>' +         
                    full[3] + ' (' + full[4] + ')' +
                    '</div>' +
                    '</div>' +
                    '</div>' +                  
                    '<div class="panel-body">' + 
                    '<div class="more">' + //this is where I want the action performed 
                    full[5] + //the comment
                    '</div>' +                  
                    '</div>';
                    '</div>';
                }
            }
    ]
</script>

हमेशा की तरह, मैं पेज लोड पर 300 वर्णों पर टिप्पणी को छोटा करना चाहता हूं ताकि लिंक पर क्लिक किया जा सके ताकि क्लिक पर पूर्ण टिप्पणी प्रकट हो। मुझे आश्चर्य हुआ जब यह अपेक्षित रूप से काम नहीं करता। यह सभी टिप्पणी को प्रदर्शित करता है, और कोई भी 'पढ़ना जारी रखने' लिंक नहीं दिखाता, भले ही टिप्पणियों में वर्ण 300 से अधिक थे। मेरे जीवन के लिए, मुझे पता नहीं क्यों हो सकता है मैं हालांकि जेएस के लिए नया हूँ कृपया क्या मुझे सही दिशा में इंगित करने के लिए पर्याप्त होना चाहिए? नोट: मैं कोड इग्नेटर फ्रेमवर्क का उपयोग करता हूं, अगर इससे कोई फर्क नहीं पड़ता त्वरित संपादन: मेरे पास शीर्ष लेख में पढ़ना जारी रखने की सुविधा है और सीएसएस फ़ाइल में शैली है।





datatables