layui 參照賦值的兩種方式

阿新 • • 發佈：2020-08-15

前言

上一篇解決了，在layui中子頁面傳值回父頁面的問題。

這一篇主要總結：子頁面傳值回父頁面後，賦值的兩種方式：文字框賦值；表格賦值。

文字框賦值

文字框賦值的方式，相對的簡單。只需獲取到子頁面的值後，轉換成物件後，直接賦值即可。程式碼如下所示：

 parent.layer.open({
       type: 2,
       title: '標題資訊',
       amin: 4,
       shadeClose: true,
       shade: 0.8,
       area: ['55%', '65%'],
       btn: ["確定", '關閉'],
       content: '../TankInPlan/HtReferList',
       success: function (layero, index) { },
       yes: function (index, layero) {
            var obj = $(layero).find("iframe")[0].contentWindow;
            $(layero).find("iframe")[0].contentWindow.$('#saveBtn').click();//執行子頁面的按鈕點選事件
            var mJson = obj.$('#uidsub').val();//1.取值
            if (mJson != "") {
                var _mJson = $.parseJSON(mJson);//2.轉換成物件
                $("#uCompId").val(_mJson[0].uCompId);//3.賦值
                $("#cCompCode").val(_mJson[0].cCompCode);
                $("#cCltName").val(_mJson[0].cCltName);
             }
        },
  });

表格賦值

表格賦值，可能有人會很納悶。表格賦值和文字框賦值難道還不一樣嗎？文字框賦可以直接賦值，但是，表格需要找到對應的子元素才能賦值。程式碼如下所示：

<table class="layui-table" id="tabCLXX" style="margin:0px;">
   <thead>
         <tr>
             <th>車牌號碼</th>
             <th>掛車號碼</th>
             <th>司機姓名1</th>
             <th>身份證號1</th>
             <th>手機號1</th>
             <th>司機姓名2</th>
             <th>身份證號2</th>
             <th>手機號2</th>
             <th>裝車數量</th>
             <th>操作</th>
          </tr>
   </thead>
   <tbody>
      <tr class="list">
          <td><input type="text" lay-verify="required" class="layui-input"  ondblclick="ShowCPHM(this)" /></td>
          <td><input type="text" class="layui-input" name="cCarGuaNo" /></td>
          <td><input type="text" lay-verify="required" class="layui-input"/></td>
          <td><input type="text" class="layui-input"/></td>
          <td><input type="text" class="layui-input" /></td>
          <td><input type="text" class="layui-input" /></td>
          <td><input type="text" class="layui-input" /></td>
          <td><input type="text" class="layui-input" /></td>
          <td><input type="text" class="layui-input" value="0.000" /></td>
          <td><button class="layui-btn layui-btn-danger btnDelRow">刪除</button></td>
       </tr>
    </tbody>
</table>

function ShowCPHM(objs){
  parent.layer.open({
       type: 2,
       title: '標題資訊',
       amin: 4,
       shadeClose: true,
       shade: 0.8,
       area: ['55%', '65%'],
       btn: ["確定", '關閉'],
       content: 'url路徑',
       success: function (layero, index) { },
       yes: function (index, layero) {
            var obj = $(layero).find("iframe")[0].contentWindow;
            $(layero).find("iframe")[0].contentWindow.$('#saveBtn').click();//執行子頁面的按鈕點選事件
            var mJson = obj.$('#uidsub').val();//1.取值
            if (mJson != "") {
                var _mJson = $.parseJSON(mJson);//2.轉換成物件
                $(objs).val(_mJson[0].cCarNO);//3.給第一個input 賦值
                $(objs).parent().next().children().val(_mJson[0].cGuaChe);//給第二個input賦值
             }
        },
  });
}