如何在 JavaScript 中从行表中获取值字符串

Question

我想获取来自第

result_status

行的

status

的值。

如果值行

status

全部通过，

result_status

将获得值

pass

，但如果值行

status

其中一个获得

fail

。因此，

result_status

将获得值

fail

。

在这张图中，结果状态必须获取值

fail

，因为其中一个也获取值

fail

这是 JavaScript

function hasil(){
  //const row =inputStat.parentElement.parentElement;
  var status = document.querySelector('[name="status_hidden[]"]').value;

  if (status !== "fail"){
    console.log("pass");
    document.querySelector("#result_status").value = 'pass';
  }else{
    console.log("fail");
    document.querySelector("#result_status").value = 'fail';
  }
}

这是 AJAX

$.ajax({
    type: 'POST',
    url : "<?=site_url('c_transaksi/keranjang_method') ?>",
    data:data_method,
    success: function(data) {
        $('table#keranjang_method tbody').append(data);
        $('tfoot').show()

        $('#result_status').html('<strong>' + hasil() + '</strong>')

    },
    error: function(){
        alert('error');
    }
})

这是 HTML

<tr class="row-keranjang-method">
        <td hidden>
            <?= $this->input->post('report_no') ?>
            <input type="hidden" name="report_no" value="<?= $this->input->post('report_no')?>">
        </td>
        <td hidden>
            <?= $this->input->post('id_testmatrix') ?>
            <input type="hidden" name="id_testmatrix_hidden[]" value="<?= $this->input->post('id_testmatrix')?>">
        </td>
        <td class="method_code">
            <p style="color:blue;"><?= $this->input->post('method_code') ?></p>
            <input type="hidden" name="method_name_hidden[]" value="<?= $this->input->post('method_name')?>">
            <p><?= $this->input->post('method_name') ?></p>
            <input type="hidden" name="method_code_hidden[]" value="<?= $this->input->post('method_code')?>">
        </td>
        <td>
            <p>value from : <strong><input class="value_from" name="value_from" value="<?= $this->input->post('value_from') ?>" style="width: 4%;" disabled></strong>
            to<strong><input class="value_to" name="value_to" value="<?= $this->input->post('value_to') ?>" style="width: 4%;" disabled></strong></p>
            <p><?= $this->input->post('measurement') ?></p>
            <input type="hidden" name="measurement_hidden[]" value="<?= $this->input->post('measurement')?>">  
        </td>
        <td style="width: 10%;">
            <?= $this->input->post('result') ?>
            <input class="form-control result" type="input" name="result_hidden[]" style="align: middle;" onkeyup="sum_method(this);" value="<?= $this->input->post('result')?>">
        </td>
        <td style="width: 10%;" class="status">
            <?= $this->input->post('status') ?>
            <input class="status" type="text" name="status_hidden[]" value="<?= $this->input->post('status')?>" style="border:0; outline:0;" readonly>
        </td>
        
        <td style="width: 10%;"><center>
            <button type="button" class="btn btn-lg btn-danger" id="hapus_method" data-nama-method="<?= $this->input->post('method_name')?>"><i class="fa fa-trash"></i></button>
        </td>
</tr>

<td colspan="3" align="right"><strong>Result Status : </strong></td>
                                <td id="result_status"></td>

但是

result_status

取不到值。

Answer 1

您的尝试中存在一些问题：

• 此代码：

  $('#result_status').html('<strong>' + hasil() + '</strong>')
  

  ...期望

  hasil()

  返回一个字符串，但是

  hasil()

  没有 return 语句，所以这将始终显示

  undefined

• 这段代码在

  hasil

  ：

  document.querySelector("#result_status").value = 'pass';
  

  ...结果状态中显示“通过”，但这会立即被上一点提到的代码覆盖。

• 这段代码在

  hasil

  ：

  var status = document.querySelector('[name="status_hidden[]"]').value;
  

  ...仅选择第一个匹配项，即 first 行的状态。您需要检查所有行，而不仅仅是第一行。

更正：

一个解决方案是收集所有状态，然后获取其中的最小值。由于“fail”在词法上小于“pass”，因此如果任何行中没有“fail”，结果只会是“pass”。

代码：

$('#result_status').text($('[name="status_hidden[]"]')
                         .map((i, input) => input.value).get().sort()[0]);

（然后放下

hasil

）。