Почему результат умножения не виден из шаблона с помощью javascript, но при осмотре элемента в chrome dev tools он виден?

Я объединяю с моим проектом django некоторый javascript для выполнения вычислений в системе. Однако мне кажется странным, что такая простая вещь, как результат умножения, отражается не в шаблоне моей веб-страницы, а в chrome dev tools

<

здесь вы не видите результата умножения

здесь вы видите результат умножения

Parte/models.py

class Parte(models.Model):

    codigo=models.IntegerField()
    quantity=models.IntegerField()
    unit_price=models.IntegerField()
    total_price=models.IntegerField()
    tax_free=models.BooleanField()
    descripcion=models.TextField(max_length=255,blank=True, null=True)
    descuento=models.IntegerField(default=0)
    total=models.IntegerField(default=0)
    # estatus = models.BooleanField()


    # def __str__(self):
    #     return f'{self.codigo}: {self.estatus} {self.descripcion}'

    def __str__(self):
        return f'{self.codigo}: {self.descripcion} {self.quantity} {self.unit_price} {self.total_price} {self.tax_free}{self.descuento}{self.total}'

Parte/forms.py

class ParteForm(forms.ModelForm):
   class Meta:
       model=Parte
       fields=['codigo','descripcion','quantity','unit_price','total_price','tax_free']

Presupuestos/models.py

class Presupuestos(models.Model):

    parte=models.ForeignKey(Parte, on_delete=models.SET_NULL, null=True)
    def __str__(self):
        return f'{self.parte}'

calculos.js

function multiplicar(){

    var x=parseInt(document.getElementById('id_quantity').value);
    var y=parseInt(document.getElementById('id_unit_price').value);
    document.getElementById('id_total_price').innerHTML=x*y;

}

                                                                   <td>
                                                                   {{presupuestosparteform.quantity}}
                                                                   </td>
                                                                   <td>
                                                                   {{presupuestosparteform.unit_price}}
                                                                   </td>
                                                                   <td>
                                                                   {{presupuestosparteform.total_price}}
                                                                   </td>
                                                                   <td>
                                                                   <div class="form-check">
                                                                   {{presupuestosparteform.tax_free}}
                                                                   </div>
                                                                   </td>
                                                                   <td>
                                                                   <input type="button" class="btn btn-block btn-default" id="addrow" onclick="childrenRow()" value="+" />
                                                                   </td>
                                                                   <td>
                                                                   <button type="button" onclick="multiplicar();">Button</button>
                                                                   </td>

Значение элемента input может быть задано атрибутом value, а не innerHTML:

function multiplicar(){

    var x=parseInt(document.getElementById('id_quantity').value);
    var y=parseInt(document.getElementById('id_unit_price').value);

    document.getElementById('id_total_price').value = x * y;

}

Вернуться на верх