using ajax to fetch a file from laravel

My goal is to download a file by sending necessary parameters through an ajax request.

In the process, I saved the output file in the public/exports directory and attempted to redirect to that file path in the success callback.

public function downloadResults() {
    /* get filter control inputs */        
    $inputParams = $this->request->input();
    .
    .
    .
    try {
        $exportArr = $this->product->downloadResults($filterArr); <-- this will store the file to public directory.
    } catch (\Exception $e) {        
        $jsonArr['success'] = false;
        $jsonArr['message'] = $e->getMessage();
        echo json_encode($jsonArr);
    }
    $jsonArr['success'] = true;
    $jsonArr['filename'] = $exportArr['file'];
    echo json_encode($jsonArr);
}

Upon receiving the response,

$.ajax({
            data: filter_rules,
            url: "{{ @url("/dmf/download-results") }}",
            type: 'POST',
            dataType: 'json',

            success: function(resp) {
                $("#overlay").hide();

                window.location.href = "{{ asset('public/exports/') }}" + '/' + resp.filename;
            }, 
        });
    }

This leads to a redirection to a non-existent route

http://localhost:8000/public/exports/result_set_download_1589388303.xls
.

What steps should be taken to access the file now?

Answer №1

Don't miss out on this amazing package called downloadjs

You have the option to utilize the Fetch API in order to retrieve BLOB data from the server and then proceed to download the blob using downloadjs

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

Ajax TabContainer mysteriously vanishes during Postback

I'm currently working on a GIS web application using C# ASP.net. Within my project, I have an Ajax TabContainer that houses multiple TabPanels containing various elements like a map window and scale bar from the ESRI WebAdf toolkit. Below is a simpl ...

Is there a way to extract information from an HttpClient Rest Api through interpolation?

I am currently facing an issue with a component in my project. The component is responsible for fetching data from a REST API using the HttpClient, and the data retrieval seems to be working fine as I can see the data being logged in the Console. However, ...

Steps to releasing JavaScript and asset files on npm

I have created a custom UI component for internal company use and released it on npm. However, after installing the package, I noticed that only the index.js file is showing up in the node_modules directory. I am not utilizing any package builders or ES m ...

Tips for accessing touch events within the parent component's area in React Native

I implemented the code below in my React Native app to disable touch functionality on a specific child component. However, I encountered an issue where the touch event was not being detected within the area of the child component. How can I fix this prob ...

No response being received from Ajax request

Having some trouble with an ajax function I developed for a small project. The issue lies in running the code inside the .done() function. This function is supposed to receive a json object from php (which I am obtaining a response via cURL), but it appear ...

What is the best way to halt a window.setInterval function in JavaScript?

I have a JavaScript function that runs every 2000ms. I need to find a way to pause this function so that the user can interact with other elements on the page without interruptions. Is there a way to achieve this? Below is the code for the function: win ...

Guide for building a Template-driven formArray in Angular

I am currently implementing a fixed number of checkboxes that are being bound using a for loop. <ul> <li *ngFor="let chk of checkboxes"> <input type="checkbox" [id]="chk.id" [value]="chk.value&q ...

What is the best way to update the key for the sorting field in a meteor collection query?

I am struggling to replace the name key with a value passed in via a parameter this.params.sortby in the code below. Any help would be appreciated. For example, if: this.params.sortby=location I would like the following: Template.MyTemplate.helpers({ ...

Updating Website Content Using JavaScript Library or Asynchronous JavaScript and XML

Can jQuery be used to alter plain HTML text? For instance, suppose I have a time displayed as 18:00 in simple HTML text - is it feasible to implement a drop-down menu featuring options like +1, +2, +3 and so on, or -1, -2, -3 and so forth? This way, selec ...

Enhance your website with a dynamic dropdown feature using Javascript and Bootstrap 5, allowing buttons to respond

Currently, I am experimenting with Javascript to dynamically incorporate elements into a Bootstrap 5 dropdown. To guide me, I referred to the relevant documentation which can be found here (https://getbootstrap.com/docs/5.0/components/dropdowns/#menu-items ...

Adding a see-through Bootstrap Navbar to a Fullpage.js website: A step-by-step guide

I am trying to incorporate a transparent Bootstrap Navbar into my page that is using fullpage.js. The desired outcome is for the navbar to stay on top of the page without affecting the layout of the website content. I have referenced an example here, but ...

What steps can be taken to restrict users to providing only one comment and rating for each item?

In the backend controller, I have the following code snippet: 'use strict'; var Comment = require('../../../models/comment'); module.exports = { description: 'Create a Comment', notes: 'Create a comment&apos ...

Is it possible for the like button to display specific information when clicked?

When working with a looping structure in Ionic and Angular, which includes post content such as text, photos, and videos, I am encountering an issue with selecting specific data when clicking on the like button. How can I ensure that only the data associat ...

Working with regular expressions on fieldsets in JavaScript jQuery

I'm facing an issue with a JavaScript regexp and I could really use some assistance. Currently, I have an ajax query result saved in a variable (in this case, a regexp) and I am trying to only match the content within the fieldset tag. Here is a sni ...

Angular examine phrases barring the inclusion of statuses within parentheses

I require some assistance. Essentially, there is a master list (arrList) and a selected list (selectedArr). I am comparing the 'id' and 'name' from the master list to those in the selected list, and then checking if they match to determ ...

Error in Chart.jsx: Unable to retrieve the length property of an undefined object in the COVID-19 Tracker App

INQUIRY Greetings, I am in need of assistance to identify an error that is perplexing me. The source of this code can be traced back to a tutorial on creating a covid tracker available on YouTube. While attempting to implement the chart feature, I encounte ...

Issue with Laravel Nova Metrics Value format functionality not functioning as expected

I've been having trouble trying to get the Value Metrics formatting to work in Nova. Whenever I add the property to my return, nothing seems to happen. Any ideas on what could be causing this issue? $total = DB::table('hello')->sum(DB:: ...

Utilizing Jquery Ajax for transmitting information from a jsp file to a Struts2 action class

Looking to transfer form data from jsp to struts2 using jquery Ajax and retrieve JSON data from the Struts2 action class. The code snippet provided below is causing an issue where "undefined" gets passed instead of the original value from jsp to the actio ...

Struggling with displaying Firebase data in React

I am facing an issue with rendering data fetched from Firebase onto the screen. The problem arises when I attempt to call the function that retrieves data from the database inside the componentDidMount() lifecycle method. Surprisingly, the function does no ...

Different approaches to transforming jQuery code into functional AngularJS code

I am a beginner in AngularJS and I'm looking to implement functionality for a login page similar to the one you see when you click the 'Forgot Password' link: Would it be more appropriate to use a directive instead of a controller for this ...