web-dev-qa-db-fra.com

Afficher une image dans RSFORM après l'avoir passée via une URL

Jusqu'à présent, j'ai pu faire passer une image K2 à la fois dans une zone de texte et dans un champ caché de RSFORM - ce qui est génial! Mais je voudrais que l'utilisateur voie l'article (image) qu'il commande en remplissant le formulaire.

Je suis tombé sur ceci sujet avec cette solution:

<form action="#" method="post">
  <input type="url" name="imglink" id="imglink"  placeholder="Insert image URL here" /><br>
  <input type="button" value="Show Image" id="btn1" />
</form>
<div id="photo"></div>
<script>
document.getElementById('btn1').addEventListener('click', function(){
  document.getElementById('photo').innerHTML = '<img src="'+ document.getElementById('imglink').value +'" alt="Image" />';
});
</script>

La solution ci-dessus est légèrement similaire à ce que je veux seulement, mais que je veuille que mon image soit visionnée avant d'être soumise et également soumise.

Mes pensées: Je pense utiliser le champ caché rsform pour capturer l'image puis en le passant à une balise <img src="" /> à l'aide d'un script Java pour qu'il soit affiché peut fonctionner comme dans l'exemple ci-dessus.

S'il vous plaît, j'ai besoin de votre aide pour résoudre ce problème et si vous avez besoin de plus de précisions sur le problème, faites le moi savoir.

Merci d'avance!

joomla-3.xrsform
2
kije

Merci pour votre réponse

Cela a parfaitement fonctionné:

<script>
document.addEventListener('DOMContentLoaded', function(){
  document.getElementById('photo').innerHTML = '<img src="'+ document.getElementById('fieldname').value +'" alt="Image" />';
});
</script>

Entrez ceci dans la section script de votre formulaire et désactivez la génération automatique de la présentation dans rsform et placez cette <div id="photo"></div> où vous voulez que votre image apparaisse dans le formulaire puis remplacez nom du champ dans le code par le nom de votre champ.

1
kije

Vous devriez pouvoir le faire avec PHP en utilisant la section "Scripts appelés à l’affichage du formulaire". Les étapes de base sont les suivantes:

  1. Définissez variable sur le chemin de l'image que vous transmettez (par exemple, $ _GET, etc.)
  2. Définir variable à la valeur d'image d'espace réservé

  3. Effectuez une recherche/remplacement en utilisant la syntaxe ci-dessous:

    $ formLayout = str_replace ($ find, $ replace, $ formLayout);

1
YellowWebMonkey