Downloading PDFs using the REST API in EXTJS 4.2

As a newcomer to EXTJS4.2 and web development, I have been trying to understand a particular issue that has left me confused.

In my AJAX code, I am calling a REST API using POST with JSON input parameters in order to download a PDF file.

Some sources claim that it is not possible to use AJAX for downloading PDF files, while others suggest utilizing AJAX with submit form parameters through an IFRAME.

I have attempted various solutions without success, so I am seeking clarification on what can be achieved and how to go about it. Is it feasible to write the responseText to a file?

My goal is to find a cross-browser solution that leverages EXTJS capabilities.

To provide some context, here is an example of the response content type:

Transfer-Encoding: chunked 
Content-Type: application/pdf;charset=utf-8
Content-Disposition: attachment;filename=1428140714.pdf
javascriptajaxpdfextjs

Answer №1

While attempting to download a file using Ajax, it may be challenging to trigger the browser's save dialog in order to ensure that the downloaded file remains in memory only.

An easy solution to this dilemma is to send a request from the client with the target set as a hidden iframe. This will prompt the browser's save dialog, allowing the user to choose a location for saving the file before it is stored. Once the file is saved, you have the option to remove the iframe from the page.

To see this method in action, check out this link:

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Utilizing Ajax to insert a line break within an alert message

I came across this link which explains that using \n can help achieve my goal. However, the method I am using does not seem to be working as expected. $.ajax({ url:'ajax/core/Ajax_Request.php', type:'POST', ...

jqueryajaxalert

JavaScript utilizing a PHP variable

In my attempt to merge a PHP variable with JavaScript, I aim to access the "the_link_to_the_page_I_want". window.onload = function openWindow() { window.open('the_link_to_the_page_I_want', 'newwindow', config='height ...

javascriptphp

The process of deleting lines from an image using Javascript

If I have an image of a data-table and I want to eliminate all the grid lines (defined as continuous vertical or horizontal pixels), is there a way to achieve this using Javascript's image data manipulation? I envision looping through a 2D array conta ...

javascripthtmlimageimage-processinggetimagedata

Trigger an alert message upon loading the HTML page with search text

I need to search for specific text on a webpage and receive an alert if the text is found. <script type='text/javascript'> window.onload = function() { if ((document.documentElement.textContent || document.documentElement.innerText ...

javascriptjqueryhtml

The issue with ngFileUpload causing empty file posts on Safari

Currently, I am utilizing ngFileUpload to transmit images to the Cloudinary service. My application is constructed on Ionic and is meant to be functional on both iOS and Android platforms. The code snippet below showcases my image uploading process: .se ...

javascriptangularjsionic-frameworkng-file-upload

Change the value of a boolean cell within my database table

I have a task where I need to dynamically update the status of the show_msg parameter based on user actions. When the submit button is pressed, I want to set it as TRUE if the checkbox is checked, and FALSE if not. The main HTML code includes a popup wind ...

javascripthtmlruby-on-railsajax

Do not refresh the ajax content

I'm using Ajax to dynamically load HTML content into a div container. The content is loaded when an element with the class "link" is clicked, as shown below: $(".link").click(function () { $('.link').removeClass('current'); ...

jqueryajaxhash

Dynamically loading a JSON file in JavaScript

Can you please review this code snippet? var scripts = {}; require = function(src){ var id = Math.round(+new Date()/1000); $.ajax({ url: src + '.json', type: 'GET', dataType: "json", cache: ...

javascriptjsonjquery

Create a JavaScript script within a CSS file

I'm attempting to create this using only CSS: Codepen and I would like to achieve the same effect but solely with CSS. This is what my CSS looks like: .text{ --a: calc(var(--a);*0.82+(1.5-var(--b);)/10); --b: calc(var(--b);+var(--a);); transfor ...

javascriptcss

Having trouble getting typeahead suggestions to display in Bootstrap UI when using AngularJS?

I am having trouble getting static suggestions to display in a search textbox. I have tried following the example at this link. Below is the code I am working with: Here is my HTML code: <div> <input type="text" name="questions" id="que ...

javascriptangularjsangular-ui-bootstrap

Unable to retrieve JSON element using Fetch

I'm attempting to retrieve a JSON file and exhibit its components within a div. Here is the JSON data I have: [ { "0":{ "host_id":"129230780", "host_names":"STK Homes", ...

javascriptjsonfetch

Convert the date and time of "2018-03-31T05:37:57.000Z" to a

I need help converting the universal time 2018-03-31T05:37:57.000Z to a timestamp in the form of 1520919620673. Can someone please provide guidance on how I can achieve this conversion? ...

javascriptnode.js

Issue with serving Angular 2 index.html file from Express server due to path relativity problem

https://i.sstatic.net/PPcAA.png The structure of my app folder includes the angular-client folder https://i.sstatic.net/euEl5.png In the image below, you can see the problem I am facing. When serving the index file of the Angular app from an Express ser ...

javascriptangularjsnode.jsexpressmean-stack

What is preventing me from passing str.indexOf into the map function in JavaScript?

How come I'm unable to perform the following action? let str = "A string containing * and ^ as well as $"; let indices = ["*", "^", "$"].map(str.indexOf); // not functional I prefer not to introduce another function that duplicates the functionality ...

javascript

Sorting through a JavaScript array

I am facing a peculiar problem while trying to filter an array in TypeScript. Here is the structure of my object: Sigma.model.ts export class Sigma { sigmaId: number; name: string; userId: number; starId: string; } `` The starId property contains com ...

javascriptangulartypescript

Using mongoose to differentiate whether an update-upsert operation is performing an insert or an update

Is the "upsert" option for updating working correctly? I attempted to upsert an object into mongodb twice with the same key, but did not receive an inserted message. Am I overlooking something? (mongodb : v2.6.3; mongoose : 3.8.15) Member.findOneAndRemov ...

javascriptnode.jsmongodbmongoosemongodb-query

Do we need to wait a considerable amount of time for an asynchronous function to run in a request?

I have a specific request that I need to address. The first snippet of code shows a function called handleUpdate1 which uses async/await to run a function named _asyncFuncWillRun10Minutes, causing the client to wait approximately 10 minutes for a response ...

javascriptnode.jsexpressasync-await

Is there a way to implement request-specific global variables for individual websocket connections in a Node.js application, similar to using res.locals for

Currently, I'm working on creating global variables within the io.use method of the socket.io server-side library. The goal is to have variables that are accessible throughout the entire request lifecycle for websockets. My setup involves using the ex ...

javascriptnode.jsexpresswebsocketsocket.io

Can React components be saved in an array?

I am currently working on enhancing the code snippet provided below. This code is intended to iterate through elements of an array using keys to locate images within a lengthy SVG file directly embedded in the document under the identifier "SomelongUglySVG ...

javascriptarraysreactjsloopssvg

Passing events from one controller to another in AngularJS using methods such as $broadcast and $window.localStorage

Looking to dispatch an event to another controller, I am familiar with techniques involving $rootScope.$broadcast, $scope.$emit, and then listening for the event using $scope.$on. This is a common approach, but in my project, controllers are initialized i ...

javascriptangularjsangular-local-storage