image in grid won't show

Questionsimage in grid won't show
BiLe asked 2 years ago

Hello,

I am trying to show an image, but frontend only returns:

<img src=”undefined”>

The “intro-image” fields value would be for example ‘images/videos/video-id-9.jpg’.

Did I miss something?

In addition: is it possible to use crop/scale with image upload? I will need some images in a specific size.

$col = array();
$col[“title”] = “intro_image”; // caption of column
$col[“name”] = “intro_image”; // grid column name, must be exactly same as returned column-name from sql (tablefield or field-alias)
$col[“width”] = “50”;
$col[“align”] = “left”;
$col[“search”] = false;
$col[“sortable”] = false;
$col[“editable”] = true;
$col[“edittype”] = “image”; // render as textarea on edit
$col[“upload_dir”] = “images/temp”; // upload here
//$col[“editoptions”] = array(“rows”=>2, “cols”=>20); // with these attributes
//$col[“editoptions”] = array(“size”=>20); // with default display of textbox with size 20
//$col[“editrules”] = array(“required”=>true); // required:true(false), number:true(false), minValue:val, maxValue:val
$col[“formatter”] = “function(cellval,options,rowdata){ return ‘<img src=\”‘+cellval+’\” />’; }”;
$col[“formatoptions”] = array(“width”=>’160′,”height”=>’90’);
//$col[“hidden”] = true; // don’t show this column in list, but in edit/add mode
//$col[“editrules”] = array(“edithidden”=>true); // don’t show this column in list, but in edit/add mode
//$col[“export”] = true;
//$col[“template”] = “<img height=20 src=’http://mydomain.de/’>&#8221;; // make this a custom column with no relation to database
$cols[] = $col;

 

5 Answers
BiLe answered 2 years ago

Tried this, where {intro_image} is supposed to be the value in database:

$col[“default”] = “<img width=160 height=90 src=’http://www.mydomain.de/{intro_image}’ >”;

Will not work either.

Should I use the formatter or default? Difference?

Abu Ghufran Staff answered 2 years ago

Hello,

To use image in datagrid, You need 2 fields.

Referring this demo code: https://www.gridphp.com/demo/demos/editing/file-upload.phps

One for file add/edit purpose which is not shown in listing (line 96-108)

And other one for displaying purpose which is actually shown on listing (line 110-147)

In the later column, You can have this code with placeholder in default property {intro_image}.

_________________________
Abu Ghufran - Dev Team
Grid 4 PHP Framework
 
Abu Ghufran Staff replied 2 years ago

PS: I’m adding the crop feature in todos.

BiLe answered 2 years ago

Hello,

thank you for adding the crop feature.

I have looked at the example and tried to replicate, but there still has to be something wrong with my code.

As said, I have a database column “intro_image” with value e.g. “images/videos/myvideo.jpg”. I would like to display the image inside the grid and on click link to another page.

Right now I am getting “None” as output 🙂

// intro_image
$col = array();
$col[“title”] = “intro_image”; // caption of column
$col[“name”] = “intro_image”; // database field name
$col[“show”] = array(“list”=>false,”edit”=>true,”add”=>true); // show in list, edit, add
$col[“resizable”] = true;
$col[“width”] = “50”;
$col[“align”] = “left”;
$col[“search”] = false;
$col[“sortable”] = false;
$col[“editable”] = true;
$col[“edittype”] = “file”;
$col[“upload_dir”] = “images/temp”;
$col[“editrules”][“allowedext”] = “png,jpeg,jpg”; // comma separated list of extensions
$col[“editrules”][“allowedsize”] = 5 * 640 * 360; // allowed size in bytes e.g. 3 MB = 3 x 1024 x 1024
$cols[] = $col;

// virtual column
$col = array();
$col[“title”] = “image”;
$col[“name”] = “image”;
$col[“width”] = “360”;
$col[“editable”] = true;
$col[“on_data_display”] = array(“display_image”,””);
function display_image($data) {
$upload_url = explode(“/”,$_SERVER[“REQUEST_URI”]);
array_pop($upload_url);
$upload_url = implode(“/”,$upload_url).”/”;
$file = $data[“intro_image”];
$arr = explode(“.”,$file);
$ext = $arr[count($arr)-1];

if (empty($file))
return “None”;
else if (strtolower($ext) == “doc” || strtolower($ext) == “xls” || strtolower($ext) == “docx” || strtolower($ext) == “xlsx” || strtolower($ext) == “pdf”)
return “<a href=’$upload_url/$file’ target=’_blank’>Download File</a>”;
else if (strtolower($ext) == “png” || strtolower($ext) == “jpg” || strtolower($ext) == “jpeg”)
return “<a href=’$upload_url/$file’ target=’_blank’><img height=50 src=’$upload_url/$file’></a>”;
else
return $file;

}
$col[“show”] = array(“list”=>true,”edit”=>false,”add”=>false,”view”=>true);
$col[“editoptions”][“dataInit”] = “function(o){jQuery(o).parent().html(o.value);}”;
$cols[] = $col;

BiLe answered 2 years ago

I think I found one mistake I made. I need to select all columns I want to show:

$g->select_command = “SELECT
title
FROM
pages
WHERE
app_id = 6
“;

Abu Ghufran Staff answered 2 years ago

Thanks correct. If you provide sql query, only selected fields will be there in dataset.

I’ve sent you latest build as well.

_________________________
Abu Ghufran - Dev Team
Grid 4 PHP Framework
 
Your Answer

16 + 2 =

Login with your Social Id:

OR, enter

Attach code here and paste link in question.
Attach screenshot here and paste link in question.



How useful was this discussion?

Click on a star to rate it!

Average rating 0 / 5. Vote count: 0

No votes so far! Be the first to rate it.

We are sorry that this post was not useful for you!

Let us improve this post!

Tell us how we can improve this post?