web-dev-qa-db-fra.com

créer des données de colonne sous forme de lien hypertexte (dataTable JQUERY)

J'essaie de faire une colonne en tant que lien hypertexte avec datatable mais sans succès.

function successCallback (responseObj) {

  $(document).ready(function() {
         $('#example').dataTable( {
        "data":responseObj ,
        "bDestroy": true,
        "deferRender": true ,
        "columns": [
                    { "data": "infomation" },
                    { "data": "weblink" },
                ]
  } );

  } );

}

J'ai besoin du lien Web pour afficher le lien et être un lien hypertexte dans cette colonne afin que les utilisateurs puissent cliquer et être redirigé vers une autre page. J'ai examiné rend mais avec moins d'informations sur les liens, je ne peux pas réussir à le faire.

J'ai aussi examiné ceci exemple mais ce n'était pas très utile.

jquerydatatablesdatatables-1.10
24
Undisputed007

Utilisation columns.render Méthode API permettant de générer dynamiquement du contenu pour une cellule.

$('#example').dataTable({
   "data": responseObj,
   "columns": [
      { "data": "information" }, 
      { 
         "data": "weblink",
         "render": function(data, type, row, meta){
            if(type === 'display'){
                data = '<a href="' + data + '">' + data + '</a>';
            }

            return data;
         }
      } 
   ]
});

Voir cet exemple pour le code et la démonstration.

53
Gyrocode.com
    $('#example').dataTable( {
  "columnDefs": [ {
    "targets": 0,
    "data": "download_link",
    "render": function ( data, type, full, meta ) {
      return '<a href="'+data+'">Download</a>';
    }
  } ]
} );

De la documentation . C'est assez clair et direct pour moi, qu'est-ce que vous ne comprenez pas? Quelles erreurs voyez-vous?

Pour un exemple plus complet, voir ici

7
ozz

Si vous souhaitez ajouter un lien basé sur d'autres données de colonne, vous pouvez utiliser l'approche ci-dessous.

$('#example').dataTable({
   "data": responseObj,
   "columns": [
      { "data": "information" }, 
      { 
         "data": "weblink",
         "render": function(data, type, row, meta){
            if(type === 'display'){
                data = '<a href="' + row.myid + '">' + data + '</a>';
            }
            return data;
         }
      } 
   ]
});

Je viens de changer le fonction de rend. data fait uniquement référence aux données de colonne actuelles, tandis que row objet correspond à une ligne entière de données. Nous pouvons donc utiliser ceci pour obtenir d'autres données pour cette ligne.

7
Adarsh Madrecha