Angular 8 update text field in response to another field change - angular8

The image above represents a project I'm working on. Of the 3 fields, only purchase price data is manually entered. I use the following markup and TS code to set the Outstanding mortgage field to a percentage of the previously provided figure:
<input type="number" class="form-control" min='0' id="purchaseValueInput" formControlName="purchase_value" (ngModelChange)='setPercentages()'>
...
setPercentages() {
this.mortgage = this.analysisForm.value.market.purchase_value * 0.75;
}
My challenge is I need to do a similar thing for the mortgage payments field but as a percentage of the outstanding mortgage value. Because that value is not manually provided the ngModelChange strategy is not working.
How can I resolve that last step?
Update
In my setPercentages() function, I have attempted to set a variable for mortgage payments but I get the following error:
The specified value "NaN" cannot be parsed, or is out of range.
I suspect it's because the field is regarded as empty even though visually it has data in it. I used the following code:
setPercentages() {
this.mortgage = this.analysisForm.value.market.purchase_value * 0.75;
this.mortgagePayments = (this.analysisForm.value.market.outstanding_mortgage * 0.03) / 12;
}
<input type="number" class="form-control" min='0' id="mortgagePaymentValueInput" formControlName="mortgage_payments" [value]="mortgagePayments">

You could try to bind the mortgage payments to a member variable and in the setPercentages function of the other input, you also update the model via that variable.
If ngModelChange doesn't work for some reason you can try to set the value attribute of that input:
<input type="text" value="$300"></input>

I was assigning my percentage values to variables and interpolation to assign the variable as the value of my input field. That proved to the the wrong approach.
What does work is using form patchValue as shown below:
this.analysisForm.patchValue({
market: {
outstanding_mortgage: this.analysisForm.value.market.purchase_value * 0.75,
}
});

Related

Odoo 11: How to correctly implement #api.onchange?

I want to compute a telephone number, if the number in the 8 position is either "0" or "1" I want to print just the last 4 numbers with a "(3)" before them, otherwise just print the 4 numbers, but what is happening is that my code is printing "0.0" and I don't know why, I'll appreciate your help...
This is my python code:
class Employee(models.Model):
_inherit = "hr.employee"
marcado_rapido = fields.Float("MarcadoRapido",compute='_compute_marcado_rapido')
#api.onchange("emp.marcado_rapido")
def onchange_compute_marcado_rapido(self):
for num in self:
num = "809-257-1457"
if num[8] in ('0','1'):
"(3)"+num[8:]
This is my xml code:
<td>
<t t-foreach="env['hr.employee'].search([('department_id', '=', dep.id)])" t-as="emp">
<div class="contact_form">
<img t-if="emp.image" t-att-src="'data:image/png;base64,%s' % to_text(emp.image)"/>
<div class="bloqueP">
<div class="bloque" t-field="emp.marcado_rapido"/>
</div>
</div>
</t>
</td>
#onchange only supports simple field names, dotted names (fields of relational fields e.g. partner_id.tz) are not supported and will be ignored
You can check the official documentation on how the onchange decorator works and what are the limitations.
0.0 is the default value for float fields and the value of marcado_rapido is computed using _compute_marcado_rapido function. If the field updated in onchange method depends on marcado_rapido field value, you can compute its value using the same method
You should use compute decoration instead of onchange, but compute method aproach always depend in someone else field. My sugestion is use a another computed field, something like this:
class Employee(models.Model):
_inherit = 'hr.employee'
# If your number contains special characters(like '-') you should use `Char` insted of `float`
num_telefono = fields.Char('Num. Telefono')
marcado_rapido = fields.Char('MarcadoRapido', compute='_compute_marcado_rapido')
#api.depends('num_telefono')
def _compute_marcado_rapido(self):
for rec in self:
num = rec.num_telefono[-4:]
rec.marcado_rapido = '(3){}'.format(num) if num[:1] in ('0','1') else num
Now you can call marcado_rapido from your XML.
I hope this answer can be helful for you.

How to get website to accept the amount updated on a field

I am trying to submit a form after updated all the fields but the amount field keep changing back to zero no matter what amount updated. Below is the element of that particular field:
input id="$PAcqCaseCreation$pTransactionAmount" onchange="onAmountChange(this,
document.getElementById('TranNOD').value ,
document.getElementById('TranDecimalSymbol').value,
document.getElementById('TranDecimalSymbolForLocale').value,
document.getElementById('TranThousandsSep').value , 'false' ); "
class="rightJustifyStyle" type="text" size="10"
value="" data-changed="false"
My code:
doc.getElementsByTagName("iframe")(0).contentDocument.getElementsById( _
"$PAcqCaseCreation$pTransactionAmount").innerText = fileLink9

Empy list on return

I have this in my qweb report
<span t-esc="formatLang(get_routing_data(o)[-1]['total'] , digits=3)"/>
it works ok, but sometimes it returns an empty list and then i get error index tuple out of range. how can i avoid it?
You could set the return value of the call to get_routing_data into a variable and make check the value using t-if conditions before use it, like:
<t t-set="routing_data" t-value="get_routing_data(o)"/>
<span t-if="routing_data and len(routing_data) > 0 and routing_data[-1].get('total', False)" t-esc="formatLang(routing_data[-1]['total'], digits=3)"/>

Filtering Data Table in PrimeNG

How can I get the number of rows after filtering using PrimeNG's default filters in data table.
[totalRecords]="totalRecords" always shows the records count which is fetched initially.
Even though after filtering, totalRecords value remains same and does not change after filtering.
Example:
initially totalRecords is 50 and after filtering, no.of records it shows in data table is 15. But I cannot get the value 15, instead getting 50.
Is there any way ?
Supposing you have a reference to your datatable component, just ask totalRecords property on it :
<p-dataTable [value]="cars" [rows]="10" [paginator]="true" [globalFilter]="gb" #dt>
...
</p-dataTable>
{{ dt.totalRecords }} records
Demo
The above answer is correct and I'm adding up a little thing to it.
If you want to bind the totalRecords value to your typescript .ts file, then use an (onFilter) event and trigger a function with parameters as $event and dt.totalRecords
In my case, i have given
<p-table #dt [value]="personListData" [columns]="columns" (onPage)="onPageChange($event)" [resizableColumns]="true" [paginator]="true" [rows]="rowsCount" selectionMode="multiple" [(selection)]="selected_data" [loading]="loading" [totalRecords]="totalRecords" class="table table-hover table-responsive table-bordered" [responsive]="true" (onFilter)="handleFilter($event,dt.totalRecords)">
In short,
(onFilter)="handleFilter($event,dt.totalRecords)"
Function in .ts file ,
handleFilter(e,filteredRecordCount){
console.log("filteredRecordCount");
}
NOTE: If you want to use the filtered records count value, then you
can assign it to any variable and use anywhere in your typescript
file.
I'm on Angular 8, and my table is not paginated. dt.totalRecords is always the full amount. So if I have 20 rows, and I get it filtered down to 2 on-screen, dt.totalRecords still = 20.
What I ended up doing was using the onFilter, passing in the entire dt, then using dt.filteredValue:
onFilter(event: any, table: any): void {
if(!!table.filteredValue) {
this.visibleRows$.next(table.filteredValue.length);
}
}
You have to check for null, because if you change the filter but don't filter out any additional rows, filteredValue is null.
html:
<p-dataTable #dt (onFilter)="handleFilter()" [value]="cars" [rows]="10" [paginator]="true" >
...
</p-dataTable>
{{ dt.totalRecords }} records
ts:
#ViewChild('dt', { static: true }) dt: Table;
handleFilter() {
if (this.dt.filteredValue != null)
this.dt.totalRecords = this.dt.filteredValue.length;
else
this.dt.totalRecords = this.cars.length;
}

Using text input to search Access number column

I have a simple search page with this text input form
<form name="assetInput" action="assetResult.jsp" method="get">
<input type="text" name="assetNo" />
<input type="submit" value="Submit" />
</form>
which takes you to a results page that will search an Access database by the Asset Number you type in the search page. The column's data type is number.
This is the code to get the input from the text box, and my attempt to convert the String to an int.
<%
String assetNumber = request.getParameter("assetNo");
int assetNum = Integer.parseInt(assetNumber);
%>
My query:
rs = stmt.executeQuery( "SELECT * FROM [Inventory Tracking] WHERE (([Inventory Tracking].AssetNumber) = '"+assetNum+"')");
I'm able to search columns from the database whose data type is text, but I keep getting errors when trying to search a number column with a String.
Thanks in advance!
Numbers do not take a delimiter, only text fields.
rs = stmt.executeQuery( "SELECT * FROM [Inventory Tracking] WHERE [Inventory Tracking].AssetNumber = "+assetNum);
You could avoid a lot of problems with a parameter.