ورود

View Full Version : تغییر ظاهر المان اپلود فایل ایجاد شده توسط جنگو



roya_django
شنبه 03 تیر 1396, 19:30 عصر
سلام

من یک مدل جنگو به شکل زیر دارم:


class Image(models.Model):

img = models.ImageField(upload_to='%Y/%m/%d', blank=True,null=True)




این کلاس برای ذخیره کردن عکس استفاده میشه . حالا وقتی که من در جنگو روی این کلاس فرم درست می کنم و فرم ایجاد شده رو از طریق viewبه template می فرستم و نمایش میدم

چیزی که دارم که کادر مستطیلی هست که درون اون کلمه ی browser نوشته شده اما من میخام که این ظاهر تغییر پیدا کنه و به شکلی مثل یک مداد یا ایکون دیگه ای تبدیل شه. اما وقتی
دورش کند و کاو می کنم راهی پیدا می کنم انگار یه چیزیه که درونش بسته است مثل یک جعبه ی سیاه شده برام.

وقتی از چیزی که تولید میشه inspect element می گیرم همون جور که انتظار دارم یک input که type فایل رو برام ساخته:


<input type="file" name="file" id="id_file" required="">



نمی دونم باید چطور این رو به شکلی که میخام دربیارم ایا کد جاوااسکریپت باید برای این کار نوشت؟

ممنون میشم راهنمایی کنین

plague
یک شنبه 04 تیر 1396, 12:02 عصر
هر عکسی میخای بجای دکمه آپلود نمایش بده رو میبری زیر دکمه فعلی قرار میدی (با خاصیت position توی css )
در واقع دکمه و عکس روی هم قرار میگیرن
بعدبا opacity یا visibility دکمه رو غیب میکنی
الان دیگه فقط کاربر عکس رو میبینیه ولی وقتی رو عکس کلیک میکنه در واقع داره روی همون دکمه کلیک میکنه چون دکمه روی عکس قرار داره
و پنجره Brows file براش باز میشه

کلا همه مراحل با css هستش