工作总结：修改装箱方式(前后端数据交互)

本文链接：https://blog.csdn.net/qq_52811003/article/details/131821016

在修改揽箱人页面添加修改装箱方式功能时，遇到前端无法获取选行trade_code及后端方法名错误的问题。通过修改前端代码避免ID冲突，调整后端方法名以匹配新的参数名，解决了数据传输和存储的错误，实现了装箱方式的正确修改。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

修改装箱方式

任务目标

需要在修改揽箱人页面添加修改装箱方式按钮，使得市场部人员能够对所选行的装箱方式进行修改。

遇到的问题及解决方式

需要对所选行的装箱方式进行修改，那么我们需要知道选取了哪几行，可以通过前端向后端传送托单号trade_code

但是在实现过程中发现并没有获取到所选行的trade_code
在这里插入图片描述

原因是前端并没有获取到页面上所选行的trade_code

var boxLoadType = '';
for (let i = 0; i < rows.length; i++) {
   
    var trade_code = rows[i].trade_code;
  
    tradeCode += trade_code + ",";
}
tradeCode = tradeCode.substr(0,tradeCode.length-1);
$("#tradeCode").val(tradeCode);

在保存修改按钮js中添加以上，可以获取到页面上的trade_code,但是这样修改之后还是出现异常原因是上边的修改揽货人也获取了tradecode 两个input的id都是tradecode发生了冲突导致没有获取值

在html文件中修改装箱方式按钮区域添加该隐藏域

<input id="tradeCode2" name="tradeCode2" hidden/>

并将上述代码的trade_code进行修改防止冲突

var tradeCode2 = '';
for (let i = 0; i < rows.length; i++) {
    var trade_code = rows[i].trade_code;
    tradeCode2 += trade_code + ",";
}
tradeCode2 = tradeCode2.substr(0,tradeCode2.length-1);
$("#tradeCode2").val(tradeCode2);

这样就能获取到trade_code了，但是后台还是报错
在这里插入图片描述

打断点调试发现是后端方法名忘记修改，前端传送过来的是trade_code2，但是后端的get方法使用的是trade_code

$[(C:\Users\PC\AppData\Roaming\Typora\typora-user-images\image-20230720011725055.png)]$

将方法改为tradecode2并创建tradecode2属性与get set方法

String[] split = vo.getTradeCode2().split(",");

获取tradecode的时候方法名改为了tradecode2

在这里插入图片描述

但是最后修改的时候忘记存值的方法也改成tradecode2导致parameters里面的值是空的

将存值方法也改为tradecode2，再加伤之前所写的正确的修改方法完成此次任务