1
Answer

href passing multiple parameters using a jquery datatable - render

First Last

First Last
4y
5.3k
1

I have a working jQuery DataTable that I render 1 query string for each link in a column. The edit, details and delete links of that column each receives the 1 parameter: the 'GbngUpdateId' value that is passed to the corresponding action method as a query string that it in turn uses as needed.

I now need to add 2 more parameters to the edit link of that column and pass them accordingly in the query string. They would be: 'PublishedSwitch' and 'AlertSentSwitch'.

The 2 extra parameters are in the list of this object that gets sent to the DataTable that it uses to build the grid.

  1. GbngUpdateForMaint gbngUpdateForMaint = new GbngUpdateForMaint  
  2.  {  
  3.    GbngUpdateId = hold.GbngUpdateId,  
  4.    GbngUpdateTitle = hold.GbngUpdateTitle,  
  5.    PublishedSwitch = hold.PublishedSwitch,  
  6.    PublishedDateTime = hold.PublishedDateTime,  
  7.    AlertSentSwitch = hold.AlertSentSwitch,  
  8.  };  
How can I render these 2 extra parameters in the jQuery for that column in the Datatable?
 
----------- 

I tried building it - the return string is syntactically correct.

For this column, 'data' refers to: gbngUpdateId.

I don't know how to access 'PublishedSwitch' and 'AlertSentSwitch' which are actually different columns on the same row. I want to use them too and send in the query string for this column.

I have ???? as placeholders for now.

  1. "render": function (data, type, full, meta) {  
  2.   return '"@Url.Action("EditGbngUpdate", "GbngUpdateMaint")?   
  3.   gbngUpdateId=' + data + '&publishedSwitch=' + ???? + '&alertSentSwitch='   
  4.   + ???? +'" class="editGbngUpdate">Edit | 
  5.   href="@Url.Action("DetailsGbngUpdate", "GbngUpdateMaint")?gbngUpdateId='   
  6.   + data + '" class="detailsGbngUpdate">Details | 
  7.   href="@Url.Action("DeleteGbngUpdate", "GbngUpdateMaint")?gbngUpdateId='   
  8.   + data + '" class="deleteGbngUpdate">Delete';  
 ---------- 
 
Here's the working jQuery DataTable(the grid) that I render 1 query string. The edit, details and delete action methods each receives the 1 parameter: GbngUpdateId value.
 
  1. // Declare the datatable ViewModel.  
  2. var gbngUpdateListVM;  
  3.   
  4. $(function () {  
  5.     gbngUpdateListVM = {  
  6.     dt: null,  
  7.   
  8.     init: function () {  
  9.         dt = $('#gbngupdates-data-table').DataTable({  
  10.             "serverSide": true,   // For processing server-side.  
  11.             "processing": true,   // For showing the progress bar.  
  12.             "ajax": {  
  13.                 "url": "@Url.Action("GetGbngUpdatesForMaintList", "GbngUpdateMaint")",  
  14.                 "dataType": "json",  
  15.                 "data": function (data) {  
  16.                     },  
  17.                 "error": function (error) {  
  18.                     $("#jsonErrorMessage").text(error.responseJSON.ErrorMessage);  
  19.                     // Show it.  
  20.                     $("#jsonErrorMessage").css("display", "block");  
  21.                 }  
  22.         },  
  23.             "columns": [  
  24.                 {  
  25.                     "title": "Actions",  
  26.                     "data": "GbngUpdateId",  
  27.                     "searchable": false,  
  28.                     "sortable": false,  
  29.                     "render": function (data, type, full, meta) {  
  30.                         return ' + data + '" class="editGbngUpdate">Edit |  + data + '" class="detailsGbngUpdate">Details |  + data + '" class="deleteGbngUpdate">Delete';  
  31.                     }  
  32.                 },  
  33.                 { "title": "Update Title", "data": "UpdateTitle", "searchable": true },  
  34.                 { "title": "Published", "data": "PublishedSwitch", "searchable": true },  
  35.                 { "title": "Published Date", "data": "PublishedDateTime", "searchable": true },  
  36.                 { "title": "Alert Sent", "data": "AlertSentSwitch", "searchable": true }  
  37.             ],  
  38.             "lengthMenu": [[10, 25, 50, 100], [10, 25, 50, 100]],  
  39.             });  
  40.         }  
  41.     }  
  42.   
  43.     // Initialize the datatable.  
  44.     gbngUpdateListVM.init();  
  45. });  
 
Answers (1)
Next Recommended Forum