Question 302735 in Jquery Question posted in
The official Jquery Api Documentation can be found here.

jquery.js file version 3.6 throwing an error on button click

I have an application which uses jQuery for client side. It has been working fine but I have started getting an error in the jquery file even though no changes has been made to the code.

So this is the button code :

<a id="lookup" href="#SummaryModal" type="button" data-toggle="modal" data-backdrop="static" class="btn btn-tertiary" title="Summary"><span class="glyphicon glyphicon-list" aria-hidden="true"></span>Quick Summary</a>

This is the script code but the below error is thrown even before the control reaches this code.

$(document).on("click", "#lookup", function (e) {
        $.ajax({
            url: "/Home/GetSummary/",
            type: 'POST',                
            beforeSend: function (xhr) {
                xhr.setRequestHeader("XSRF-TOKEN",
                    $('input:hidden[name="__RequestVerificationToken"]').val());
            },
            cache: true,
            async: true

        }).done(function (result) {
            $("#divSummary").html(result);
        });
    })

On click of it I get the following error :

Uncaught TypeError: Cannot read properties of undefined (reading
‘jQuery360059256788808060092’)

at Data.get (jquery.js:4301:9)

at Data.access (jquery.js:4319:16)

at Function.data (jquery.js:4459:19)

at HTMLAnchorElement.delegate (jquery.validate.js:419:23)

at HTMLFormElement.dispatch (jquery.js:5430:27)

at elemData.handle (jquery.js:5234:28)

at Object.trigger (jquery.js:8719:12)

at Object.simulate (jquery.js:8788:16)

at HTMLDocument.handler (jquery.js:8822:17)

get @ jquery.js:4301

access @ jquery.js:4319

data @ jquery.js:4459

delegate @ jquery.validate.js:419

dispatch @ jquery.js:5430

elemData.handle @ jquery.js:5234

trigger @ jquery.js:8719

simulate @ jquery.js:8788

handler @ jquery.js:8822

I have attached the screen shot of the same. I tried updating jquery file to see if it had anything to do with the jquery version but it still throws the same error. I have checked the compatibility of jqueryvalidate1.17 with jquery3.6 and there seems to be no issues.

Any leads on how to go about fixing it?

The image link : https://imgur.com/a/LcRdwD5

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    I know this is a weird fix and I have no explanation as to why this works, but I have several other links of type button which was working fine. So the only difference between this one and the other links were the prescence of the type = 'button' code.

    So the below code :

    <a id="lookup" href="#SummaryModal" type="button" data-toggle="modal" data-backdrop="static" class="btn btn-tertiary" title="Summary"><span class="glyphicon glyphicon-list" aria-hidden="true"></span>Quick Summary</a>

    becomes

    <a id="lookup" href="#SummaryModal" data-toggle="modal" data-backdrop="static" class="btn btn-tertiary" title="Summary"><span class="glyphicon glyphicon-list" aria-hidden="true"></span>Quick Summary</a>

    And voila it works.Has nothing to do with the jquery version or jquery file.


  2. 0

    I suggest you to check by consol.log this two variables: $('input:hidden[name="__RequestVerificationToken"]').val() and result. If one of them is undefined you know reason why you get this error. Here is explanation of this error code:

    Causes for TypeError: Cannot Read Property of Undefined
    The error clearly says that it is Undefined, which means the variable might be declared or used. Still, there is no value associated with the variable. In short, the value is not assigned.

    In JavaScript, properties or functions are Objects, but undefined is not an object type. If you call the function or property on such variable, you get the error in console TypeError: Cannot read undefined properties.

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search