E-PIA_ (Upload) - WEBSALE Dokumentation

ProductsInAction thrives on customers submitting their own photos. The form for this is in a separate template, which you enter in the shop configuration shop.config in the <ProductsInAction> section for the Upload parameter. It is included via WS-ExternInclude; the content is placed there within the WS-Include range. This page describes the tags that are only available in this template. Guide: Offering ProductsInAction

The upload template is only output if the call includes a product index. If it is missing, ProductsInAction returns an empty page. The link to the form therefore always belongs in the product template with &pi=~PR-ProdIndex~.

Is this visitor allowed to upload at all?

E-PIA_UPLOAD-ALLOWED is the first decision in the template. Building a form only makes sense within this range.

{E-PIA_UPLOAD-ALLOWED}
   <!-- das vollständige Upload-Formular -->
{/E-PIA_UPLOAD-ALLOWED}

{!E-PIA_UPLOAD-ALLOWED}
   <p>Ein Upload ist derzeit nicht möglich.</p>
   <p class="fehler">~E-PIA_ErrorMsg~</p>
{/!E-PIA_UPLOAD-ALLOWED}

The range only applies if all four conditions are met.

Condition	Message from `<ProductsInAction-Txt>` if it is not met
The visitor is logged in to the shop	`NotLoggedIn`
The customer account contains a name	`NoUserName`
Upload is enabled for the shop	`UploadNotActive`
The allocated storage space is not used up	`DiscUsageExceeded`

The negative range is therefore not an edge case but the normal case for every visitor who is not logged in. Output E-PIA_ErrorMsg there so the visitor also learns the reason; you can additionally link to the login.

The form

{E-PIA_UPLOAD-ALLOWED}
   <!-- Für die Adresse des Upload-Links kein Protokoll angeben -->
   <form action="//~E-PIA_UploadLink~"
         id="ws_actimg_uploadForm"
         method="post"
         enctype="multipart/form-data">

      ~E-PIA_HiddenTags(upload)~

      <label>Ihr Name: ~E-PIA_UserNameList(class="eingabe")~</label>
      <label>Bild auswählen: ~E-PIA_FileInput(class="eingabe")~</label>
      <label>Kommentar: ~E-PIA_CommentTextarea(class="eingabe")~</label>

      <p>
         Erlaubte Formate: ~E-PIA_FileFormatList~<br>
         Maximale Größe: ~E-PIA_FileMaxSize~ MB
      </p>

      <button type="submit">Jetzt hochladen</button>
   </form>
{/E-PIA_UPLOAD-ALLOWED}

Tag	Generates
`E-PIA_UploadLink`	the target address of the form, without protocol
`E-PIA_HiddenTags()`	all hidden fields required for submission
`E-PIA_UserNameList()`	the selection list for how the name is written
`E-PIA_FileInput()`	the field for selecting the file
`E-PIA_CommentTextarea()`	the text field for the comment
`E-PIA_FileFormatList`	the permitted file formats, separated by commas
`E-PIA_FileMaxSize`	the permitted file size as a number without unit

E-PIA_UploadLink intentionally returns the address without http: or https:. Write // in front of it, not the protocol. A hard-coded http:// aborts the upload in the secure order process, because the browser blocks the switch to an insecure address.

Without E-PIA_HiddenTags(upload), the upload fails. The tag sets not only the shop, mall and subshop identifiers but also the session key. If it is missing, ProductsInAction rejects the submission with the message LimitExceeded.

The parameter of E-PIA_HiddenTags() names the action. For the upload form, this is upload; for the rating form in the detail view, rating. Without a parameter, the tag only writes the identifiers and the session key, which is sufficient for a form without its own action, such as the sorting in the gallery.

The selection list for the name

E-PIA_UserNameList() builds a selection list with up to two entries: the full name from the customer account and, if the name contains a space, the abbreviated form following the pattern “First name L.”.

This lets customers decide for themselves how much of their name appears below the photo. This noticeably lowers the barrier to participation and is the reason why there is a selection list here rather than a simple input field.

Do not wrap E-PIA_UserNameList(), E-PIA_FileInput() and E-PIA_CommentTextarea() in your own select, input or textarea element. The tags bring the complete element including the field name. Whatever you write in the parentheses is added as an additional attribute, for example a CSS class or an ID.

E-PIA_FileMaxSize only outputs the configured number. You write the unit after it in the template.

Messages and confirmation

Tag	Effect
`E-PIA_ErrorMsg`	the error text for the last action
`E-PIA_InfoMsg`	the information text for the last action
`E-PIA_UPLOAD-SUCCESSFULL`	applies if the upload has arrived
`E-PIA_UPLOAD-ERROR`	applies if something went wrong during the upload

{E-PIA_UPLOAD-SUCCESSFULL}
   <div class="box_info_hinweis">
      <p>~E-PIA_InfoMsg~</p>
      <p>Ihr Bild "~E-PIA_FileName~" ist bei uns eingegangen und wird geprüft.</p>
   </div>
{/E-PIA_UPLOAD-SUCCESSFULL}

{E-PIA_UPLOAD-ERROR}
   <div class="box_info_hinweis">
      <p class="fehler">~E-PIA_ErrorMsg~</p>
   </div>
{/E-PIA_UPLOAD-ERROR}

Within E-PIA_UPLOAD-SUCCESSFULL, the image data tags are also filled, for example E-PIA_FileName or E-PIA_CreateDate. Before that, they do not refer to any image and remain empty.

Reference: E-PIA_ (Image data)

All message texts are stored in the shop configuration shop.config in the <ProductsInAction-Txt> section, not in the template. A missing entry there leads to an empty message, and the visitor then sees an error without explanation.

Reference: ProductsInAction-Txt section

Uploading via AJAX

E-PIA_AJAX encloses the markers with which the supplied JavaScript library inserts the response after submission into the page. The markers only appear in the AJAX call; in the normal page build they are omitted.

<div id="ws_actimg_info_div" style="display:none">
   {E-PIA_AJAX}<ws-ajax-ws_actimg_info_div>{/E-PIA_AJAX}
      Die Datei wurde erfolgreich hochgeladen.
   {E-PIA_AJAX}</ws-ajax-ws_actimg_info_div>{/E-PIA_AJAX}
</div>

<div id="ws_actimg_error_div" style="display:none">
   {E-PIA_AJAX}<ws-ajax-ws_actimg_error_div>{/E-PIA_AJAX}
      <div class="box_info_hinweis">
         <div class="text_gross">~E-PIA_ErrorMsg~</div>
      </div>
   {E-PIA_AJAX}</ws-ajax-ws_actimg_error_div>{/E-PIA_AJAX}
</div>

The opening and closing markers each belong in their own E-PIA_AJAX range. The content in between stays outside, because it should also be on the page without AJAX.

The CSS class names box_info_hinweis and text_gross as well as the IDs ws_actimg_info_div, ws_actimg_error_div and ws_actimg_uploadForm are hard-coded in the JavaScript library. Do not rename them, otherwise the script can no longer find the containers.

The script also expects a variable actimgVar in the page header containing the permitted formats from E-PIA_FileFormatList and the error texts from the FMSG- tags. The guide shows the complete block.

Materials: WEBSALE JavaScript library

The tags at a glance

Tag	Single tag	Range tag	Negative range tag	Loop tag
`E-PIA_UPLOAD-ALLOWED`	–	yes	yes	–
`E-PIA_UPLOAD-SUCCESSFULL`	–	yes	yes	–
`E-PIA_UPLOAD-ERROR`	–	yes	yes	–
`E-PIA_AJAX`	–	yes	yes	–
`E-PIA_UploadLink`	yes	–	–	–
`E-PIA_HiddenTags()`	yes	–	–	–
`E-PIA_UserNameList()`	yes	–	–	–
`E-PIA_FileInput()`	yes	–	–	–
`E-PIA_CommentTextarea()`	yes	–	–	–
`E-PIA_FileFormatList`	yes	–	–	–
`E-PIA_FileMaxSize`	yes	–	–	–
`E-PIA_ErrorMsg`	yes	yes	yes	–
`E-PIA_InfoMsg`	yes	yes	yes	–

E-PIA_HiddenTags(), E-PIA_ErrorMsg and E-PIA_InfoMsg are permitted in all three ProductsInAction templates. The other tags on this page only apply in the upload template.

Guide: Offering ProductsInAction
Reference: ProductsInAction section
Reference: E-PIA_ (Image data)
Reference: E-PIA_ (Gallery)
Reference: E-PIA_ (Single view and rating)

​Is this visitor allowed to upload at all?

​The form

​The selection list for the name

​Messages and confirmation

​Uploading via AJAX

​The tags at a glance

​Related topics

Is this visitor allowed to upload at all?

The form

The selection list for the name

Messages and confirmation

Uploading via AJAX

The tags at a glance

Related topics