I'm new to js/html so I'm actually not sure if it's angular-formly specific. I can't figure out how to change the css style globally (or for a single field) when a field is invalid. Does someone know how to do it or where I can find documentation about it? All documention I find uses the default has-error class.
The css style for invalid fields can be applied using the wrapper.
Note: this is a minimalistic answer to mark this question as solved. I will add code at a later point when I managed to get it working.
Related
I am using react-notifications-component and I see that I can have a custom component shown by setting .content of the iNotification object passed to Store.addNotification(). I would like to add a control to the existing component that comes with this library (I want to add a button to copy the message to the clipboard). If I could extend the existing component, this could be relatively easy, but I don't see how to do this. I don't want to "reinvent the wheel" since the 'native' component works and looks great.
Does anyone have examples of this type of functionality?
Thanks.
I dont think there is way to do it, unless you ask the author.. But honestly its fairly easy to implement own component that looks just like the original one, so I dont think it would even make sense to have this functionality, but you can ask..
Anyway I played around and made custom component which copies text ( but from input not from a div therefore the style broke a bit, but if you have a div it again looks just the same..
working example
I have a use case where i want to modify the whole template of the ui-grid. When i searched the files in the GitHub repository, i found that they use a template for the grid but couldn't find a way to change it anywhere. I also posted the same issue there but didn't get any response from them yet.
It is possible to replace any used template with a custom template. In the documentation you can find which gridOptions to use to define your own custom templates. You may choose rowTemplate, cellTemplate, footerTemplate, headerTemplate, etc. It is advisable to use the existing ui-grid template as starting point for creating your own custom template.
If you follow this example, you should be able to figure it out, I think :)
I have a Snippet model that I'm using ModelAdmin to create, edit, and list in Wagtail. I'd like to create a copy function, and I can see that wagtail supports this out of the box for Page objects:
Before I write custom code to do this, I thought I'd ask if there is any way to easily do this within Wagtail. I didn't find any hooks that would even easily allow adding more buttons, and while I did find modeladmin-list-display-add-buttons, it seems to only allow me to change the placement of the default edit and delete buttons.
It is possible to achieve this. However, it will require custom code, and various overrides and additions in different places. Here are some steps that should help you on your way, with some links to some example code in the wagtailmenus extension, which does this exact thing:
Adding the custom view:
Create a custom CopyView view (subclassing wagtail.contrib.modeladmin.views.EditView will probably be your best starting point). For inspiration, you might want to take a look at one I created for wagtailmenus: https://github.com/rkhleics/wagtailmenus/blob/master/wagtailmenus/views.py#L141
Integrate the view with your ModelAdmin class, by adding a copy_view() method that instantiates your custom view. For example:
https://github.com/rkhleics/wagtailmenus/blob/master/wagtailmenus/modeladmin.py#L78
Override your ModelAdmin class's get_admin_urls_for_registration() method, to make the view accessible via a URL. For example: https://github.com/rkhleics/wagtailmenus/blob/master/wagtailmenus/modeladmin.py#L82
Getting the button to show in the listing:
Create a custom ButtonHelper class by subclassing wagtail.contrib.modeladmin.helpers.ButtonHelper.
Add a copy_button() method to it, that can provide all of the necessary details to create the button. For example: https://github.com/rkhleics/wagtailmenus/blob/master/wagtailmenus/modeladmin.py#L38/
Override the get_buttons_for_obj() method to output the copy button in the listing along with the others, depending on the user's permissions (e.g. https://github.com/rkhleics/wagtailmenus/blob/master/wagtailmenus/modeladmin.py#L49)
Finally, get your ModelAdmin class to use your custom ButtonHelper instead of the default one, by changing the button_helper_class attribute to reference your custom class.
If you'd like to understand more about all of the various classes within wagtail.contrib.modeladmin, I'd suggest reading the modeladmin customisation primer page from the official Wagtail documentation.
I am having an UI component which is reusable in multiple places. Therefore I have to duplicate the same css sections over several css files. Is it ok to create a directive for this scenario ? The directive will not process any js specific operations, it is there only for handling the UI component and avoid the duplication.
NOTE: You've specified “Angular” in the question title, but angularjs as a tag. This answer assumes you're coding for Angular, not AngularJS. Consider editing the tag or the question title to remove this ambiguity. (What’s the difference between AngularJS and Angular?)
Angular can bundle style information with components. You can specify the CSS:
inline using the styles attribute of the #Component decorator, or
in an external file using the styleUrls attribute of the #Component decorator.
See the Component Styles section of the Angular docs for examples & more info.
While you could technically write an attribute directive to style your component, why you would choose to do this instead of using the styling functionality provided by components is unclear. Expanding your question with an example or two of what you're trying to achieve may bring you a better answer.
When I'm trying to extend the React.Component abstract base class, I get autocomplete suggestions in the box below as I type in React. The problem is they complete even when I type in the "." key, rather than tab or enter as one would expect.
Is there any way to disable this behavior, so that I don't get autocomplete with the dot key. I guess a workaround could be to get an extension that would make more React related suggestions/snippets pop up. So far I had no luck with trying some of those out. I also didn't find anything related to this in keybindings.
I tried disabling all of my extensions that have anything to do with intellisense, autocomplete or snippets (note that I have many), but it seems to be coming from within VSCode itself.
"editor.acceptSuggestionOnCommitCharacter": false,