I would like to include the value of the "file_id" variable in the href attribute of an appended HTML element, but it seems

<div id="invite_popup">
                        
     </div> 
    
    $(".invite_button2").click(function(){
        var file_id = $(this).data("id");
    
        //alert(file_id);
    
    var popup2 ='<div id="invite_popup2" class="accourdians_poup invite_popup2">'+
                    '<ul>'+
                      '<li><a href="#">Rename</a></li>'+
                      '<li><a href="http://localhost/driveProject/deletefile/'+file_id+'">Delete</a></li>'+
                      '<li><a href="http://localhost/driveProject/downloadfile/'+file_id+'">download</a></li>'+
                    '</ul>'+
                  '<div>';
    
        $("#invite_popup").append(popup2);
    
    
        $(".invite_popup2").show();
    
      });

when am click on <a> delete</a> it shows me like: http://localhost/driveProject/deletefile/+file_id+
i want to print value of file_id in url. please help me i'll be very thankfull.

Answer №1

const deleteLink = '<li><a href="{{route('dashboard.deletefile')}}?file_id='+file_id+'">Delete</a></li>';

I hope this helps!

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

Creating dynamic HTML elements for each section using JavaScript

Is there a way to dynamically add a task (input + label) for each specific section/div when entering the name and pressing the "Add" button? I attempted to create an event for each button to add a task for the corresponding div of that particular section, ...

Concluding the session upon exiting a directory or specific web addresses

Is there any way to terminate or cancel a session when I depart from a specific folder on the website, like /maps/, or simply end it when I'm not certain URLs? At present, I am utilizing: <script> $(window).on('unload', function() { ...

Closure-compiler and its peculiar pre-codeyntax

When it comes to minimizing my JS code, I typically rely on the online closure compiler available at . Recently, I've been attempting to incorporate this process into PhpStorm using "External tools," but I seem to be encountering a strange issue. Ever ...

Eliminate any additional spacing or padding surrounding the text input field

Is there a way to adjust the inner padding of a text field? Currently, when entering text in an HTML text field, there is padding at the beginning and end. The numbers I am inputting have no more than 3 digits, and the current padding takes up about the wi ...

Organize elements with jQuery, remove, detach, clone, and append without worrying about memory leaks

I am facing a challenge with a parent div that contains approximately 300 child divs, each one containing an image and some text. I have an array with the necessary information to reorder these divs using references. However, whenever I loop through the a ...

Jquery Timer that can be toggled on and off with a single button

I'm really struggling to find a way to make this work smoothly without any bugs. The button in the code below is supposed to perform three actions: Initiate a countdown when clicked (working) Stop the countdown automatically and reset itself when it ...

Steps for deactivating AMD on four files and sequentially loading them using webpack

I am facing an issue where I need to disable AMD on 4 files and ensure that video.js is loaded before the other 3 files, as they are dependent on it. My attempt to achieve this in webpack.config.js was unsuccessful: const path = require('path') ...

Interacting with shadow DOM elements using Selenium's JavaScriptExecutor in Polymer applications

Having trouble accessing the 'shop now' button in the Men's Outerwear section of the website with the given code on Chrome Browser (V51)'s JavaScript console: document.querySelector('shop-app').shadowRoot.querySelector ...

Is it possible for a property to be null or undefined on class instances?

Consider this TypeScript interface: export interface Person { phone?: number; name?: string; } Does having the question mark next to properties in the interface mean that the name property in instances of classes implementing the interface ca ...

React JS does not allow TextField and Select to change

I am relatively new to full stack development and I am currently working on a project to enhance my understanding of frontend development with React JS. While working on this project, I have been using Redux without any issues so far. However, I am facing ...

When the state changes, initiate the animation

Currently, I am working with Vue.js and need to animate a navigation menu. My goal is to display two li elements when a user hovers over one of the navigation buttons. At the moment, I have set the data type showActivities to false by default and changed ...

Is the $slice feature integrated into the php driver?

Can I use the '$slice' feature with the update() and $push functions in MongoDB? I have already attempted this, both with and without casting to (object). $db->collection->update( array('_id' => new MongoId($id)), ...

Is the controller of a nested view in Angular UI router automatically considered a child of the parent view's controller?

My UI-Router setup includes a main view for products and two nested states below it. I want each nested view to have its own controller while also inheriting some basic information from the parent controller (productsCtrl). However, when attempting to acce ...

Guide on implementing enums (or const) in VueJS

Seeking help on a seemingly simple task, I am trying to understand how to use "enums" in VueJS. In my file named LandingPage.js, I have the following code: const Form = { LOGIN: 0, SIGN_UP: 1, FORGOT_PASSWORD: 2, }; function main() { new Vue({ ...

Is there a messaging app that provides real-time updates for when messages are posted?

I am in the process of developing a messaging application. User1 sends out a message, and I want to display how long ago this message was posted to other users - for example, "Posted 9 min. ago", similar to what we see on sites like SO or Facebook. To ach ...

Is there a way to invoke a function in an iframe from its parent?

How can I call a function that is in an iframe from the parent document? If the function were in the parent, I could simply use parent.func(); but since it's within the iframe, how can I still call it successfully? JavaScript keeps saying it can' ...

What is the best way to apply focus to a list element using Javascript?

I recently created code to display a list of elements on my webpage. Additionally, I implemented JavaScript functionality to slice the elements. Initially, my page displays 5 elements and each time a user clicks on the "show more" link, an additional 5 ele ...

Tips on efficiently rebinding jQuery events to dynamically loaded content without having to manually do it for each event or class

Recently, I encountered an issue with my jQuery app where I needed to bind different functions to elements within one div dynamically. Specifically, I had a "delete-function" attached to all ".btn-delete" elements and an "add-function" linked to all ".btn- ...

Leveraging ng-repeat with multiple arrays

I'm currently developing a weather application, but I've hit a roadblock when trying to tackle what I thought would be a simple task. Unfortunately, my limited experience with Angular has made it difficult for me to figure out how to achieve this ...

Tips for preventing duplicate entries in an AG Grid component within an Angular application

In an attempt to showcase the child as only 3 columns based on assetCode, I want to display PRN, PRN1, and PRN2. Below is the code for the list component: list.component.ts this.rowData.push( { 'code': 'Machine 1', &apo ...