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

How Should I Store Image In Jquery Form Builder Because in user data we can't store file,so how i store image,file and show them #1476

Open
vijay-torani opened this issue Oct 31, 2023 · 11 comments
Labels
custom control Issue relating to a custom control ♥ NEEDS SPON$OR Help bring this feature to the plugin

Comments

@vijay-torani
Copy link

vijay-torani commented Oct 31, 2023

Description:

How to store file

Environment Details:

  • formBuilder Version: latest
  • <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.13.2/jquery-ui.min.js"></script> <script src="https://formbuilder.online/assets/js/form-builder.min.js"></script>

using this scripts .

  • Browser: Chrome
  • OS: Windows

Expected Behavior

mehtod should be given to store file (image)

Actual Behavior

mehtod not be given to store file (image)

Steps to Reproduce

Screenshot - (optional)

@lucasnetau
Copy link
Collaborator

Take a look at this plugin control

https://github.com/lucasnetau/formBuilder-plugin-media

@vijay-torani
Copy link
Author

yes i am using this plugin but how to display image when we render form data using userdata method

@lucasnetau
Copy link
Collaborator

That will require a custom control

@vijay-torani
Copy link
Author

can you guide me i am new to this plugin how to add

@vijay-torani
Copy link
Author

That will require a custom control

can you guide me i am new to this plugin how to add

@lucasnetau
Copy link
Collaborator

Please take a look at the documentation for custom controls. There is also my custom controls example repo https://github.com/lucasnetau/formBuilder-plugins which may guide you.

Back of envelope thoughts would be you need to setup both the input[type=file] and likely a hidden input to track the files, and a div to render the images in build() and then in onRender you need to setup your control. You'll need a handler to upload the files to your server and then store a returned filename, then setup the img elements from userData

@vijay-torani
Copy link
Author

vijay-torani commented Nov 1, 2023

can you give any example so i can implement from that because for me is going bit complicated already

@lucasnetau
Copy link
Collaborator

This is very similar to the request in lucasnetau/formBuilder-plugin-media#1

If you need this, and cannot work it out from the examples I've already provided, I'm open to sponsorship to build the custom control, it would then be available to the community.

@lucasnetau lucasnetau added ♥ NEEDS SPON$OR Help bring this feature to the plugin custom control Issue relating to a custom control labels Nov 3, 2023
@vijay-torani
Copy link
Author

vijay-torani commented Nov 3, 2023

thanks but one problem when i am doing dynamic modification to src using javascript on image delete still i am getting src value in formdata
Screenshot 2023-11-03 162536
Screenshot 2023-11-03 162544
Screenshot 2023-11-03 162554

@lucasnetau
Copy link
Collaborator

Please don't paste images of code, console etc. use the markdown features of GitHub to highlight the text. It is very hard to read and process code from images.

Ok, your issue. From memory you cannot dynamically set the src attribute of a input[type=file] for security reasons to prevent rogue script uploading files from a known path.

@vijay-torani
Copy link
Author

thanks i will now upload like that

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
custom control Issue relating to a custom control ♥ NEEDS SPON$OR Help bring this feature to the plugin
Projects
None yet
Development

No branches or pull requests

2 participants