My FormControl is connected to an input element.
<input matInput [formControl]="nameControl">This setup looks like the following during initialization:
this.nameControl = new FormControl({value: initValue, disabled: true}, [Validators.required, UniqueValueValidator(uniqueValues)]);While the FormControl is disabled, error checking is not performed.
How can I keep the control disabled and still display any errors that occur?
When a form control is disabled, it cannot have a status of either valid or invalid.
Form controls can only have one of four statuses: pending, disabled, valid, or invalid. So if the status of a form control is disabled, it will remain that way and cannot be considered valid or invalid. You can refer to the documentation for more information: docs.
Although you can simulate the validation process, using methods like input.hasError('...') or checking for invalid/valid won't be effective.
<input matInput [formControl]="nameControl">
<div *ngIf="form.get('nameControl').disabled && form.get('nameControl').value === ''">
This field is required.
</div>
Is there a way to dynamically add a column to the Kendo UI grid based on JSON data? Consider the following JSON input: [{ "ProductID": 1, "ProductName": "Chai", "Supplier": { "SupplierID": 1, "SupplierName": "Exotic Liquid ...
My FormGroup is shown below: this.productGroup = this.fb.group({ name: ['', Validators.compose([Validators.required, Validators.maxLength(80)])], desc: ['', Validators.maxLength(3000)], category: ['', Validators.require ...
I am trying to dynamically move CSS items based on user input or button clicks. Specifically, I want to increment the position of elements by a specified number of pixels or a percentage of pixels. Currently, I am able to set the starting positions (top a ...
I am facing an issue with Stripe where I am unable to incorporate delivery fees into my transactions. How can I successfully integrate this feature? let line_items = []; for (let productId of uniqIds) { const quantity = productsIds.filter(id => id == ...
Seeking advice on how to incorporate custom validation methods from jQuery validate into another method for validating data. Specifically, I have a 'Document ID' field that can accept either CPF or CNPJ (Brazilian documents) and I need to validat ...
Is there a way to detect changes in the checked value of a checkbox when it is changed by a script that I do not control? I have tried using `addEventListener()` and jQuery's `on()` method, but they do not work in all cases. <input type="checkbox" ...
As I embark on developing my first significant web application using ReactJS with Firebase as the backend database, everything was progressing smoothly until a troublesome issue surfaced. The hurdle I encountered involves saving user information upon thei ...
Currently, I am developing a project using angular 4 and ionic 3. One of the features in my project is implementing firebase phone authentication for the login page. While working on this, I encountered the need to add a functionality to resend OTP when ...
My JavaScript function contains a JSON array, where it takes an input and searches for the corresponding key/value pair to return the desired value. I am attempting to input a string of variables like this: 1,2,3,4,5 Into this function: function getF(f ...
Encountering an issue with the total count of ajax search results. Getting an error message "Method Illuminate\Database\Eloquent\Collection::total does not exist." when using directives, for example: <div class="searched-item"&g ...
Currently, I am working on a small project where I am using NodeJs and Express for the backend and React for the client side. In order to tackle CORS policy issues, I have implemented the "cors" npm package on the server side, but unfortunately, it doesn& ...
I currently have a situation where I have three checkboxes labeled as parent 1, parent 2, and parent 3. Initially, when the page loads, parent 1 and parent 3 are checked by default, while parent 2 is unchecked. However, when I manually check parent 2 and c ...
I need assistance with an application I am developing, where I want to expand a table row to display details when it is clicked. The issue I am facing is that currently, all rows expand and show the data of the clicked row as seen in the image result below ...
I am currently working on implementing assertions for testing using selenium webdriver with node js. However, I am encountering an issue where it returns undefined when trying to assert the page title (which is the URL of the page). It seems like I may n ...
Currently, I am in process of upgrading an Angular 1 project to Angular 2. In the old project, I used angular.equals for comparing objects like this: angular.equals($ctrl.obj1, $ctrl.newObj);. I tried looking online for a similar method in Angular 2 but ...
Here is an example of a typical Bootstrap Dropdown: <div class="btn-group"> <button type="button" class="btn btn-lg btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Default option<span class ...
I have successfully created multiple canvases on the same page based on the number of PDF pages. However, I am facing an issue where some buttons to add different canvases are not working as expected. What I am attempting to do is add text on mouse down fo ...
My goal is to open a partial view in a new window and call the print function, but I'm facing an issue where the partial view renders after the print function, resulting in a blank page. I attempted using the $timeout function, but encountered the sam ...
In the scenario where I have a nested JSON object like this: var library = { "Gold Rush": { "slides": ["Slide 1 Text","Slide 2 Text","Slide 3 Text","Slide 4 Text"], "bgs":["<img src='1.jpg' />","","<img src='2.j ...
Utilizing Javascript, I have successfully implemented a cookie setting feature that allows users to switch between normal and classic theme versions on my website by clicking a checkbox. The backend of my application is powered by PHP. My goal is to access ...