What you need to do is get a better idea of what the widget’s DOM looks like, so that you can properly target the necessary elements to achieve what you want to do. Use your browser’s inspector to do so (F12 in Chrome).
What you need to keep in mind is that the structure of a datagrid differs from any other input field. So simply reusing the class you created for the input field will not work.
In your situation you already applied the class to the column correctly. Which means you should be able to target it in your SCSS with something like
.mx-datagrid tbody td.currencyTextbox .mx-datagrid-data-wrapper:before {
content: "$";
}
The :before pseudo enables you to alter stuff at the beginning of the element
Hi,
Use Bootstrap Input Addons widget from app store, without doing an work around on custom stylings.
Else, If you want to achieve this by adding custom stylings , then check the following:
Update scss file and compile it,
gridDollarCurreny.mx-datagrid-data-wrapper::before {
content: "$ ";
}
and then map the gridDollarCurreny class name in the respected grid column.
Hope this helps.