Alpha Video Training
Results 1 to 10 of 10

Thread: Dynamic image in list

  1. #1
    "Certified" Alphaholic Tom Henkel's Avatar
    Real Name
    Tom Henkel
    Join Date
    May 2002
    Location
    New Jersey, USA
    Posts
    1,858

    Default Dynamic image in list

    Pardon the newbe.

    I am working on my 1st web application.

    I have a dbf table from which I display specific fields. This works just fine.

    The list is an employee list, and I thought it would be great to attach an image of the employee to the list, so I created a dynamic image item as part of the list.

    The photos are stored in a separate folder and are Identified by their employee ID. Example: Mine is "\\cosmo\personnel\v9pers\photo\ee_0433.jpg".

    If I hardcode that full path into the image definition, MY face will appear with everyone in the agency.

    How do I create a dynamic filename based on the employee ID.

    To define the file name, I do a "padl(alltrim(str(emp_id)),4,")") and then wrap it with the folder and .jpg.

    image definition.jpgList Display.jpg

    There is most likely a very simple explanation, but I can't seem to find it

    Thanks,

    Tom

  2. #2
    "Certified" Alphaholic
    Real Name
    David Kates
    Join Date
    Apr 2008
    Location
    Unionville, ON
    Posts
    7,546

    Default Re: Dynamic image in list

    I don't think that's how you want to do this. The Dynamic Image isn't really built for interpreting Image Names in the Condition area.

    Instead... in the Fields section of the List Control, click on your emp_id field, and change it Control Type to image. You Image Data type property will read "Name" and you can set an "Image file transformation template". For me, my images are found under the Webroot in a folder named images... and so my template is...

    Code:
    images/<value>.png
    Then your emp_id field simply gets added to your List Layout.

  3. #3
    "Certified" Alphaholic Tom Henkel's Avatar
    Real Name
    Tom Henkel
    Join Date
    May 2002
    Location
    New Jersey, USA
    Posts
    1,858

    Default Re: Dynamic image in list

    David,
    Thanks, but my issue is that the image file name is only based on the emp-id field. The emp-id number is not the complete name of the image file. The emp-id ca be 3 or 4 characters, and we need to name things in a consistent manner, so we need to build the actual image file name.

    Example, My emp-id is 433. The image file name is "ee_0433.jpg".

    I have the emp-id's available in the table, but I need to build the image file name.

  4. #4
    "Certified" Alphaholic
    Real Name
    David Kates
    Join Date
    Apr 2008
    Location
    Unionville, ON
    Posts
    7,546

    Default Re: Dynamic image in list

    But that's what the Transformation Template is for... adding in extra stuff to "transform" your base data into something useable in the template.

    For example... in my database I have an emp_id field... and in 4 records I have values 1,2,3,4.

    I have images in my images folder named room-1.png, room-2.png, room-3.png, room-4.png

    My Filename Transformation Template is...

    Code:
    images/room-<value>.png
    Everything is static except for <value> which get interpreted with the value of the field... in this case the emp_id value... the employee #.

    To make things easy for yourself, if your employee numbers are actually stored as 3 or 4 digits (they shouldn't be) and your images are all stored as 4 digits (you see how you've cornered yourself)... then use SQL to always return 4 digits. Or... get rid of the zero padding on the stored image name. Doing stuff like that always causes trouble somewhere... and you're always compensating for it in one way or another.
    Last edited by Davidk; 04-27-2018 at 12:42 PM.

  5. #5
    Member jgrannis's Avatar
    Real Name
    Jeff Grannis
    Join Date
    Apr 2016
    Location
    New Iberia, LA
    Posts
    338

    Default Re: Dynamic image in list

    Or attack from the template side.
    In the template property of the column for emp_id or in the freeform layout, try to put something like {@buildEmpPhotoURL}
    Then add a javascript function that basically looks like:
    Code:
    function buildEmpPhotoURL(data) {
        return '<img src="images/ee_'+yourPadFunction(data.emp_id)+'.png">';
    }

  6. #6
    "Certified" Alphaholic Tom Henkel's Avatar
    Real Name
    Tom Henkel
    Join Date
    May 2002
    Location
    New Jersey, USA
    Posts
    1,858

    Default Re: Dynamic image in list

    OK. I see what you mean.

    I've removed the field {Photo}, and changed the properties of the field {emp_id} to Image.

    I've set the transformation template to
    Code:
    \\cosmo\personnel\v9pers\photo\ee_0<value>.jpg
    ...and now NOTHING shows at all!

    WHY can't I just create a calculated field with the image file name in it and use that?

  7. #7
    "Certified" Alphaholic Tom Henkel's Avatar
    Real Name
    Tom Henkel
    Join Date
    May 2002
    Location
    New Jersey, USA
    Posts
    1,858

    Default Re: Dynamic image in list

    Jeff,

    Are you saying to use a function in the transformation template instead of putting the code url in there?
    I'll give that a try.

  8. #8
    "Certified" Alphaholic
    Real Name
    David Kates
    Join Date
    Apr 2008
    Location
    Unionville, ON
    Posts
    7,546

    Default Re: Dynamic image in list

    If you don't want to, or can't, use the Image file transformation template... then set the Control type to RawData. Be sure to remove the Image file transformation template setting first... you never know when Alpha is going to blow up because of a setting no longer used.

    Once set to RawData... then it's up to you to put together the List Layout field Template. With my data, my Template is...

    Code:
    <img src=images/room-{emp_id}.png>

  9. #9
    Member jgrannis's Avatar
    Real Name
    Jeff Grannis
    Join Date
    Apr 2016
    Location
    New Iberia, LA
    Posts
    338

    Default Re: Dynamic image in list

    No, I meant that you could keep emp_id as a Label control type and then in the List's freeform layout use the template {@functionName} directive.
    That being said, the photos folder will need to be accessible to the web client. So \\cosmo\personnel\v9pers\photo\ won't work here.

    EDIT: ah yes, you will probably need the RawData type.

  10. #10
    "Certified" Alphaholic
    Real Name
    David Kates
    Join Date
    Apr 2008
    Location
    Unionville, ON
    Posts
    7,546

    Default Re: Dynamic image in list

    Using a function is probably the only way to adjust your emp_id padding. With your emp_id field set to RawData... in the Column Properties Template... then your Template could be...

    Code:
    {@padEmpId}
    and your function would be...

    Code:
    function padEmpId(data){
    
    var padEmpId;
    var empId = data.emp_id;
    if(empId.length==1){
    	padEmpId = "0" + empId;
    }
    
    return "<img src=images/room-" + padEmpId + ".png>";
    
    	
    }
    This works with my emp_id data coming in as 1, 2, 3, 4... and my image names being room-01.png, room-02.png, etc.

Similar Threads

  1. Dynamic image not updating in freeform list
    By Ronald Anusiewicz in forum Mobile & Browser Applications
    Replies: 1
    Last Post: 06-28-2017, 11:22 AM
  2. How do I place a Dynamic image in an xDialog list
    By Ronald Anusiewicz in forum Windows Desktop Applications
    Replies: 5
    Last Post: 11-08-2016, 11:43 AM
  3. List/Detail View with List Dynamic Image
    By mikeallenbrown in forum Mobile & Browser Applications
    Replies: 0
    Last Post: 08-29-2016, 05:24 PM
  4. Dynamic Image in List...
    By cavj1 in forum Mobile & Browser Applications
    Replies: 3
    Last Post: 05-17-2016, 05:30 PM
  5. Dynamic image in List control
    By mikeallenbrown in forum Mobile & Browser Applications
    Replies: 5
    Last Post: 05-11-2015, 02:09 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •