How to customize the image filed returned by UpdateView

i use the UpdateView to update the products informations in my future webstore in my temblate . when i open my template i find a that it renders me the image link

edit_product.html

<form method="post">
    <div class="form-group">
        <label>Name</label>
            {{form.name}}
    </div>
    <div class="form-group">
        <label>Description</label>
            {{form.description}}
    </div>
    <div class="form-group">
        <label>Price</label>
            {{form.nominal_price}}
    </div>

    <div class="form-group">
        <label>Image</label>
           <img src="{{form.instance.photo.url}}" width="200"/>
    </div>
    <div class="form-group">
            {{form.photo}}
    </div>
  <button type="submit" class="btn btn-primary">Submit</button>
</form>

output

<form method="post">
    <div class="form-group">
        <label>Name</label>
            <input type="text" name="name" value="flawless legs" maxlength="255" required="" id="id_name">
    </div>
    <div class="form-group">
        <label>Description</label>
            <textarea name="description" cols="40" rows="10" required="" id="id_description">Epilateur de jambes pour femmes</textarea>
    </div>
    <div class="form-group">
        <label>Price</label>
            <input type="number" name="nominal_price" value="199" min="0" required="" id="id_nominal_price">
    </div>

    <div class="form-group">
        <label>Image</label>
           <img src="/media/products/images/449165_ALTMORE2.jpeg" width="200">
    </div>
    <div class="form-group">
            Currently: <a href="/media/products/images/449165_ALTMORE2.jpeg">products/images/449165_ALTMORE2.jpeg</a><br>
Change:
<input type="file" name="photo" accept="image/*" id="id_photo">
    </div>
  <button type="submit" class="btn btn-primary">Submit</button>
</form>

what should i do to remove this Currently: <a href="/media/products/images/449165_ALTMORE2.jpeg">products/images/449165_ALTMORE2.jpeg</a><br>

I found a tricky solution :

i replaced the

<div class="form-group">
            {{form.photo}}
    </div>

in my html file by an input type file <input type="file" name="photo" accept="image/*" id="id_photo"> and i edited my views views.py

class ProductUpdateView(RedirectToPreviousMixin, UpdateView):
    model = Product
    form_class = ProductUpdateForm
    template_name = 'admin/product_update.html'

    def get_object(self):
        return Product.objects.get(name=self.kwargs['product_name'])
    def form_valid(self, form):
        form = form.save(commit=False)
        self.photo = form.photo
        form.save()
        return HttpResponseRedirect(self.get_success_url())
Back to Top