如何在JavaScript中设置Struts2 <s:select>标签的值？

首先得明确一个核心点：Struts2的标签是在服务器端解析生成HTML代码的，而JavaScript是在客户端运行的，所以你没办法直接在JS里“设置Struts2标签的值”——当页面加载到浏览器时，Struts标签已经变成了普通的HTML元素（比如<input>）。不过我们有两种靠谱的方案来实现你的需求：

方案一：克隆服务器端渲染的模板行 #

先在页面中隐藏一个由Struts2标签生成的“模板行”，之后用JS克隆它并修改索引和值，这样既能保留Struts2标签的特性（比如主题、默认的表单绑定逻辑），又能动态添加行。

步骤示例： #

1. 在页面中添加隐藏的模板行：

<!-- 隐藏的模板行，用[0]作为占位索引 -->
<tr id="ligne-template" style="display: none;">
  <td><s:textfield type="text" name="catalogue.lignes[0].id.catalogue.ID_CATAL" /></td>
  <td><s:textfield type="text" name="catalogue.lignes[0].someOtherField" /></td>
  <!-- 其他需要的列 -->
</tr>

2. 用JavaScript克隆并修改模板行：

let counter = 0; // 初始索引，根据你的需求调整

function addNewRow() {
  // 克隆模板行
  const newRow = document.getElementById('ligne-template').cloneNode(true);
  newRow.style.display = ''; // 显示行
  newRow.removeAttribute('id'); // 移除模板的id，避免重复

  // 替换所有input的name属性中的索引，同时设置值
  const inputs = newRow.querySelectorAll('input');
  inputs.forEach(input => {
    // 把[0]替换成当前counter的索引
    const updatedName = input.getAttribute('name').replace('[0]', `[${counter}]`);
    input.setAttribute('name', updatedName);
    // 设置你需要的初始值，比如空值或者从后端传递的默认值
    input.value = ''; // 或者你预设的初始值
  });

  // 将新行添加到表格中
  document.getElementById('your-table-body-id').appendChild(newRow);
  counter++;
}

方案二：直接生成纯HTML输入框 #

既然Struts2标签最终会被渲染成普通的HTML元素，我们可以跳过Struts标签，直接用JS生成符合Struts2 OGNL命名规则的<input>元素，这种方式更灵活直接。

代码示例： #

let counter = 0;

function addNewRow() {
  const tableBody = document.getElementById('your-table-body-id');
  const newRow = document.createElement('tr');
  
  // 生成包含正确name属性的input
  newRow.innerHTML = `
    <td><input type="text" name="catalogue.lignes[${counter}].id.catalogue.ID_CATAL" value="你的初始值" /></td>
    <td><input type="text" name="catalogue.lignes[${counter}].someOtherField" value="另一个初始值" /></td>
  `;
  
  tableBody.appendChild(newRow);
  counter++;
}

这种方式的好处是不需要依赖服务器端的模板行，完全由客户端动态生成，只要保证name属性的格式和Struts2的集合绑定规则一致（对象.集合[索引].属性），提交表单时Struts2依然能正确把数据封装到catalogue.lignes集合中。

额外注意事项 #

• 如果需要回显已有数据（比如编辑页面），可以先在服务器端把catalogue.lignes集合转成JSON字符串，传递给JS：

<s:set var="lignesJson" value="@com.google.gson.Gson@toJson(catalogue.lignes)" />
<script>
  // 把后端的集合转成JS数组
  const existingLignes = %{#lignesJson};
  // 动态生成行时，就可以从existingLignes中取出对应索引的值设置到input里
</script>

• 确保counter的递增逻辑正确，每个动态行的索引唯一，否则Struts2无法正确识别集合中的元素。

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