Image in a Tooltip on a row with server-side

Image in a Tooltip on a row with server-side

SofSof Posts: 5Questions: 0Answers: 0
edited August 2011 in Plug-ins
Hi all and if it not been said enough : bravo for your work Allan!
I just ask for your help because I can look over.
I try to add a tooltip on a link in a cell but I can not. Here is my code (yes there are a lot of things but I need all)
[code]

$(document).ready(function() {

//Fonctions tableau
TableToolsInit.sSwfPath = "../Scripts/media/swf/ZeroClipboard.swf";

var oTable;
var gaiSelected = [];

/* Init the table */
var oTable = $(".dataTable").dataTable({
"sDom": 'T<"clear">lfrtip<"clear spacer">T',
"oLanguage": {
"sUrl": "../Scripts/fr_FR.txt"
},
"bProcessing": true,
"bServerSide": true,
// "sDom": 'Rlfrtip',
"sAjaxSource": "../include/json_liste.php<?php echo (isset($_SESSION['idlist'])) ? "?entrepot=".$_SESSION['idlist'] : ""; ?>",
"bStateSave": true,
// "bAutoWidth" : false,

"sPaginationType": "full_numbers",
"aoColumnDefs": [ /*colonne Id */
{
"bVisible": 0,
"aTargets": [ 0 ]

},
{
"sWidth" : "10%",
"sClass" : "center",
"fnRender": function ( oObj ) {

return '' + oObj.aData[1] + '';

},
"aTargets": [ 1 ]

},
{

"sWidth" : "5%",
"sClass" : "center",
"fnRender": function ( oObj ) {


return '' + oObj.aData[2] + '';

},

"aTargets": [ 2 ]

},
{ "sWidth" : "30%", "sClass" : "center", "aTargets": [ 3 ] },
{ "sWidth" : "5%", "sClass" : "center", "aTargets": [ 4 ] },
{ "sWidth" : "6%", "sClass" : "center", "aTargets": [ 5 ] },
{ "sWidth" : "5%", "sClass" : "center", "aTargets": [ 6 ] },
{// Commentaires Admin

"sWidth" : "15%",
"sClass" : "divvert",
"fnRender": function ( oObj ) {

return '>' + oObj.aData[7] + '';

},

"aTargets": [ 7 ]

},
{// Commentaires Entrepot

"sWidth" : "15%",
"sClass" : "divorange",
"fnRender": function ( oObj ) {

return '>' + oObj.aData[8] + '';

},

"aTargets": [ 8 ]

},
{// Correction Stock

"sWidth" : "3%",
"sClass" : "center",
"bSortable": false,
"bSearchable": false,
"fnRender": function ( oObj ) {

return ' ';

},

"aTargets": [ 9 ]

},
{// Déplacement article

"sWidth" : "3%",
"sClass" : "center",
"bSortable": false,
"bSearchable": false,
"fnRender": function ( oObj ) {

return '';

},
"aTargets": [ 10 ]

},
{// Supprimer article

"sWidth" : "3%",
"sClass" : "center",
"bSortable": false,
"bSearchable": false,
"fnRender": function ( oObj ) {

return '' +
'';

},

"aTargets": [ 11 ]

}

],
"fnDrawCallback": function () {
//Champs d'edition
$('.edit').editable( 'upd_com.php?commentaire=<?php echo $_SESSION['MM_UserGroup'] != "1" ? "entrepot" : "admin"; ?>' , {
type : 'textarea',
cancel : 'Cancel',
submit : 'OK',
indicator : '',
tooltip : 'Ajouter un commentaire...',
height : "14px"
} );

$('.tooltip').tooltip({
delay: 0,
showURL: false,
bodyHandler: function() {
return $("").attr("title", this.src);
}
});

},
"fnRowCallback": function( nRow, aData, iDisplayIndex ) {
if ( jQuery.inArray(aData[0], gaiSelected) != -1 )
{
$(nRow).addClass('row_selected');
}
return nRow;

}

});

});

[/code]
I try to put a preview of the product image. The image file is named by his ' + reference + '.jpg'; where reference is equal to aaData[2]
All works fine except the tooltip.
Thx for ur help

Replies

  • fbasfbas Posts: 1,094Questions: 4Answers: 0
    I'm not too familiar with tooltips and the body handler, and I wonder if it needs a string returned and that return $("").attr("title", this.src); is not doing the job

    try
    [code]
    return ($("").attr("title", this.src))[0]; // in playing with the debugger, DOM elements did a better job of converting to string, but I don't know if they will work for what you need.
    [/code]


    if this doesn't work, you might create a temporary parent element, add your img to it, then get parent.innerHTML in order to get the correct html string
  • SofSof Posts: 5Questions: 0Answers: 0
    edited August 2011
    thx for ur help Fbas. But this don't work.

    [quote]Uncaught TypeError: Cannot read property '0' of undefined[/quote]

    hmmm ok i understand. So i'd like to do what you suggested but my javascript knowledge are too bad to do this.
    Could you tell me more ?
  • fbasfbas Posts: 1,094Questions: 4Answers: 0
    something like $('').append(($("").attr("title", this.src)).html();

    create a parent element (the ), add your image, then get the innerHTML of the div. should give you the entire HTML of the img tag.
This discussion has been closed.