I'm calling a function inside of a href. How can I pass more than one parameter through?

Question

I have a jqgrid and am calling 'returnHyperLink' in my custom formatter. This code works fine, and goes to the link I am requesting:

function returnHyperLink(cellValue, options, rowdata, action) {
     return '<a id="myLink" href="#" onclick="switchPage(\''+cellValue+'\');">'+cellValue+'</a>'

}

function switchPage(cellValue) {
     $("#contents").load("jsp/newpage.jsp");
}

But I would like to add one more parameter when calling calling switchPage from returnHyperLink.

I am looking for the correct formatting to something like this:

function returnHyperLink(cellValue, options, rowdata, action) {
return '<a id="myLink" href="#" onclick="switchPage(\''+cellValue+'\', \''+rowdata+'\');">'+cellValue+'</a>'
}

So that I can access that particular rowdata object and extract information from it before calling $("#contents").load("jsp/newpage.jsp"); in switchPage

Obviously, my new switchPage function would look like this:

function switchPage(cellValue, rowdata)

@Rayon When I said "I am looking for the correct formatting to something like this," that's the code that doesn't seem to be right. When I try to console.log rowdata.name, for example, it prints 'undefined.' When I try the same thing from inside of returnHyperLink, it works correctly. I don't think my parameter is going through — Jules Mena, Jun 24 '16 at 15:55

score 0 · Answer 1 · edited May 23 '17 at 12:16

You can not pass rowdata directly because you can't pass objects inside inline onclick events. To do that you should put it to onlick defined inside a javascript as described in this Question but that is not going to work for you.

So what you should do ispass all the rowdata fields you need one by one lets say you need Field1 and Field2 from your rowdatathen you do this

 function returnHyperLink(cellValue, options, rowdata, action) 
 {
   return '<a id="myLink" href="#" onclick="switchPage(' + cellValue+ ', ' + rowdata.Field1+ ', ' + rowdata.Field2+');">' + cellValue+ '</a>';          
 }

function switchPage(cellValue,field1, field2) {
    // do whatever with field1,field2...
     $("#contents").load("jsp/newpage.jsp");
}

score 0 · Answer 2 · answered Jun 24 '16 at 21:10

You could build your link string using an array, something like...

    function returnHyperLink(cellValue, options, rowdata, action) {
        var link = "<a id='myLink' href='#' onclick='switchPage(" + cellvalue;
        $.each(rowdata, function (index, value) {
            link += ", " + value
        });
        link + ');">' + cellValue + '</a>';
        return link
    }

I'm calling a function inside of a href. How can I pass more than one parameter through?

2 Answers2