Fetch addedfile from dropZone on some button click and pass it to thymeleaf rest api as Post request - dropzone.js

I am new to webpage development and using thymeleaf & dropzone for one poc.
I would like to do following:
Upload a file from drop zone
On some button click ( not part of the dz form) fetch the addedfile and pass it to the rest api as Post body using thymeleaf to do rest of the operation on the uploaded file.
#1 is done and I am allowing single file only to get added via dz
Please guide with #2, I had tried to add th:onClick but it doesn't allow post method if it is not attached to the form and if I tried to add it in the form then getting error as MultipartFile object is not available.
Thanks

Related

Integrating Surveyjs with Nativescript + Angular

I am trying to merge surveyjs along with my NativeScript application. I have referred URL for merging the same with Angular application
From the Angular demo code given on website, we have to add event handler for Complete button where we can get the response from surveyjs. Is it possible to integrate similarly for Nativescript Mobile application? Here is the approach which i feel can be taken.
Display
Create a HTML as provided by SurveyJS with required CSS and JS
referenced and add them as a file in project.
Modify HTML once i get the survey question json back from server.
Show the HTML as part of WebView. This will take care of displaying
the survey on my Application.
Here are my challenges during Submission
As per the process given on SurveyJS, i need to add handler for
oncomplete which will get the result json for me. How can i add
handlers for Complete button click in my code? Also please note that
there is a possibility that there may be multiple surveys on a single
page.
Apart from Survey, there are other fields also on the page and user
will submit them all in one go by clicking submit button of the page.
Hence i am planning to hide Complete button provided by SurveyJS
page. This needs to be triggered via code. Can this be done?
If someone can give directions on whether this scenario can be handled in nativescript application with Angular,it would help immensely.
yes it can be done using nativescript-webview-interface plugin.
add jS code inside WebView to handle oncomplete event from surveyJS. and on that function call emit some event to native app. after that add nativescript code to listen for that event and get the JSON back.
inside webView JS function
var oWebViewInterface = window.nsWebViewInterface;
// emit event to native app
oWebViewInterface.emit('anyEvent', jsonData);
inside native App
oWebViewInterface.on('anyEvent', function(jsonData){
// perform action on event
});
for more details on this you can check plugin readme file https://github.com/shripalsoni04/nativescript-webview-interface

Dynamically add routerLink to a component created dynamically via AJAX in Angular 5

I've got a component that downloads data from an API. When the user clicks Search, the content from the API is fetched via AJAX. This content from the API is in JSON and has got an ID of the product inside. I am able to create new HTML elements based on this content and put them inside my site, but I would like every created on the fly element to have routerLink="/detailsPage/itemID" working, so that after clicking it would route to detailsPage with apropriate ID. How to do it in the most simple way? I assume some recompiling of refreshing is needed.
The answer to this question is HTTPClient - Angular offers it as an easier way to use XMLHttpRequest (AJAX) in Angular applications, and using it also makes sure that routerLink or any other Angular directives will work on objects created dynamically with this method.
Angular - HTTPClient

Django - download file without reloading the page

The flow looks like that:
user is filling the form
form is passed to the server by ajax
form is saved to db, then the pdf with the form data is created and saved in the app folder (probably a bad move here...)
ajax success causes the page to append a button 'Download' with value equal to current pdf's name so button 'Download' appears to the user
If user presses the button the very pdf that was just saved is gonna download.
Refreshing the page makes the button disappear.
I've got stuck on point 5. I have created another ajax (to avoid reloading the page) bound to the Download button. It correctly asks the server to look for the file, creates a django File object: pdf_file = File(open(file_path, 'rb'))
and creates a HttpResponse with file, and content_type='application/pdf' or 'application/download'.
response['Content-Disposition'] is attachment.
Then the ajax returns response - only it does not. Server raises no error but ajax error function is called.
I've read that downloading with ajax is not possible. Could you help me a bit to get it straight? If above snippets are not clear, I shall provide more code.
Python 3.5, Django 1.10
Do like
window.location.href = "/url/to/downloadfile/"
in javascript after success of posting form. OR
#html
<button onclick="myfiledownload()">Download</download>
#javascript
function myfiledownload(){
window.location.href = "/url/to/downloadfile/"
}
Instead of using ajax to download the file bind the button to a download link where the file may be hosted
https://www.mywebsite/download/?fileid=3247023
You should at least seperate your file in a media root
Note: in production you will have to use a cdn to host your static files

How to upload a file using Ajax request in rails 2.3

I have a rails 2.3 application.
I am using Ajax request to submit the form content. In my form, I have a provision to upload files.
Issue with the form is, if I added a file to the form and submitted the form content, I am getting an error "Error: NS_ERROR_XPC_BAD_OP_ON_WN_PROTO: Illegal operation on WrappedNative prototype object Source" in "jquery-1.4.4.min.js" file and the form is submitting normally without using ajax request. But, the form is submitting form content using Ajax when there is no file selected to upload.
Can anyone please tell me how to upload file using Ajax request.
I found a solution for my above mentioned requirement at the following url. Hope it may help some one.
http://priyanka-railsdeveloper.blogspot.in/2011/11/allow-ajax-upload.html

CakePHP Ajax Add form from View (related )

i´ve got a view of my client (http://localhost/client/view/3) and in related section I have his adress.
Cakephp automatically builds that. When you click on Add Adress button new page comes up (http://localhost/addess/new) and when you save that it goes to http://localhost/addess/index
what I need is to ajax this view and get all working together. I need to go to http://localhost/client/view/3 push Add Adress and get addrees/new form visible (<- easy with jQuery) but how can I save the new adress and get adress div updated??
any example??
thanks
The php script you make the AJAX call to is where you need to do the save. When you have done that, you can pass out the data for the address div as xml or a javascript object and read it with the AJAX javascript in the original view.

Resources