Add link to cell but use a hidden field value to pass to function

Add link to cell but use a hidden field value to pass to function

canwejustcodecanwejustcode Posts: 31Questions: 8Answers: 0

In my datatable, I need to create a link using <a href /> but pass a value of another cell for that row to a function to get executed to load a list box. I'm able to add the link using the <a hre=/> however, is there a way to get the value of the other cell for that row the user clicked the link in?

table = $('#output').DataTable({
     columns : [ 
              {
                  data : "id",
                  defaultContent: '',
                  render : function (data) { 
                             return  data
                       }
               },
               { 
                  data : "make",
                  render : function (data, type, value) {
                            "<a href="#" id="carMake" onClick="Process()"> + data + '</a>'
                   }
               }
       ]
})

I want to use the ID field to pass into the Process() function when they click on the { make } link.

Answers

  • kthorngrenkthorngren Posts: 20,361Questions: 26Answers: 4,777

    See the columns.render docs. The docs show the third parameter, called row, contains the data for the full row. Also see this example. Something like this should work:

                      render : function (data, type, value) {
                                return '<a href="#" id="carMake" onClick="Process(' + row.id + ')">' + data + '</a>'
                       }
    

    Note that I added return and changed some of the double quotes to single quotes to allow for imbedded double quotes in the string.

    Kevin

  • canwejustcodecanwejustcode Posts: 31Questions: 8Answers: 0

    I looked at that and get { undefined } on the field I want to use for the link to pass to the JQuery function

  • kthorngrenkthorngren Posts: 20,361Questions: 26Answers: 4,777

    I just noticed you have value as the name of the third columns.render parameter. Either change it to row to match the docs or change the row.id to value.id.

    Kevin

  • canwejustcodecanwejustcode Posts: 31Questions: 8Answers: 0
    edited March 1

    I can combine the cells fine, it's when I wrap the <a href=" /> around it, it fails.

    I took this line from the example

     render: (data, type, row) => data + ' (' + row[3] + ')'
    

    and tried it like this:

    render : (data, type, row) => '<a href="#" onClick="ProcessIt(' + row.id + ')> + data + '<,/a>';
    

    and I get the { undefined } message, however, I can combine both values in one cell just fine.

    I get

    { uncaught reference error : 990 is not defined }

    and 990 is the ID being passed

  • canwejustcodecanwejustcode Posts: 31Questions: 8Answers: 0

    I got it working, I added an ID field so show the ID from the table, and now it works. Not sure why that would work, but I got it working

Sign In or Register to comment.