Jquery datatables affiche l’image dans l’une des colonnes

J’utilise des tables de données Jquery et je récupère les données du serveur avec Ajax. Fondamentalement, les données que j’envoie concernent une Order et il existe différents types de commandes.

Ce que je cherche à faire est d’envoyer le Order type avec les données de la commande et d’afficher une image côté client.

J’ai deux types principaux, Surplus et Deficit . J’ai les deux images en tant que contenu statique côté client et, du serveur, je peux obtenir les données. Je ne suis pas sûr de savoir comment l’afficher.

Voici comment je récupère les données du serveur

 $('#matchOrderedTable').dataTable({ "ajax": { "url": TippNett.Api.Url + "Match/DataTable", "data": function (d) { d.token = authToken; } }, "columns": [ { "data": "Created" }, { "data": "Amount" }, { "data": "OrderOrg" }, { "data": "OrderMatchedOrg" }, { "data": "OrderLoc" }, { "data": "OrderMatchLoc" }, ] });

et ma vue ressemble à ceci

    @Texts.Created  @Texts.Amount  @Texts.Organizations  @Texts.MatchedOrg  @Texts.Locations  @Texts.MatchedLoc

Des idées ou des exemples sur la façon de le faire?

Essayez d’utiliser la propriété columns.render afin de pouvoir créer une fonction personnalisée pour effectuer votre logique de vérification du type de commande, puis renvoyer la représentation chaîne correcte de votre image.

Exemple (mis à jour pour correspondre au commentaire ci-dessous)

Dans votre code de déclaration de table, ajoutez une colonne pour le type de commande.

 $('#matchOrderedTable').dataTable({ "ajax": { "url": TippNett.Api.Url + "Match/DataTable", "data": function (d) { d.token = authToken; } }, "columns": [ { "data": "Created" }, { "data": "Amount" }, { "data": "OrderOrg" }, { "data": "OrderMatchedOrg" }, { "data": "OrderLoc", render: getImg }, { "data": "OrderMatchLoc", render: getImg } ] });

Le code de fonction de rendu de colonne. La propriété data stocke les données de ligne sous forme d’object, utilisez-la pour accéder à la valeur du type d’ordre.

UPDATE: même s’il n’y a pas de colonne pour OrderType vous pouvez toujours accéder à la valeur de l’object dans le paramètre data .

 function getImg(data, type, full, meta) { var orderType = data.OrderType; if (orderType === 'Surplus') { return ''; } else { return ''; } }

Espérons que cela aide.