Hello to all,
I am trying to format this field as currency with $ symbol and decimal. The others post that I was looking are not working for me. I am doing somehing wrong. This is the code without do anything with the format:
Have you tried using toNumber()?
1 Like
I was going to suggest the same as Franse ..... you have to conevert to number first.
1 Like
This is the code:
Should I do it in this way?:
Alex, remember you can post your code with `
```
code here
```
I have some problems trying to format the result, so maybe it's a bug..
This is the code:
<input type="number" class="form-control" id="input7" name="input7" aria-describedby="input7_help" dmx-bind:value="input5.value*input13.value" readonly="true">
Should I do it in this way?:
<input type="number" class="form-control" id="input7" name="input7" aria-describedby="input7_help" dmx-bind:value="input5.value.toNumber()*input13.value.toNumber()" readonly="true">
This is the expression you need:
<input id="text1" name="text1" type="text" class="form-control">
<input id="text2" name="text2" type="text" class="form-control">
<input id="text3" name="text3" type="text" class="form-control" dmx-bind:value="(text1.value.toNumber() * text2.value.toNumber()).formatCurrency('$', '.', ',', 2)">
PS1:
It seems you're using type="number" for input7 and this doesn't work.
Maybe it's related with this:
PS2:
I can see you're using some old App connect or beta channel there with experimental features?
Take note about that when using some functions, it's better to stay on stable channel and report some bugs if you have one.
Before change anything, a friendly advice 
:
Backup First!
It works perfect, thanks a lot!!!
1 Like
De nada mi amigo 
Sabia que hablabas español, gracias
surgio otro problema a raiz de estos cambios con otro campo de suma que estaba funcionando, me puedes ayudar?
This is a sum field. was warking but with theses changes I did update it and now just tell me "invalid amount"
...
...
<input class="form-control text-end form-control-lg" id="grandtotal" name="grandtotal" placeholder="Total" aria-label="Gran Total" readonly="true" dmx-bind:value="(input7.value.toNumber()+input14.value.toNumber()+input18.value.toNumber()+input19.value.toNumber()).formatCurrency('$', '.', ',', 2)">
Can you post the full code? With all your inputs?
This is working for me:
<input class="form-control text-end form-control-lg" id="input14" name="grandtotal3" placeholder="Total" aria-label="Gran Total">
<input class="form-control text-end form-control-lg" id="input7" name="grandtotal" placeholder="Total" aria-label="Gran Total">
<input class="form-control text-end form-control-lg" id="input18" name="grandtotal2" placeholder="Total" aria-label="Gran Total">
<input class="form-control text-end form-control-lg" id="input19" name="grandtotal4" placeholder="Total" aria-label="Gran Total">
<input class="form-control text-end form-control-lg" id="grandtotal1" name="grandtotal1" placeholder="Total" aria-label="Gran Total" readonly="true" dmx-bind:value="(((input7.value.toNumber() + input14.value.toNumber()) + input18.value.toNumber()) + input19.value.toNumber()).formatCurrency('$', '.', ',', 2)">
I will post part of the code where most of the inputs are located because is too long and is restricted to 3200 char the post
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input class="form-control" id="input13" name="input13" aria-describedby="input13_help">
<small id="input13_help" class="form-text text-muted"><b>Split</b></small>
</div>
</div>
</div>
<div class="col-2">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input class="form-control" id="input7" name="input7" aria-describedby="input7_help" dmx-bind:value="(input5.value.toNumber() * input13.value.toNumber()).formatCurrency('$', '.', ',', 2)">
<readonly="true">
<small id="input7_help" class="form-text text-muted"><b>Total Ingreso Asoci.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input15" name="input15" aria-describedby="input15_help">
<small id="input15_help" class="form-text text-muted"><b>Com.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input16" name="input16" aria-describedby="input16_help">
<small id="input16_help" class="form-text text-muted"><b>Supervisor</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input17" name="input17" aria-describedby="input17_help">
<small id="input17_help" class="form-text text-muted"><b>Otro</b></small>
</div>
</div>
</div>
</div>
<div class="row bg-primary text-white">
<div class="col">
<p><b>2B. Comisionista 2:</b></p>
</div>
</div>
<div class="row">
<div class="col">
<p>En esta sección se registran los nombres de los comisionista, las comisiones asignadas y el departamento al que pertenece.</p>
</div>
<div class="col-break w-100"></div>
<div class="col-3">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input300" name="input300" aria-describedby="input6_help">
<small id="input6_help1" class="form-text text-muted"><b>Nombre del Asociado</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<select id="select3" class="form-select">
<option value=""></option>
<option value="0">L000</option>
<option value="40%">L100</option>
<option value="50%">L130</option>
<option value="60%">L200</option>
<option value="70%">L290</option>
<option value="75%">L350</option>
<option value="50%">L150</option>
<option value="60%">L230</option>
<option value="75%">L360</option>
<option value="80%">L410</option>
<option value="85%">L470</option>
<option value="90%">L520</option>
<option value="95%">L630</option>
<option value="100%">L670</option>
<option value="105%">L770</option>
<option value="0">A000</option>
<option value="5%">A100</option>
<option value="5.25%">A125</option>
<option value="5.50%">A150</option>
<option value="6.00%">A175</option>
<option value="6.25%">A250</option>
<option value="6.50%">A275</option>
<option value="6.75%">A300</option>
<option value="7.00%">A325</option>
<option value="7.25%">A375</option>
<option value="7.50%">A400</option>
<option value="7.75%">A475</option>
<option value="8.00%">A500</option>
<option value="8.50%">A525</option>
<option value="8.75%">A725</option>
<option value="9.00%">A998</option>
</select>
<small id="select1Help" class="form-text text-muted"><b>Escala de Comisión</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input302" name="input302" aria-describedby="input8_help" dmx-bind:value="select3.value">
<small id="input8_help1" class="form-text text-muted"><b>Com.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input303" name="input303" aria-describedby="input9_help">
<small id="input9_help1" class="form-text text-muted"><b>Regional</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input304" name="input304" aria-describedby="input10_help">
<small id="input10_help1" class="form-text text-muted"><b>Gerente</b></small>
</div>
</div>
</div>
<div class="col-break w-100"></div>
<div class="col-2">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input305" name="input305" aria-describedby="input11_help">
<small id="input11_help1" class="form-text text-muted"><b>Titulo Asociado</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input306" name="input306" aria-describedby="input12_help">
<small id="input12_help1" class="form-text text-muted"><b>Departamento</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="number" class="form-control" id="input307" name="input307" aria-describedby="input13_help">
<small id="input13_help1" class="form-text text-muted"><b>Split</b></small>
</div>
</div>
</div>
<div class="col-2">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input class="form-control" id="input14" name="input14" aria-describedby="input14_help" readonly="true" dmx-bind:value="(input5.value.toNumber() * input307.value.toNumber()).formatCurrency('$', '.', ',', 2)">
<small id="input14_help" class="form-text text-muted"><b>Total Ingreso Asoci.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input309" name="input309" aria-describedby="input15_help">
<small id="input15_help1" class="form-text text-muted"><b>Com.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input320" name="input320" aria-describedby="input16_help">
<small id="input16_help1" class="form-text text-muted"><b>Supervisor</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input321" name="input321" aria-describedby="input17_help">
<small id="input17_help1" class="form-text text-muted"><b>Otro</b></small>
</div>
</div>
</div>
</div>
<div class="row text-white bg-primary">
<div class="col">
<p><b>2C. Comisionista 3:</b></p>
</div>
</div>
<div class="row">
<div class="col">
<p>En esta sección se registran los nombres de los comisionista, las comisiones asignadas y el departamento al que pertenece.</p>
</div>
<div class="col-break w-100"></div>
<div class="col-3">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input322" name="input322" aria-describedby="input6_help">
<small id="input6_help2" class="form-text text-muted"><b>Nombre del Asociado</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<select id="select4" class="form-select">
<option value=""></option>
<option value="0">L000</option>
<option value="40%">L100</option>
<option value="50%">L130</option>
<option value="60%">L200</option>
<option value="70%">L290</option>
<option value="75%">L350</option>
<option value="50%">L150</option>
<option value="60%">L230</option>
<option value="75%">L360</option>
<option value="80%">L410</option>
<option value="85%">L470</option>
<option value="90%">L520</option>
<option value="95%">L630</option>
<option value="100%">L670</option>
<option value="105%">L770</option>
<option value="0">A000</option>
<option value="5%">A100</option>
<option value="5.25%">A125</option>
<option value="5.50%">A150</option>
<option value="6.00%">A175</option>
<option value="6.25%">A250</option>
<option value="6.50%">A275</option>
<option value="6.75%">A300</option>
<option value="7.00%">A325</option>
<option value="7.25%">A375</option>
<option value="7.50%">A400</option>
<option value="7.75%">A475</option>
<option value="8.00%">A500</option>
<option value="8.50%">A525</option>
<option value="8.75%">A725</option>
<option value="9.00%">A998</option>
</select>
<small id="select1Help" class="form-text text-muted"><b>Escala de Comisión</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input324" name="input324" aria-describedby="input8_help" dmx-bind:value="select4.value">
<small id="input8_help2" class="form-text text-muted"><b>Com.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input325" name="input325" aria-describedby="input9_help">
<small id="input9_help2" class="form-text text-muted"><b>Regional</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input326" name="input326" aria-describedby="input10_help">
<small id="input10_help2" class="form-text text-muted"><b>Gerente</b></small>
</div>
</div>
</div>
<div class="col-break w-100"></div>
<div class="col-2">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input327" name="input327" aria-describedby="input11_help">
<small id="input11_help2" class="form-text text-muted"><b>Titulo Asociado</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input328" name="input328" aria-describedby="input12_help">
<small id="input12_help2" class="form-text text-muted"><b>Departamento</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input class="form-control" id="input329" name="input329" aria-describedby="input13_help">
<small id="input13_help2" class="form-text text-muted"><b>Split</b></small>
</div>
</div>
</div>
<div class="col-2">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input class="form-control" id="input18" name="input18" aria-describedby="input18_help" dmx-bind:value="(input5.value.toNumber() * input329.value.toNumber()).formatCurrency('$', '.', ',', 2)">
<small id="input18_help" class="form-text text-muted"><b>Total Ingreso Asoci.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input331" name="input331" aria-describedby="input15_help">
<small id="input15_help2" class="form-text text-muted"><b>Com.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input332" name="input332" aria-describedby="input16_help">
<small id="input16_help2" class="form-text text-muted"><b>Supervisor</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input333" name="input333" aria-describedby="input17_help">
<small id="input17_help2" class="form-text text-muted"><b>Otro</b></small>
</div>
</div>
</div>
</div>
<div class="row bg-primary text-white">
<div class="col">
<p><b>2D. Comisionista 4:</b></p>
</div>
</div>
<div class="row">
<div class="col">
<p>En esta sección se registran los nombres de los comisionista, las comisiones asignadas y el departamento al que pertenece.</p>
</div>
<div class="col-break w-100"></div>
<div class="col-3">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input334" name="input334" aria-describedby="input6_help">
<small id="input6_help3" class="form-text text-muted"><b>Nombre del Asociado</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<select id="select5" class="form-select">
<option value=""></option>
<option value="0">L000</option>
<option value="40%">L100</option>
<option value="50%">L130</option>
<option value="60%">L200</option>
<option value="70%">L290</option>
<option value="75%">L350</option>
<option value="50%">L150</option>
<option value="60%">L230</option>
<option value="75%">L360</option>
<option value="80%">L410</option>
<option value="85%">L470</option>
<option value="90%">L520</option>
<option value="95%">L630</option>
<option value="100%">L670</option>
<option value="105%">L770</option>
<option value="0">A000</option>
<option value="5%">A100</option>
<option value="5.25%">A125</option>
<option value="5.50%">A150</option>
<option value="6.00%">A175</option>
<option value="6.25%">A250</option>
<option value="6.50%">A275</option>
<option value="6.75%">A300</option>
<option value="7.00%">A325</option>
<option value="7.25%">A375</option>
<option value="7.50%">A400</option>
<option value="7.75%">A475</option>
<option value="8.00%">A500</option>
<option value="8.50%">A525</option>
<option value="8.75%">A725</option>
<option value="9.00%">A998</option>
</select>
<small id="select1Help" class="form-text text-muted"><b>Escala de Comisión</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input336" name="input336" aria-describedby="input8_help" dmx-bind:value="select5.value">
<small id="input8_help3" class="form-text text-muted"><b>Com.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input337" name="input337" aria-describedby="input9_help">
<small id="input9_help3" class="form-text text-muted"><b>Regional</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input338" name="input338" aria-describedby="input10_help">
<small id="input10_help3" class="form-text text-muted"><b>Gerente</b></small>
</div>
</div>
</div>
<div class="col-break w-100"></div>
<div class="col-2">
<div class="form-group mb-3 row">
<div class="col-sm-12">
<input type="text" class="form-control" id="input339" name="input339" aria-describedby="input11_help">
<small id="input11_help3" class="form-text text-muted"><b>Titulo Asociado</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input340" name="input340" aria-describedby="input12_help">
<small id="input12_help3" class="form-text text-muted"><b>Departamento</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input class="form-control" id="input341" name="input341" aria-describedby="input13_help">
<small id="input13_help3" class="form-text text-muted"><b>Split</b></small>
</div>
</div>
</div>
<div class="col-2">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input class="form-control" id="input19" name="input19" aria-describedby="input19_help" readonly="true" dmx-bind:value="(input5.value.toNumber() * input341.value.toNumber()).formatCurrency('$', '.', ',', 2)">
<small id="input19_help" class="form-text text-muted"><b>Total Ingreso Asoci.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input343" name="input343" aria-describedby="input15_help">
<small id="input15_help3" class="form-text text-muted"><b>Com.</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input344" name="input344" aria-describedby="input16_help">
<small id="input16_help3" class="form-text text-muted"><b>Supervisor</b></small>
</div>
</div>
</div>
<div class="col">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input type="text" class="form-control" id="input345" name="input345" aria-describedby="input17_help">
<small id="input17_help3" class="form-text text-muted"><b>Otro</b></small>
</div>
</div>
</div>
</div>
<div class="row text-end fw-normal mark border border-5 rounded border-primary">
<div class="col-2">
<div class="form-group mb-3 row">
<div class="col-sm-10">
<input class="form-control text-end form-control-lg" id="grandtotal" name="grandtotal" placeholder="Total" aria-label="Gran Total" readonly="true" dmx-bind:value="(input7.value.toNumber()+input14.value.toNumber()+input18.value.toNumber()+input19.value.toNumber()).formatCurrency('$', '.', ',', 2)">
I think is because the fields that are used for the sum are the same fields that are now showing $00.00
Yes, could be a reason, maybe you can try using some hidden fields, like replicate the text input without the formatter
I would like to remind you that we can use the dootstrap input-group.
<div class="input-group mb-3">
<span class="input-group-text">$</span>
<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
<span class="input-group-text">.00</span>
</div>
OR just
<div class="input-group mb-3">
<span class="input-group-text">$</span>
<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
</div>
1 Like