Having trouble identifying the data variable. Uncaught ReferenceError: edu_id has not been defined

How can I successfully pass the edu_id from an AJAX request to my Laravel controller?

Utilizing anchor tags

<a href="javascript:void(0);" onclick="showEditEducation(some_specific_id);" title=""><i class="la la-pencil"></i></a>

Implementation of Javascript function

function showEditEducation($edu_id)
{
    console.log($edu_id);
     $.ajax({
        type: "POST",
        url: "{{ route('show-edit-education', $user->id) }}",
        data: {"education_id": edu_id,"_token": "{{ csrf_token() }}"},
        datatype: 'json',
        success: function (json) {
            $("#showMe").html(json.html);
        }
     });
}

Laravel Controller handling the edit education form

 public function showEditEducationForm(Request $request, $user_id)
    {
        $user = User::find($user_id);
        $education_id = $request->input('education_id'); 

        $applicantEducation = ApplicantEducation::find($education_id);

        dd($applicantEducation);

    }

The console.log output shows a correct number for "edu_id". However, there seems to be an issue with how ajax interprets it.

Answer №1

According to Sir Randy's advice, simply adding a dollar sign will resolve the issue.

edu_id

to

$edu_id

Final snippet of javascript function code

function showEditEducation($edu_id)
{
    console.log($edu_id);
    $.ajax({
        type: "POST",
        url: "{{ route('show-edit-education', $user->id) }}",
        data: {"education_id": $edu_id,"_token": "{{ csrf_token() }}"},
        datatype: 'json',
        success: function (json) {
            $("#showMe").html(json.html);
        }
 });

}

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

Tips for maintaining JSON data in CK Editor

I'm having an issue where my JSON data is not being displayed in CKEditor when using this code function retrieveRules(){ $.ajax({ url: "api", type: "POST", data: { version:'0.1' }, ...

Managing a digital timepiece within a multiplayer gaming environment

I'm currently developing a fast-paced game where players control a block resembling a clock. To accurately calculate the time taken by each player to make moves, I store the start time of the game and record the timestamp of every move in the databas ...

When any part of the page is clicked, the data on the Angular page will automatically

Clicking the mouse anywhere on the page, even in a blank spot, causes the data array to resort itself. I understand that clicking may trigger a view change if an impure pipe is set, but I have not used one. So I am puzzled because my development testing ...

Problems encountered when transferring information from jQuery to PHP through .ajax request

Hey there! I am currently working with Yii and facing an issue while trying to pass some data to a controller method called events. This is how my jQuery ajax call looks like: var objectToSend = { "categories" : [selectedOption],"datefrom" : month + "" + ...

modifying a model across multiple interfaces

My goal is to make modifications to a model in multiple views. Due to the complexity of my models with numerous properties, I need to edit them across different views. For example: The first page edits 2 properties, the second page edits 3 other propertie ...

Customize your Angular UI Bootstrap Datepicker with unique buttons - here's how!

Currently, I have a datepicker with clear and close buttons. I tried using the append function to add more buttons to this datepicker, but it didn't work because the content is not loaded until we click the icon since it's a popup datepicker. Is ...

What is the best way to show the previous month along with the year?

I need help with manipulating a date in my code. I have stored the date Nov. 1, 2020 in the variable fiscalYearStart and want to output Oct. 2020. However, when I wrote a function to achieve this, I encountered an error message: ERROR TypeError: fiscalYear ...

Nested jquery tabs

Similar Question: Unable to get jquery tabs nested I am trying to create a nested tab, but haven't found a satisfactory solution through my research. Can anyone provide me with some guidance? I have limited experience in JavaScript or jQuery prog ...

Are the props.children handled differently within the <Route> component compared to other React components?

Each and every react component undergoes a process in the following function, which is located in ReactElement.js within node_modules: ReactElement.createElement = function (type, config, children){ . . . } This function also encompasses <Rou ...

What is the best way to incorporate a function within a $.click (jquery) event that utilizes an id directly from the clicked element?

It seems that my title may not be very clear, but I have a jQuery code snippet that is causing some issues. The problem stems from the fact that when I click on an image with the class 'slideimg', I expect a function named slideDo to be executed, ...

Is it possible to guarantee that the initial AJAX request finishes before the next request is made?

I am working on a project that involves making consecutive async ajax calls to populate user schedules in an HTML table using jQuery. Each response returns a JSON serialized DataSet containing information about scheduled events and user details. The issue ...

Retrieving script data from a webpage

I found a link that I want to extract content from, here is the link: https://www.whatever.com/getDescModuleAjax.htm?productId=32663684002&t=1478698394335 However, when I try to open it using Selenium, it doesn't work. It opens as plain text wit ...

The Node.js error message reads: "Cannot set headers after they have been sent" while trying to make a post request

Yes, I understand this issue has been addressed multiple times on stackoverflow, but unfortunately, I haven't found a solution that works for me. The problem arises when trying to make a post request on my nodejs server. The error message states &apo ...

Utilizing Flask's Sijax to manage callbacks within the @app.before_request function

In my Flask application, I have included callbacks in @app.before_request. @app.before_request def before_request(): def alert(response): response.alert('Message') if g.sijax.is_sijax_request: g.sijax.register_callback('alert& ...

The variable in the dataTables JavaScript is not receiving the latest updates

//update function $('#dataTable tbody').on('click', '.am-text-secondary', function() { //extract id from selected row var rowData = table.row($(this).parents('tr')).data(); var updateId = rowData.id; ...

What is the process of utilizing the JSON value within an AJAX function to integrate with a JSP

Why am I getting an undefined value outside the Ajax function when trying to generate a table with JSON data printed in both the console and JSP? <head> <title>Unique Spring MVC Ajax Demo Title</title> <script type="text/javascript" s ...

CSS Challenge: How to crop an image without using its parent container directly

I'm currently facing a complex CSS challenge that I can't seem to solve. I want to create an image controller (two-by-two layout on two lines) that can display: The top-left image in full size, The top-right with horizontal scrolling, The botto ...

Ways to create a fixed button positioned statically at the bottom of a page

Currently, I am utilizing tailwind CSS to create a webpage with Next and Back buttons for navigation. However, an issue arises when there is minimal content on the page as the button adheres to the top. For visual reference, please view the image linked be ...

"Why is it that the keypress event doesn't function properly when using the on() method

My goal is to capture the enter event for an input field $("input[name='search']").on("keypress", function(e){ if (e.which == '13') { alert('code'); } }); This is the HTML code snippet: <input name="searc ...

Animating Divs with jQuery to Expand their Size

I am currently designing a services page for my portfolio website. The layout consists of three columns, with the central column containing a large box and the left and right columns each containing three smaller boxes. These smaller boxes function as clic ...