[QuickTip] How to use setVisible within TypeScript
Posted On 2020-12-05 • < 1 min read
One of my colleagues recently approached me and asked how one could use the function “setVisible” on a Dataverse control in TypeScript. The function is present in JavaScript but when trying to use it in TypeScript he got an error.
Xrm type is not exposing setVisible, therefore the error is shown. Since it is there in JavaScript (as you can see in the docs), we can still use it from TypeScript using a workaround. We have to define the control as “any” which then will accept that we call a function that is not in the type definitions.
var control = formContext.getControl("telephone1"); (<any>control).setVisible(false);
This is just 1 of 61 articles. You can browse through all of them by going to the main page. Another possibility is to view the categories page to find more related content.
You can also subscribe and get new blog posts emailed to you directly.
You can also subscribe and get new blog posts emailed to you directly.
5 Comments
An improved way to avoid the use of ‘any’ type is to tell typescript about the type of field, e.g.
const control: Xrm.Controls.StringControl = formContext.getControl(“telephone1”);
control.setVisible(false);
//@ts-ignore works as charm here like following:
//@ts-ignore
formContext.getControl(“telephone1”).setVisible(false);
That is true. Unfortunately does ESLint not like that.
I always look for examples in xrm-test files. setVisible is part of the definition but on Xrm.Page.StandardControl; so if you cast the control into Standard Control you would not need casting into any. Here is what I found:
// Xrm.Page.ui.controls.forEach((control) => { control.setVisible(true); }); // No longer works
Xrm.Page.ui.controls.forEach((control: Xrm.Page.StandardControl) => { control.setVisible(true); }); // Must cast to StandardControl
Check it out here: https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/xrm/v8/xrm-tests.ts
Hi guys,
sorry to comment to an old thread. I have been using the following NPM package with minor issues since the initial release.
https://www.npmjs.com/package/@types/xrm