[Custom Components] Request for Select Input example with data from external source

[hbaldwinRPT]

I've been trying to get a custom select component working with data from an outside source int othe builder with 0 success. Tried to build off of the rating component and switch some things up but trying to get data from an external source and have it useable in the builder and render has eluded me. Is there a chance we could see an example of making a custom select component? for my purposes I dont even want the user to be able to use an edit form, just want to give them the ability to drag and drop a select component into the builder that will when rendered give them a selection of users gathered by an api call.

Anything like that would be great! Ive tried a custom template, extending the forms and components etc etc, but it just doesnt seem to want to work. wither i get something sort of together but the data wont populate, or the data will populate but the component won't render.

I've not included my code because I don't really want a fix to what I am doing so much as a guide as to the proper way to create something of the like.

[wag110894]

@hbaldwinRPT Thanks for reaching out! The "Custom Components" tag from angular-formio does not relate to us but rather the contributed ability in our library to have custom components.

[hbaldwinRPT]

"If you have any questions, create a new issue in this repo by choosing "Custom Components Support Request"."

Did I post the question in the incorrect place? I followed the link and placed the community, custom component, and question tag. Is this not the place to reach the contributors that helped with this ability? If it is not correct please check the link regarding questions and issue with the community component because that is what I followed.

I did not expect the formio team to do anything but would like if one of the contributors might be able to help with an example of a custom component that is a select dropdown.

[merobal]

Have you tried implementing an Angular service, inject that in the custom Angular component and call the api from there?

[hbaldwinRPT]

I did try that. however, it seems to place the component within the input type not its own component. additionally when I try to reduce the edit form, the component does not initialize with the data, it does sort of with the full edit form but it still is not retrieving the data. I know the issue lies in my lack of understanding of how the formio components interact with each other as far as template edit form and component. so far I've been able to get each try about 90 percent complete but either the select won't show, ore it won't take data, or it won't retrieve data. Thus my asking for just another example so that i can continue to recognize patterns and maybe use that to build what I need vs only having a minimal example with very few options.

All that aside still very much a huge proponent to formio and its whole thing, i just need an edge case right now that I havent been quite able to get. But the community has been awesome and helpful so i'm sure ill figure it out sooner than later.

On Fri, May 8, 2020 at 12:55 PM Bálint notifications@github.com wrote:

Have you tried implementing an Angular service, inject that in the custom Angular component and call the api from there?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/formio/angular-formio/issues/538#issuecomment-625991000, or unsubscribe https://github.com/notifications/unsubscribe-auth/ALM6DBBJLA7HZLCYRVJJB6LRQRPUNANCNFSM4M3WCTVA .

--

Hayden J. Baldwin

RARE PETRO Tech, Inc

Chief Technology Officer

hbaldwin@rarepetro.com

714-253-4330

https://www.linkedin.com/in/hayden-baldwin/

1224 Washington Ave Ste 10 https://www.google.com/maps/place/1224+Washington+Ave+%2310,+Golden,+CO+80401/@39.7546162,-105.2232823,17z/data=!3m1!4b1!4m5!3m4!1s0x876b9ad318dd7ba3:0xf2b96ac31f6099a9!8m2!3d39.7546162!4d-105.2210936

Golden, CO 80401 https://www.google.com/maps/place/1224+Washington+Ave+%2310,+Golden,+CO+80401/@39.7546162,-105.2232823,17z/data=!3m1!4b1!4m5!3m4!1s0x876b9ad318dd7ba3:0xf2b96ac31f6099a9!8m2!3d39.7546162!4d-105.2210936

www.rarepetro.com

https://www.linkedin.com/company/rare-petro/ https://twitter.com/rare_petro?lang=en This email and any files transmitted with it are confidential and intended solely for the use of the individual or entity to whom they are addressed. If you have received this email in error please notify the system manager. This message contains confidential information and is intended only for the individual named. If you are not the named addressee you should not disseminate, distribute or copy this e-mail. Please notify the sender immediately by e-mail if you have received this e-mail by mistake and delete this e-mail from your system. If you are not the intended recipient you are notified that disclosing, copying, distributing or taking any action in reliance on the contents of this information is strictly prohibited.

[abhishek0196]

Any updates on this issue @hbaldwinRPT , @merobal even I'm trying something similar, I am trying to have a custom select which accepts data as an input to the component, but I'm not even sure how to populate the data, I was following this issue, but unfortunately it didn't help, looking for some help,@merobal.

[hbaldwinRPT]

I have not had any luck and was unfortunately made to use another solution instead of custom components for now. I wound up wrapping the formio builder/renderer in an object and doing our own fields for things that needed dynamic value options. so far that approach is working well. I Will definitely still be changing it once I can figure out a way to get custom components working or my knowledge more up to snuff to attempt more in-depth measures.

[abhishek0196]

Is it possible @hbaldwinRPT to share your code? as I am failing to find a working solution, may be your solution can help me out. Thanks.

[adhonay]

@hbaldwinRPT Did you manage to solve the problem? I'm going through the same situation. Could you share an example? I would be very grateful.

[hbaldwinRPT]

I have not. I put it on the back burner and instead made a custom image component to get more familiar with making custom components in general.

On Fri, Jun 16, 2023 at 11:06 AM Adhonay Júnior @.***> wrote:

@hbaldwinRPT https://github.com/hbaldwinRPT Did you manage to solve the problem? I'm going through the same situation. Could you share an example? I would be very grateful.

— Reply to this email directly, view it on GitHub https://github.com/formio/angular/issues/538#issuecomment-1595062965, or unsubscribe https://github.com/notifications/unsubscribe-auth/ALM6DBCMTQRHEXBXBAM3CATXLSOAVANCNFSM4M3WCTVA . You are receiving this because you were mentioned.Message ID: @.***>

--

Hayden J. Baldwin

RARE PETRO Tech, Inc

Chief Technology Officer

@.***

714-408-9952

-- https://rarepetro.com/    http://rarepetro.com/technologies 1224 Washington Ave Ste 10 @.,-105.2232823,17z/data=!3m1!4b1!4m5!3m4!1s0x876b9ad318dd7ba3:0xf2b96ac31f6099a9!8m2!3d39.7546162!4d-105.2210936> Golden, CO 80401 @.,-105.2232823,17z/data=!3m1!4b1!4m5!3m4!1s0x876b9ad318dd7ba3:0xf2b96ac31f6099a9!8m2!3d39.7546162!4d-105.2210936>www.rarepetro.com http://www.rarepetro.com/

https://www.linkedin.com/company/rare-petro/ This email and any files transmitted with it are confidential and intended solely for the use of the individual or entity to whom they are addressed. If you have received this email in error please notify the system manager. This message contains confidential information and is intended only for the individual named. If you are not the named addressee you should not disseminate, distribute or copy this e-mail. Please notify the sender immediately by e-mail if you have received this e-mail by mistake and delete this e-mail from your system. If you are not the intended recipient you are notified that disclosing, copying, distributing or taking any action in reliance on the contents of this information is strictly prohibited.