5-2 進貨單明細 - 商品子視窗(2)

1. 按鈕
   templates/ugm_stk_purchase.tpl

   
               <!--第一行数据-->
               <tr id="newRow" class="newRow" data-sn="" data-prod="">
                 <td >
                   <!--商品編號-->
                   <div class='form-group'>
                     <div class="input-group">
                       <input type="text" class="prod form-control" name='prod[]' value="" readonly>
                       <div class="input-group-prepend">
                         <a href="javascript:void(0)" class="prodWin" >
                         <div class="input-group-text">...</div>
                         </a>
                       </div>
                     </div>
                   </div>
                 </td>

    

2. 調用插件

   
         // 調用插件，商品子視窗
         $(".prodWin").click(function(){
           var vTr = $(this).parents("tr:first");//得到父tr对象;
           var sn = vTr.attr("data-prod");//取得商品流水號
           var id = vTr.attr("id");//取得id
           var url = 'purchase.php?op=prodWin&sn='+sn+'&id='+id;
           var wH = 350;
           var wW = 600;
           var wL = 0;
           var wT = 0;
           childWin(url,wH,wW,wL,wT);
         });

    

3. 子視窗函數

    
         //子視窗函數
         function childWin(url,wH,wW,wL,wT)
         {
           mywin=window.open("","","height=" + wH + ",width=" + wW + ",left="+ wL + ",top=" + wT );
           mywin.location.href = url ;
         }
   

    

4. 程式流程
   purchase.php

   
     #----- 商品子視窗
     case "prodWin":
       echo prodWin($sn);
       exit;

    

5. 程式函數

   
   function prodWin($sn=""){
     global $xoopsDB;
     #---- 過濾資料 --------------------------
     $myts = &MyTextSanitizer::getInstance();
     $id = system_CleanVars($_REQUEST, 'id', '', 'string');
     
     $sql = "select a.sn,a.title,b.title as kind_title
             from " . $xoopsDB->prefix("ugm_stk_prod") . " as a 
             left join ". $xoopsDB->prefix("ugm_stk_kind") ." as b on a.kind = b.sn
             where a.enable='1'
             order by a.sort desc"; //die($sql);
   
     $result = $xoopsDB->query($sql) or redirect_header($_SERVER['PHP_SELF'], 3, web_error($sql));
     $rows = "";
     
     while ($row = $xoopsDB->fetchArray($result)) {
       $row['sn'] = intval($row['sn']);
       $row['title'] = $myts->htmlSpecialChars($row['title']);//
       $row['kind_title'] = $myts->htmlSpecialChars($row['kind_title']);//
       $checked = ($row['sn'] == $sn) ? "<input type='radio' checked >":"";
       $rows .= "<tr><td>{$checked}</td><td>{$row['sn']}</td><td>{$row['title']}</td><td>{$row['kind_title']}</td></tr>";
     }
     $title = "商品資料";
     $content = "    
       <link rel='stylesheet' href='".XOOPS_URL."/modules/ugm_tools2/class/bootstrap-table/bootstrap-table.css'>
       <script src='".XOOPS_URL."/modules/ugm_tools2/class/bootstrap-table/bootstrap-table.js'></script>
   
       <script>
           function senddata()
           {
             var sn = $(\"[name='btSelectItem']:checked\").val();
             var id = '{$id}';
             window.opener.getAjaxProd(sn,id);//run 母視窗的方法
             window.close();//結束子視窗
             //console.log(x);
           }
       </script>
   
       <div class='container-fluid'>
         
         <table id='table'
                data-toolbar='#toolbar'
                data-search='true'
                data-toggle='table'
                data-height='300'
                data-sort-name='name'
                data-sort-order='desc'
                data-pagination='true'
                data-id-field='sn'
                data-page-list='[10, 25, 50, 100, ALL]'
                data-show-footer='false'
                data-click-to-select='true'>
   
             <thead>
             <tr>
                 <th data-field='state' data-radio='true'></th>
                 <th data-field='sn' data-sortable='true'>商品編號</th>
                 <th data-field='title' data-sortable='true'>商品名稱</th>
                 <th data-field='kind_title' data-sortable='true'>商品類別</th>
             </tr>
             </thead>
             <tbody>
               {$rows}
             </tbody>
         </table>
         <input type='button' value='送出' onClick='senddata()' />
       </div>
   
     ";
     $main = show_lytebox_html_b4($content,$title);
   
     return $main;
   }

    

6. 傳回商品sn，由母視窗AJAX
   templates/ugm_stk_purchase.tpl

   
       //用廠商流水號，取得廠商資料
       function getAjaxProd(sn,id)
       {
         $.ajax({
           type: 'GET',
           url: '<{xoAppUrl}>modules/ugm_stk/purchase.php?op=getAjaxProd&id=' + id + '&sn=' + sn,
           dataType: 'json',
           success: function(data) {
             var target = $('#'+data.id);
             target.find('.prod').val(data.sn);//商品編號
             target.find('.prod_title').html(data.title);//商品名稱
             target.find('.price').val(data.price);//商品進價
             target.find('.amount').focus();//聚焦數量
           },
           error: function(jqXHR) {
             alert('發生錯誤:(templates/ugm_stk_purchase.tpl/getAjaxProd) ' + jqXHR.status);
           }
         })
       }

    

7. 程式
   流程

   
     case "getAjaxProd":
       echo getAjaxProd($sn);
       exit;

   
   函數

   
   ################################
   # 用流水號取得廠商資料
   #################################
   function getAjaxProd($sn){
     global $xoopsDB;
     #---- 過濾資料 --------------------------
     $myts = &MyTextSanitizer::getInstance();
     $id = system_CleanVars($_REQUEST, 'id', '', 'string');
     #外鍵  
     $sql = "select a.*
             from " . $xoopsDB->prefix("ugm_stk_prod") . " as a 
             where a.sn='$sn'"; //die($sql);
     $result = $xoopsDB->query($sql) or redirect_header($_SERVER['PHP_SELF'], 3, web_error($sql));
     $row = $xoopsDB->fetchArray($result);
   
     $rows['sn'] = intval($row['sn']);//商品流水號
     $rows['title'] = $myts->htmlSpecialChars($row['title']);//商品名稱
     $rows['price'] = intval($row['price']);//名稱
     $rows['id'] = $id ;
     return json_encode($rows, JSON_UNESCAPED_UNICODE) ;
   }

    

8.  
9.