Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Custom the input field only instead of whole body of insert modal #1031

Closed
andrewssun1 opened this issue Feb 10, 2017 · 6 comments
Closed

Custom the input field only instead of whole body of insert modal #1031

andrewssun1 opened this issue Feb 10, 2017 · 6 comments

Comments

@andrewssun1
Copy link

Hi Allen,

Really appreciate the work you've done here. For the Add Item Modal body, is it possible to customize one particular form field? In my case, I want to change the type of the form field from type="text" to type="password", and I can't reference the HTML element since there's no ID. Thanks in advance!

@AllenFang
Copy link
Owner

@sunnyownage, if you want to have more ability to custom the field, I suggest you to use v3.0.0-beta, current stable version is v3.0.0-beta.10. And you can check this example, this example is for customizing the modal body. This is for customizing whole modal

Please let me know if you got any trouble on implement

@andrewssun1
Copy link
Author

I did not realize you had refs to all these elements. I solved this by adding the following line to componentDidMount (after searching the ref through console and inspect tool):

this.refs.managetable.refs.toolbar.refs.form[1].type = "password";

@AllenFang
Copy link
Owner

My references is for v3.0.0, after v3.0.0 we can custom the content of insert model for everywhere, so if you feel bad or hard to use for the default styling or fields or something, you can give it a try :)

@andrewssun1
Copy link
Author

Hi Allen,

Upon upgrading to v3.0.0, I can no longer use my original method
this.refs.managetable.refs.toolbar.refs.form[1].type = "password";

It seems that you have removed this ref. Is there an alternative way to customize the type of a particular form field without changing anything else? I like the style of the default insert modal and don't wish to customize it any other way.

Thanks!!

@AllenFang
Copy link
Owner

hi @sunnyownage, for customization, you are supposed to be used custom API to custom the content of insert model, use ref is much dangerous and a hacky way. Fro newest version, you can custom the header, body, footer of insert modal or event a whole modal, but unfortunately, you can't custom only one input field currently, but I'll spend some time to do this feature, thanks. And let me know if you have any questions.

@AllenFang AllenFang reopened this Apr 4, 2017
@AllenFang AllenFang changed the title Reference specific text box in Add Item Modal Custom the input field only instead of whole body of insert modal Apr 4, 2017
AllenFang added a commit that referenced this issue Apr 16, 2017
@AllenFang
Copy link
Owner

HI @sunnyownage, now we can support the custom only for input field, check this example to learn how to custom it, let me know if you have any questions, thanks 👍

Remember to upgrade to v3.2.0

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants