查找Full tr​​值并将其绑定为json格式以发送到api

如何解决查找Full tr​​值并将其绑定为json格式以发送到api

一组数据已以表格格式打印到我的html页面，这是另一种json格式的api附带的图片，我在下面附上了图片

如您所见，有几个复选框，我要在此处执行的操作是：选中复选框并单击“启动RPA”按钮时，我使用那些复选框jquery选择的复选框将从其最近的tr和r中找到站点和文件柜数据。那么它将以下面给定的json格式绑定数据

{ "siteList": [ 
    { "siteName": "Site1","deviceList": [ 
            { "deviceName": "S1device1"},{ "deviceName": "S1device2"} 
            ] 
    },{ "siteName": "Site2","deviceList": [ 
            { "deviceName": "S2device1"},{ "deviceName": "S2device2"} 
            ] 
    },{ "siteName": "Site3","deviceList": [ 
            { "deviceName": "S3device1"  },{ "deviceName": "S3device2"} 
            ] 
    },] 
}

这是我尝试的代码

   $(document).ready(function()
    {
    $('#faliure').css('display','none');
  $('#success').css('display','none');
  

  var checks = [];

function get_checks(e) {
  $(e).each(function(x,o) {
    var siteListMain = {}
    if ($(e).is(":checked")) {
      let getTds = $(e).closest('tr').find('td')
      let siteName = getTds.eq(1).text()
      let cabinet = getTds.eq(2).text()
      siteListMain.siteList = siteName
      siteListMain.deviceName = cabinet
      checks.push(siteListMain)
    } else {
      checks.splice(checks.indexOf(siteListMain),1)
    }
  })
}

 $('#certlogonForm').validate({

          rules: {
          // The key name on the left side is the name attribute
          // of an input field. Validation rules are defined
          // on the right side
          j_username: "required",j_password: "required"
          
        },// Specify validation error messages
        messages: {
          j_username: "Please enter username",j_password: "Please enter password"
        },submitHandler: function(form,e) {
          e.preventDefault();
         console.log(checks)
            console.log(checks);
            var tr_data = [];
          var check_length = checks.length;
            $.ajax({
                url: "https://reqres.in/api/login",type: "GET",data: $(form).serialize(),beforeSend: function() {
                  $("#imageload").show();
                  $('#logonuidfield').attr('readonly',true);
                  $('#logonpassfield').attr('readonly',true);
                  // xhr.setRequestHeader("Authorization","Basic " + btoa("pd_adeptcom_bnd:xk8MU9TR"));
                
                },success: function(response) {
                    // $('#exampleModal').modal('toggle');
                    $("#imageload").hide();
                    $('#success').css('display','block');
                    $('#faliure').css('display','none');
                   
                    $('#info').html('Total 0 cabinets selected estimated hours 0 hours');
                   
                 $("#sub").attr("disabled",true);


                },error:function(error)
               {
                  $("#imageload").hide();
                  $('#exampleModal').modal('toggle');
                  $('#faliure').css('display','block');
                   $('#success').css('display','none');
               }
        });
    }
});
 

    });

每当我控制台日志检查[] []

请帮助我解决此问题，我们将不胜感激任何帮助 预先谢谢你

解决方法

您只需要在实际的$.each复选框上使用checked。另外，在您的JSON API table数据中，您需要使用onchange函数，而不是onclick-在此，我们将tr -> td ->的数据发送到我们的{{1} }。

选择完checksArray后，您可以单击checkboxes按钮，您会看到所有选中的initiate RPA中的console.log及其最接近的{{1 }}数据。

此外，如果您选中checkboxes复选框，则该项目将从tr中删除，因此我们可以使用uncheck方法。

实时工作演示：

checkArray

splice()