在上传之前选择它后显示图像文件,django

时间:2018-06-20 15:02:55

标签: python django

我有一个带有ImageField的表,我想在用户以表单提交之前在选择文件按钮附近显示一条图像拇指线,

当用户选择图像时,已经提供了这样的链接:

enter image description here

我想在使用后捕获文件(add_user_but.png)的路径..该怎么做!?

我知道如何在普通的普通HTML中执行此操作,就像它在问题中一样:

Show an image preview before upload

但是在Django中,我的 models.py forms.py HTML 文件的外观如下:

models.py

class Item(models.Model):
    # custom validators
    alphanumeric = RegexValidator(r'^[0-9a-zA-Z]*$', 'Only alphanumeric characters are allowed.')

    # fields
    dress_name = models.ForeignKey(Name, on_delete=models.DO_NOTHING, blank=False, verbose_name='نوع الفستان',)
    dress_rate = models.ForeignKey(Rate, on_delete=models.DO_NOTHING, blank=False, verbose_name='تصنيف الفستان',)
    dress_size = models.ForeignKey(Size, on_delete=models.DO_NOTHING, verbose_name='مقاس الفستان', blank=False)
    dress_color = models.CharField(max_length=50, verbose_name='لون الفستان', blank=False)
    dress_description = models.TextField(max_length=800, verbose_name=' وصف إضافى للفستان', blank=False)
    dress_image1 = models.ImageField(upload_to='documents/%Y/%m/%d', null=False, blank=False, verbose_name='الصورة الأساسية للفستان',
                                     help_text='لا يمكنك تركها فارغة', default="img/default_dress_image.png")
    dress_image2 = models.ImageField(upload_to='documents/%Y/%m/%d', null=False, blank=False, verbose_name='صورة إضافية ', default="img/default_dress_image.png")
    dress_image3 = models.ImageField(upload_to='documents/%Y/%m/%d', null=False, blank=False, verbose_name='صورة إضافة ', default="img/default_dress_image.png")
    dress_image4 = models.ImageField(upload_to='documents/%Y/%m/%d', null=False, blank=False, verbose_name='صورة إضافة ', default="img/default_dress_image.png")
    dress_image5 = models.ImageField(upload_to='documents/%Y/%m/%d', null=False, blank=False, verbose_name='صورة إضافة ', default="img/default_dress_image.png")
    dress_action = models.ForeignKey(Action, on_delete=models.DO_NOTHING, verbose_name='الفستان معروض لل ',
                                     help_text='للبيع او للإيجار ', blank=False)
    dress_price = models.IntegerField(default=1, verbose_name='السعر', blank=False)
    dress_mobile = models.CharField(max_length=20, validators=[alphanumeric], verbose_name='رقم الهاتف ', blank=False)
    created_by = models.CharField(max_length=250,)
    created_username = models.CharField(max_length=250, default='unknown')
    created_at = models.DateTimeField(auto_now=True)
    dress_active = models.BooleanField(default=False)
    dress_special = models.BooleanField(default=False)
    dress_town = models.ForeignKey(Town, on_delete=models.DO_NOTHING, verbose_name='المحافظة', blank=False)

forms.py

class AddDressForm(ModelForm):
    class Meta:
        model = Item
        exclude = ['created_by', 'created_at', 'dress_active', 'dress_special', 'created_username']

HTML

  <form action="" method="post" name="AddDressForm" align="right" enctype="multipart/form-data">
    {% csrf_token %}
    {{ add_dress_form.non_field_errors }}
    {% for field in add_dress_form %}
        <span style="color: red; ">{{ field.errors }}</span>
        <div class="row">
        <div class="col">
        {{ field.label_tag }}&nbsp;{% if field.field.required %}<span style="color: red; font-size: xx-small; ">مطلوب</span> {% endif %}
            </div>
            <div class="col" align="right">
            {{ field }}
            </div>
        </div>
        <br>
    {% endfor %}
     <input type="submit" class="btn btn-success" style="width: 100px;" value="إضافة" />
            </form>

0 个答案:

没有答案