So zeigen Sie das ausgewählte Bild in der ImageField-Datei in der Vorlage an

Wie zeige ich das ausgewählte Dateibild in der Vorlage

Ein Fehler kommt mit dem 'image' Attribut hat keine Datei zugeordnet. Wie kann ich warten, bis der Benutzer eine Datei auswählt und dann das Bild in der Vorlage anzeigt.

Fehler

The 'image' attribute has no file associated with it. 

Vorlage

 {{ form.instance.image.url }} 

One Solution collect form web for “So zeigen Sie das ausgewählte Bild in der ImageField-Datei in der Vorlage an”

Du brauchst eine Lösung, was du tun willst.

JS:

 function readURL(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function (e) { $('.PreviewImg').attr('src',e.target.result);} reader.readAsDataURL(input.files[0]); } } $("#id_image").change(function(){ readURL(this); $('.PreviewImg').removeClass("testA") $('.PreviewImgDiv').removeClass("testA") }); $("#id_image_url").on("blur",function(e) { e.preventDefault(); var abc = $("#id_image_url")[0].value; $('.PreviewImg2').removeClass("testA") $('.PreviewImg2').attr('src', abc); $('.PreviewImgDiv').removeClass("testA") }); 

HTML

 <div class="PreviewImgDiv testA"> <div class="text-center"> <h4>Image Preview</h4> </div> <img class="PreviewImg testA" src="#"/> <img class="PreviewImg2 testA" src="#"/> 

CSS

 .testA{ display: none; } 

Wenn Sie also ein Bild <img class="PreviewImg testA" src="#"/> (klicken Sie auf Datei auswählen oder über Hyperlink hochladen), wird der <img class="PreviewImg testA" src="#"/> an <img class="PreviewImg testA" src="#"/> und auf der Website angezeigt. Die Div nur angezeigt (die CSS-Klasse wird entfernt), wenn Sie eine Datei hochladen. Deine id_image (vom PC) sollte die id id_image und das Feld haben, wo du über link id_image_url hochladen kannst. id_image_url that gets you going. Hinterlassen Sie einen Kommentar, wenn Sie Fragen haben.

  • Ungültige requirements.txt bei der Bereitstellung von django app zu aws beanstalk
  • Django mit einer Konsolenanwendung integrieren
  • Monitor Management Command Execution in Django
  • Nginx django uwsgi Seite nicht gefunden Fehler
  • Verwenden Sie nur einige Teile von Django?
  • Web-Proxy in Python / Django?
  • Django Benutzer abgemeldet nach Passwort ändern
  • Vor-bevölkern einige der Felder in einem Django Admin Popup-Formular (das Formular erscheint beim Klicken auf grün plus Symbol)?
  • Django - Flush Antwort?
  • Wie man Module von einem virtualenv in ein anderes kopiert
  • In Django, wie überprüfe ich, ob ein Benutzer in einer bestimmten Gruppe ist?
  • Python ist die beste Programmiersprache der Welt.