How can I access a ActionLink url parameter value in my ajax call?

Question

I’m trying to get a parameter value from my ActionLink to send it in an ajax call. My script looks like this:

    $("a.studentName").on("click", function () {
        var linkID = this.id;
        var theProp = $("linkID").attr("href");
        alert(linkID + "" + theProp);

        $.ajax({
            type: "GET",
            url: "/Controller/Action",
            data: { "data": linkID },
            dataType: "html",
            success: function (data) {
                $("theTimes").html(data);

            }

        });

    });


              @Ajax.ActionLink(stdFName, "Action", "Controller", new { studentNumber = stdNum }, null, new { @class = "studentName", id = "linkNo" + appendId.ToString() });  @: 

Which renders html that looks like this:

 <a id="linkNo1" class="studentName" href="/Controller/Action?studentNumber=172" data-ajax="true">Gary</a>

I’ve tried testing like this:

        var theProp = $("linkID").attr("href");
        alert(linkID + "" + theProp);

but I am only getting the value of the id not the url parameter value. Can you help me to access the parameter value? Thanks for any help with this one!

Answer 1

Looking to your code and the thing you want to be done, I would suggest first to make sure you understand the difference between.

$(linkID).attr(...)

and $("linkID").attr(...)

They are totally different things, until you get them cleared you will not be able to understand how this is fixed. jQuery documentation here might help you a bit.

and as far as the code is concerned, for the easiest fix use the following -

var linkID = this.id;
var theProp = $("#" + linkID).attr("href");
alert(linkID + "" + theProp);

or

var theProp = $(this).attr("href");
alert(theProp);