How to grab URL of "Upload Image" field with SD Concat Field?

17 Posts
L.A.Willette
9 years ago
15
Topic

Hi All,

in my site form I replaced the default Joomla field for uploading fulltext article image with a new field "Upload Image" cause I need the option "1 Folder / Content".

I first tried to store the new upload image field directly in column "images" of table #__content (with storage JSON->Article->images[image_fulltext]) but the url saved wasn't correct cause the folder content was missing (for example the url saved was always "images/post/" instead of "images/post/id of content/").

So I changed the storage of my Upload Image field (called "art_image_cover"). It is now stored in a new column named "cover" in table #__content with standard storage.

Since I need the image to be saved in fulltext article image field too... I'm trying to grab the image URL saved in "art_image_cover" with a SD Concat Field... but without success.

Till now I tried to configure the SD Concat field in 2 ways:

  1. With storage JSON->Article->images[image_fulltext] and in "List of Fields" both possible syntax #art_image_cover# and @cover(art_image_cover) the result saved in db in "images" column is {"image_fulltext":""}.
  2. With storage Standard->Article->images and in "List of Fields" this code [{"image_fulltext":"]||#art_image_cover#||["}] the result saved in db is {"image_fulltext":" "}.

Am I doing something wrong? or maybe I need another plugin like Code Pack to do what I need?
Any help or suggestion is really appreciated.

Best regards,
Luca

Get a VIP membership
9 years ago
7
Level 1

Hi,

According to my tests, if you upload the same image a second time and save the form, the correct path is saved (with JSON storage in the #__content table).

I still do not know the reason. Maybe someone from Seblod could help.

Best regards,

Ventura

17 Posts
L.A.Willette
9 years ago
6
Level 2

Hi Ventura,

thanks for telling me... I didn't notice that.

The reason could be that at first save the Image Upload field can't grab the ID of new article because the value of #art_id# does not yet exists.
Only when editing the article the value of #art_id# will be available.

I'm trying to use SD Field Concat because instead it can grab the next auto increment for new articles table thanks to the syntax <content>.
Indeed when putting this code [{"image_fulltext":"images/post/]||<content>||[/]||#art_image_cover#||["}] in "List of fields" of SD Concat Field, the result saved in db at first save is:

 {"image_fulltext":"images/post/id of new article/"}

Almost correct...only the image filename is missing :(

Best regards,
Luca

9 years ago
5
Level 3

Hi Luca,

Maybe the Code Pack can help you. I'm not sure since I've never used but the code "After store" may be promising.

Sorry I can not give you more help.

Best regards,

Ventura

17 Posts
L.A.Willette
9 years ago
4
Level 4

Hi Ventura,

I bought Code Pack and tried AfterStore but with no success cause I don't have much programming skills.

Now I'm trying another way:
I created another text field "art_images" with no storage to which i transfer the value of the Upload field "art_image_cover" through a conditional state (Filled by "art_images_cover" when "art_images_cover" is Changed).

Everything would work perfectly cause SD Concat Field grabs correctly the value from this new text field (maybe it can't grab from an Upload Image field?).

The only problem is that the text field is filled with "C:\fakepath\" before the image filename. So if I put in SD Concat Field as List of fields this code

[{"image_fulltext":"images/post/]||<content>||[/]||#art_images#||["}]

I get in db for example this {"image_fulltext":"images/post/172/C:\fakepath\testimage.jpg}

But if only I find a way to strip out "C:\fakepath\" I think it should work.

Best regards,
Luca

17 Posts
L.A.Willette
9 years ago
3
Level 5

I found a way to remove "C:\fakepath\" and grab only image filename and now I can store my Upload Image field also into Intro and Fulltext image fields at first save. Instead of using conditional states I put the following code in section Stuff->Script(JS) of my text field "art_images". It grabs the filename of image which will be uploaded and strips out "C:\fakepath\".

$("#art_image_cover").change(function() {
    $("#art_images").val(this.value.replace(/^C:\\fakepath\\/i, ''));
})<br>

Then I put the following code in SD Field Concat (storage is "Standard->Article->images").

[{"image_intro":"images/post/]||<content>||[/_thumb1/]||#art_images#||[","image_fulltext":"images/post/]||<content>||[/]||#art_images#||["}]

Fulltext image becomes original image uploaded with the Upload Image field. Intro image becomes thumbnail1.
Seems to work... I'll keep you updated if I find some problems.

Best regards,
Luca

9 years ago
2
Level 6

Hi Luca,

I have some doubts about your method when you edit an article.

Not sure 100% but...

Test the edit of first article after adding multiple items. E.g. change the image.

If you lock the edit on SD Field Concat, the image name can not be changed. Otherwise, If you unlock it, the id may change when you save.

Try it. I hope to be wrong.

Best regards,

Ventura

17 Posts
L.A.Willette
9 years ago
1
Level 7

Hi Ventura,

just tested... it works on edit article too! This means that ID of article doesn't change on edit.

I updated JS for grabbing filename cause I found that Upload Image field changes the image filename a little bit after uploading:

  1. all characters of filename are lowercase (but not file extension);
  2. spaces are replaced with "-";
  3. all illegal filename characters are removed.

So my updated JS is:

$('#art_image_cover').change(function() {
  filename = this.value.substring(0, this.value.lastIndexOf('.')).toLowerCase().replace(/^C:\\fakepath\\/i, '').replace(/\s+/g, '-').replace(/[^a-zA-Z0-9\\-]/g, '');
  extension = this.value.substring(this.value.lastIndexOf('.'));
   $('#art_images').val( filename + extension );
})

Best regards,
Luca

17 Posts
L.A.Willette
9 years ago
0
Level 8

I forgot to tell that text field (in my case "art_images") has to be stored somewhere in db (at the beginning I've set the storage to none), otherwise when editing the article but not changing the image, the image filename is missing in the final url saved in db.

Best regards,
Luca

9 years ago
6
Level 1

Hello everyone, seblod discovered recently and have to say really cool thing. Now I have installed both the code and the change in the database works. only problem is that it always installs spaces. How can it be?Thanks. I'm sorry for my english

Code1:[{"image_intro":"images/seblod/]||<content>||[/_thumb1/]||#art_images#||[","image_fulltext":"images/seblod/]||<content>||[/]||#art_images#||["}]

Code2:$('#profilfoto').change(function() { filename = this.value.substring(0, this.value.lastIndexOf('.')).toLowerCase().replace(/^C:\\fakepath\\/i, '').replace(/\s+/g,'-').replace(/\s[^a-zA-Z0-Z0-9\\-]/g,''); extension = this.value.substring(this.value.lastIndexOf('.')); $('#art_images').val( filename + extension ); })


Problem in database:{"image_intro":"images/seblod/ 17 /_thumb1/ hd_wall_8474.jpg ","image_fulltext":"images/seblod/ 17 / hd_wall_8474.jpg "}

17 Posts
L.A.Willette
9 years ago
5
Level 2

Hi paulsche,

I think you have to enter the word ns (an acronym for No Separator) into the Value Separator field, because the default character is a SPACE. Hope this helps.
Regards,

Luca

9 years ago
4
Level 3

Hi Luca, many thanks for the quick response. I have not fully understood. Can you maybe take a picture? Thank You

17 Posts
L.A.Willette
9 years ago
3
Level 4

Sure... here it is

Regards,
Luca

9 years ago
2
Level 5

Hi Luca, 

super thank you very much it works !!!

17 Posts
L.A.Willette
9 years ago
1
Level 6

Great! glad to hear that :)

9 years ago
0
Level 7

Hi Luca, everything works but when I create a gallery to cut and paste a photo in the Gallary I always get the images entered in table "{" image_intro ":" images / seblod / 17 / _thumb1 / "," image_fulltext ":" images / seblod / 17 / "}". What can it be?

Get a VIP membership