如何在JS函数中获取JSP页面display:column属性的值

问题原因 #

1. 你的display:column未添加class="type"属性，导致$('.type')无法匹配到对应元素，返回undefined。
2. display:column最终会渲染为HTML的<td>标签，属于普通文本展示元素，不能用.val()方法获取内容——.val()仅适用于input/select/textarea这类表单控件。

解决方案 #

步骤1：给display:column添加标识类 #

修改JSP中的display:column，添加class属性以便JS选择：

<display:table>
...
<display:column property="surnameName" title="Surname, Name" />
<display:column property="type" title="Type" class="type-column" />
....
</display:table>

步骤2：用正确方法获取文本内容 #

根据业务场景选择对应方式：

• 单一行数据场景：直接获取该列的文本（用.text()并去除首尾空格）：

function next2(){
  ...
  // 获取type列的文本内容
  var type = $('.type-column').text().trim();
  ...
  // 注意：原代码中"Mail Addresss"多了一个s，建议修正为"Mail Address"
  if (documents.length > 1 && (type=='Mail Address' || type=='Ordinary')) {
    alert("You must select at least a PDF for Mail Address or Ordinary type for the stakeholder");
    return false;
  }
  ...
}

• 多行表格选中行场景：假设选中行带有selected类：

function next2(){
  ...
  // 获取选中行的type列文本
  var type = $('tr.selected .type-column').text().trim();
  ...
  if (documents.length > 1 && (type=='Mail Address' || type=='Ordinary')) {
    alert("You must select at least a PDF for Mail Address or Ordinary type for the stakeholder");
    return false;
  }
  ...
}

• 遍历所有行校验场景：

function next2(){
  ...
  var isValid = true;
  // 遍历表格所有行（替换display-table-selector为表格实际选择器，如id/class）
  $('display-table-selector tr').each(function() {
    var type = $(this).find('.type-column').text().trim();
    if (documents.length > 1 && (type=='Mail Address' || type=='Ordinary')) {
      alert("You must select at least a PDF for Mail Address or Ordinary type for the stakeholder");
      isValid = false;
      return false; // 终止遍历
    }
  });
  return isValid;
  ...
}

内容的提问来源于stack exchange，提问作者crmaidev