如何实现复选框选择功能以使用ajax / json发送电子邮件？可能的话

Question

我有一个MVC应用程序，该应用程序使用dataTables并通过c＃控制器，然后是.cshtml表索引中的json / ajax脚本，调用列的数据和复选框。这可能不是最有效的方法，但是到目前为止，这是我使它起作用的方式。

如果可以在json / ajax或jquery / javascript中使用，我该如何选择一个复选框，然后单击一个按钮，该按钮调用模式以发送电子邮件，但正在从检查中调用数据表中的电子邮件ID -框，因此我不必手动输入要将电子邮件发送到的电子邮件地址（仅主题和电子邮件正文）。如果不可能，我该怎么办？

html列

<div style="width:90%; margin:0 auto" class="tablecontainer">
<a class="popup btn btn-primary" href="/CRUD/save/0" style="margin- 
bottom:20px; margin-top:20px;">Add New Volunteer</a>
<table id="myDatatable">
<thead>
<tr>
<th><input type="checkbox" name="select_all" value="1" id="example-select-all"></th>
<th>Email</th>
<th>Password</th>
<th>First Name</th>
<th>Last Name</th>
<th>Phone Number</th>
<th>Address</th>
<th>City</th>
<th>State</th>
<th>Zip Code</th>
<th>Credentials</th>
<th>Availability</th>
<th>Edit</th>
<th>Delete</th>

</tr>
</thead>
</table>
</div>

ajax / json示例

<script>
$(document).ready(function () {
var oTable = $('#myDatatable').DataTable({
"ajax": {
"url": '/CRUD/GetEmployees',
"type": "get",
"datatype": "json"
},

"columns":
[
{"data": "empty"},
{ "data": "EmailID", "autoWidth": true },
{ "data": "Password", "autoWidth": true },
{ "data": "FirstName", "autoWidth": true },
{ "data": "LastName", "autoWidth": true },
{ "data": "PhoneNumber", "autoWidth": true },
{ "data": "UserAddress", "autoWidth": true },
{ "data": "UserCity", "autoWidth": true },
{ "data": "UserState", "autoWidth": true },
{ "data": "UserZip", "autoWidth": true },
{ "data": "UserCredentials", "autoWidth": true },
{ "data": "UserDate", "autoWidth": true },
{"data": "UserID", "width": "50px", "render": function (data) {
return '<a class="popup" href="/CRUD/save/'+ data + '">Edit</a>';}
},
{
"data": "UserID", "width": "50px", "render": function (data) {
return '<a class="popup" href="/CRUD/delete/' + data + '">Delete</a>';
}}],
'columnDefs': [{
'targets': 0,
'searchable': false,
'orderable': false,
'className': 'dt-body-center',
'render': function (data, type, full, meta) {
return '<input type="checkbox" name="id[]" value="' + 
$('<div/>').text(data).html() + '">';}}]})

// more code here for modal on clicks for edit and delete views //

</script>

这是一个看起来像的照片示例。我有数据表，我只需要单击功能和模式上的按钮。

Answer 1

我认为您需要使用-

  

table.rows（'。selected'）。data（）

 var table = $('#example').DataTable();
  var emailbox=$("#emailBox");
  emailbox.val('');
  console.log(table.rows('.selected').data());
  var selectedData=table.rows('.selected').data();
  var emails = $.map(selectedData, function (item) { return item[2] });
  console.log(emails);
  for(var i=0;i<emails.length;i++){
         if(i==0){
             emailbox.val(v);
         }
         else{
           emailbox.val(emailbox.val()+";"+ v);
         }
  }
  $.each(emails,function(k,v){
        emailbox.val(emailbox.val()+v);
  })

您可以看到一个有效的示例here。