乡下人产国偷v产偷v自拍,国产午夜片在线观看,婷婷成人亚洲综合国产麻豆,久久综合给合久久狠狠狠9

  • <output id="e9wm2"></output>
    <s id="e9wm2"><nobr id="e9wm2"><ins id="e9wm2"></ins></nobr></s>

    • 分享

      jQuery.FlexiGrid應(yīng)用總結(jié)

       凌氏 2014-04-24
       jQuery.FlexiGrid使用總結(jié)

      經(jīng)過對FlexiGrid的大量使用,及時不時琢磨下其代碼,對她的脾性有了一定的了解,是該做總結(jié)的時候了。

       

      一、FlexiGrid下載

      1、原版代碼

      最近Paulo P. Marinas對FlexiGrid做了修改,以適應(yīng)jQuery 1.4.2??戳讼伦髡吡谐鰜淼奶匦员恚摫砗荛L,但與過去比,卻沒有增加什么新功能,所以版本號不做修改,仍然是1.0b3。
      其中提到的一點值得注意,就是flexAddData方法已改寫,性能是否有很大提高,還沒測試,要看結(jié)果。(最近,抽時間看了一下渲染表格數(shù)據(jù)的代碼,估計效率還是不理想)。還有Editable功能的增加,仍然處于長期計劃中,這一點比較令人糾結(jié)。


      在此說明一下,本文仍然只是對舊版進(jìn)行總結(jié)。

       

      下載:http://code.google.com/p/flexigrid/downloads/list

      2、功能優(yōu)化擴(kuò)展版
      該版本為xuanye(http://www.cnblogs.com/xuanye )的修改版,很好,很強(qiáng)大。

       

      下載1:http://code.google.com/p/xjplugin/downloads/list

      下載2:http://xjplugin./svn/trunk/ControlsSample/Javascripts/Plugins/jquery.flexigrid.js

       

      下載2中的代碼新增了getSelectedRows()方法,獲取表格行數(shù)據(jù)將更加簡單。


      二、配置參數(shù)(options)說明

       

      默認(rèn)參數(shù)設(shè)置代碼:

      // apply default properties
      p = $.extend({
          height: 200,
          //default height
          width: 'auto',
          //auto width
          striped: true,
          //apply odd even stripes
          novstripe: false,
          minwidth: 30,
          //min width of columns
          minheight: 80,
          //min height of columns
          resizable: true,
          //resizable table
          url: false,
          //ajax url
          method: 'POST',
          // data sending method
          dataType: 'xml',
          // type of data loaded
          errormsg: 'Connection Error',
          usepager: false,
          //
          nowrap: true,
          //
          page: 1,
          //current page
          total: 1,
          //total pages
          useRp: true,
          //use the results per page select box
          rp: 15,
          // results per page
          rpOptions: [10, 15, 20, 25, 40],
          title: false,
          pagestat: 'Displaying {from} to {to} of {total} items',
          procmsg: 'Processing, please wait ...',
          query: '',
          qtype: '',
          nomsg: 'No items',
          minColToggle: 1,
          //minimum allowed column to be hidden
          showToggleBtn: true,
          //show or hide column toggle popup
          hideOnSubmit: true,
          autoload: true,
          blockOpacity: 0.5,
          onToggleCol: false,
          onChangeSort: false,
          onSuccess: false,
          onSubmit: false
          // using a custom populate function
      
      },
      p);
       
      參數(shù)說明:
      height: 200, //flexigrid插件的高度,單位為px
      width: 'auto', //寬度值,auto表示根據(jù)每列的寬度自動計算
      striped: true, //是否顯示斑紋效果,默認(rèn)是奇偶交互的形式
      novstripe: false, //沒用過,不知怎么用,還需分析源代碼
      minwidth: 30, //列的最小寬度
      minheight: 80, //列的最小高度
      resizable: true, //是否可伸縮
      url: false, //ajax方式對應(yīng)的url地址
      method: 'POST', // 數(shù)據(jù)發(fā)送方式
      dataType: 'xml', // 數(shù)據(jù)加載的類型
      errormsg: 'Connection Error',//錯誤提示信息
      usepager: false, //是否分頁
      nowrap: true, //是否不換行
      page: 1, //默認(rèn)當(dāng)前頁
      total: 1, //總頁面數(shù)
      useRp: true, //是否可以動態(tài)設(shè)置每頁顯示的結(jié)果數(shù)
      rp: 15, // 每頁默認(rèn)的結(jié)果數(shù)
      rpOptions: [10,15,20,25,40],//可選擇設(shè)定的每頁結(jié)果數(shù)
      title: false, //標(biāo)題設(shè)置
      pagestat: 'Displaying {from} to {to} of {total} items',//顯示分頁狀態(tài)
      procmsg: ‘Processing, please wait …’,//正在處理的提示信息
      query: '',//搜索查詢的條件,提交到服務(wù)器
      qtype: '',//搜索查詢的類別,提交到服務(wù)器
      nomsg: 'No items',//無結(jié)果的提示信息
      minColToggle: 1, //是否允許隱藏列
      showToggleBtn: true, //顯示或隱藏數(shù)據(jù)表格
      hideOnSubmit: true,//隱藏提交
      autoload: true,//自動加載
      blockOpacity: 0.5,//透明度設(shè)置
      onToggleCol: false,//當(dāng)在行之間轉(zhuǎn)換時
      onChangeSort: false,//當(dāng)改變排序時
      onSuccess: false,//成功后執(zhí)行
      onSubmit: false // 觸發(fā)自定義populate的提交事件
       


      三、使用步驟說明

      1、在<head>標(biāo)識里加入引用文件代碼(注意文件存放路徑):

      < link rel = "stylesheet"href = "flexigrid/flexigrid.css"type = "text/css" > </link> 
         <script type="text/javascript " src="jquery / jquery.1.3.2.mini.js "></script> 
         <script type="text / javascript " src="flexigrid / flexigrid.js "></script>" 

         
         添加工具按鈕圖標(biāo)樣式:

      < style type = "text/css" > 
      /* === 增加工具按鈕圖標(biāo)樣式  ====*/
      .flexigrid div.fbutton.add
       {
          padding - left: 20px;
          background: url(images / row_add.gif) no - repeat center left;
      
      }
      
      .flexigrid div.fbutton.edit
       {
          padding - left: 20px;
          background: url(images / row_edit.gif) no - repeat center left;
      
      }
      
      .flexigrid div.fbutton.delete
       {
          padding - left: 20px;
          background: url(images / row_delete.gif) no - repeat center left;
      
      }
      
      .flexigrid div.fbutton.reset
       {
          padding - left: 20px;
          background: url(images / user_reset.gif) no - repeat center left;
      
      }
      
      .flexigrid div.fbutton.excel
       {
          padding - left: 20px;
          background: url(images / excel.gif) no - repeat center left;
      
      }
       < /style>/

       

          為了方便以后使用,上面這段樣式可以加入到flexigrid.css文件中。

      2、在<body>標(biāo)識里加入代碼:

      <table id="grid" style="display:none"></table> 

       

          如果要增加/編輯數(shù)據(jù),還要加入下面這樣的HTML代碼:

       <div id="dialog_div" style='display:none'>
         <form id="dialog_form" name="dialog_form" action="">
           <table width="100%" class="tableinput">
            <tr>
              <td width="30%">操作工號:</td>
              <td width="70%">
                <input name="username" type="text" id="username" />*八位數(shù)字
                <input name="user_id" type="hidden" id="user_id" />
              </td>
            </tr>
            <tr>
              <td>真實姓名:</td>
              <td><input name="name" type="text" id="name" /></td>
            </tr>
            <tr>
              <td>市縣機(jī)構(gòu):</td>
              <td>{{$input.html_sxjg}}</td>
            </tr>
            <tr>
              <td>營業(yè)機(jī)構(gòu):</td>
              <td>{{$input.html_yyjg}}</td>
            </tr>
            <tr>
              <td>分配角色:</td>
              <td>{{$input.html_auth}}</td>
            </tr>
          </table>
         </form>
      </div>
       

       

      3、在<head>標(biāo)識里編寫JavaScript代碼

      代碼示例:

      < script type = "text/javascript" > 
      $(function() {
      
          // 表單中的文本輸入欄綁定 inputtxt 樣式類
          $('#dialog_form input:text').addClass('inputtxt');
      
          $("#grid").flexigrid({
              url: '{{url controller='Ghgl ' action='GetPagerData '}}',
              //url:'index.php?ctl=User&act=GetJsonData',
              dataType: 'json',
              colModel: 
              [
              {
                  display: '序號',
                  name: 'seq',
                  width: 40,
                  sortable: false,
                  align: 'center'
              },
              {
                  display: '#ID',
                  name: 'user_id',
                  width: 40,
                  sortable: true,
                  align: 'left',
                  hide: true
              },
              {
                  display: '操作工號',
                  name: 'username',
                  width: 70,
                  sortable: true,
                  align: 'left'
              },
              {
                  display: '真實姓名',
                  name: 'name',
                  width: 60,
                  sortable: false,
                  align: 'left'
              },
              {
                  display: '分配角色',
                  name: 'role',
                  width: 80,
                  sortable: false,
                  align: 'left'
              },
              {
                  display: '市縣單位',
                  name: 'sxmc',
                  width: 120,
                  sortable: false,
                  align: 'left'
              },
              {
                  display: '營業(yè)機(jī)構(gòu)',
                  name: 'jgmc',
                  width: 120,
                  sortable: true,
                  align: 'left'
              },
              {
                  display: '工號創(chuàng)建時間',
                  name: 'created',
                  width: 110,
                  sortable: false,
                  align: 'left',
                  hide: false
              },
              {
                  display: '密碼更新時間',
                  name: 'pwdupdated',
                  width: 110,
                  sortable: false,
                  align: 'left',
                  hide: false
              }
              ],
              searchitems: 
              [
              {
                  display: '用戶工號',
                  name: 'username'
              },
              {
                  display: '用戶姓名',
                  name: 'name',
                  isdefault: true
              },
              {
                  display: '市縣單位',
                  name: 'sxmc'
              },
              {
                  display: '營業(yè)機(jī)構(gòu)',
                  name: 'jgmc'
              }
              ],
              sortname: "sx_id, jg_id, username",
              sortorder: "DESC",
              title: '<font color="#336699">操作工號維護(hù)</font>',
              usepager: true,
              useRp: true,
              rp: 15,
              showTableToggleBtn: false,
              width: 600,
              height: 400,
              striped: true,
               
              //onSubmit: addFormData,
              pagestat: '當(dāng)前顯示記錄 {from} 到 {to} 條,總 {total} 條',
              procmsg: '正在處理,請稍等 ...',
              nomsg: '找不到符合條件的資料!',
              errormsg: '連接后臺失??!',
              buttons: 
              [
              {
                  name: '添加',
                  bclass: 'add',
                  onpress: opt
              },
              {
                  name: '修改',
                  bclass: 'edit',
                  onpress: opt
              },
              {
                  name: '刪除',
                  bclass: 'delete',
                  onpress: opt
              },
              {
                  separator: true
              },
              {
                  name: '導(dǎo)出EXCEL',
                  bclass: 'excel',
                  onpress: opt
              }
              ]
      
          });
      
          /**
           * 添加/修改對話框
           */
          $('#dialog_div').dialog({
              hide: '',
              //點擊取消后隱藏,如果設(shè)為true,則無法關(guān)閉彈窗。 
              autoOpen: false,
              width: 340,
              //height:230, 
              modal: true,
              //蒙層 
              //title:'單位資料添加/修改', 
              overlay: {
                  opacity: 0.5,
                  background: "black"
      
              },
              buttons: {
                  '關(guān)閉': function() {
                      $(this).dialog("close");
                  },
                  '重置': function() {
                      $(this).children('form')[0].reset();
                  },
                  '提交': function() {
                      addUpdate();
                  }
      
              }
      
          });
      
          /**
           * 點擊工具條按鈕操作
           */
          function opt(com, grid) {
              switch (com) {
                  case '添加':
                  $('.ui-dialog-title').html('<font color="#336699">添加操作工號</font>');
                  $('#dialog_form input[name=user_id]')[0].value = '';
                  $('#dialog_div').dialog('open').children('form')[0].reset();
                  break;
                  case '修改':
                  $('.ui-dialog-title').html('<font color="#336699">修改操作工號</font>');
                  selected_count = $('.trSelected', grid).length;
                  if (selected_count == 0) {
                      JAlert('請選擇一條記錄。', '消息提示');
                      return false;
      
                  }
                  if (selected_count > 1) {
                      jAlert('抱歉每次只能修改一條記錄。', '消息提示');
                      return false;
      
                  }
      
                  // 讀取表格所選行數(shù)據(jù)
                  var data = new Array();
                  $('.trSelected td', grid).each(function(i) {
                      data[i] = $(this).children('div').text();
      
                  });
                  //alert(data);
      
      // 初始化編輯數(shù)據(jù)界面數(shù)據(jù)
                  $('#dialog_form input[name=user_id]')[0].value = data[1];
                  $('#dialog_form input[name=username]')[0].value = data[2];
                  $('#dialog_form input[name=name]')[0].value = data[3];
                  $.ajax({
                      url: '{{url controller='Ghgl ' action='GetUpdData '}}',
                      data: {
                          user_id: data[1]
                      },
                      type: 'POST',
                      dataType: 'json',
                      success: function(data) {
                          //alert($('#jg_id').options);
                          var jg_slt = $('#dialog_form #jg_id option');
                          var jg_len = jg_slt.length;
                          if (jg_len > 0) {
                              setSelected(jg_slt, data.jg_id);
      
                          }
      
                          var auth_radio = $('#dialog_form input:radio');
                          //alert(auth_radio.length);
                          if (auth_radio.length > 0) {
                              setChecked(auth_radio, data.auth);
      
                          }
      
                      }
      
                  });
                  $('#dialog_div').dialog('open');
                  break;
                  case '刪除':
                  selected_count = $('.trSelected', grid).length;
                  if (selected_count == 0) {
                      jAlert('請選擇一條記錄。', '消息提示');
                      return false;
      
                  }
                  if (selected_count > 1) {
                      jAlert('抱歉每次只能刪除一條記錄。', '消息提示');
                      return false;
      
                  }
                  var names = '';
                  $('.trSelected td:nth-child(4) div', grid).each(function(i) {
                      if (i) {
                          names += ',';
      
                      }
                      names += $(this).text();
      
                  });
                  var ids = '';
                  $('.trSelected td:nth-child(2) div', grid).each(function(i) {
                      if (i) {
                          ids += ',';
      
                      }
                      ids += $(this).text();
      
                  })
                  /*
                      if (ids == '') {
                          alert('請選擇刪除記錄,允許同時選擇多條記錄。');
                          return;
                      }*/
                  /*
                      if(confirm("確認(rèn)刪除[" + names + "]的用戶工號嗎?")){ 
                          del(ids); 
                      }*/
                  jConfirm("確認(rèn)刪除[<font color='#FF0000'>" + names + "</font>]的用戶工號嗎?", '刪除確認(rèn)', 
                  function(btn) {
                      if (btn) {
                          del(ids);
                      }
      
                  });
                  break;
                  case '導(dǎo)出EXCEL':
                  document.location.href = "{{url controller='Ghgl' action='Export'}}";
                  break;
      
              }
      
          }
      
          /**
           * 添加記錄
           */
          function addUpdate() {
              $('#dialog_form').ajaxSubmit({
                  //$('#dialog_form').ajaxform({
                  url: "{{url controller='Ghgl' action='Save'}}",
                  type: 'POST',
                  dataType: 'json',
                  resetForm: true,
                  success: function(data) {
                      if (data.success) {
                          $('#grid').flexReload();
                          $('#dialog_div').dialog('close');
      
                      } else {
                          jAlert(data.msg, '消息提示');
                          return false;
      
                      }
      
                  },
                  error: function() {}
      
              });
      
          };
      
          /**
           * 刪除記錄
           */
          function del(ids) {
              $.ajax({
                  url: "{{url controller='Ghgl' action='Del'}}",
                  data: {
                      ids: ids
                  },
                  type: 'POST',
                  dataType: 'json',
                  success: function(data) {
                      if (data.success) {
                          $('#grid').flexReload();
      
                      } else {
                          jAlert(data.msg, '消息提示');
                          return false;
      
                      }
      
                  }
      
              });
      
          };
      
          /**
           * 重置密碼
           */
          function reset(id) {
              $.ajax({
                  url: "{{url controller='Ghgl' action='Reset'}}",
                  data: {
                      user_id: id
                  },
                  type: 'POST',
                  dataType: 'json',
                  success: function(data) {
                      if (data.success) {
                          jAlert(data.msg, '消息提示');
                          return;
      
                      } else {
                          jAlert(data.msg, '錯誤提示');
                          return false;
      
                      }
      
                  },
                  error: function() {}
      
              });
      
          };
      
          // 根據(jù) value 初始化下拉列表框
          function setSelected(slt, value) {
              for (var i = 0; i < slt.length; i++) {
                  if (slt[i].value == value) {
                      slt[i].selected = true;
      
                  } else {
                      slt[i].selected = false;
      
                  }
      
              }
      
          };
      
          // 根據(jù) value 初始化單選按鈕
          function setChecked(slt, value) {
              for (var i = 0; i < slt.length; i++) {
                  if (slt[i].value == value) {
                      slt[i].checked = true;
      
                  } else {
                      slt[i].checked = false;
      
                  }
      
              }
      
          };
      
      });
       < /script>/

       

      其中代碼段:

      // 讀取表格所選行數(shù)據(jù)
      var data = new Array();
      $('.trSelected td', grid).each(function(i) {
        data[i] = $(this).children('div').text();
      });
      //alert(data);
      

       為讀取表格所選行數(shù)據(jù),通過$('.trSelected td', grid)來讀取。

      var ids = '';  
      $('.trSelected td:nth-child(2) div',grid).each(function(i){  
        if(i){
              ids += ',';
        }
            ids += $(this).text();  
      })

       為讀取所選行單元格數(shù)據(jù)代碼,通過:$('.trSelected td:nth-child(2) div',grid)來讀取,如果允許多選,讀取回來的是一個數(shù)組值。注意:td:nth-child(2)的意思為所選行的第二個單元格,因為:nth-child(index)的索引值從1起。

       

      FlexiGrid.options參數(shù)介紹:

      1、colModel:列定義數(shù)組,用來設(shè)置數(shù)據(jù)網(wǎng)格的表頭及數(shù)據(jù)顯示格式。

      參數(shù)說明:
      display:設(shè)置列表頭名稱,必須設(shè)置,類型:string,默認(rèn)值:無。
      name:字段名稱,必須設(shè)置,類型:string,默認(rèn)值: 無。注意:如果dataType參數(shù)設(shè)置為json(dataType: 'json'),則name值必須與返回的元素名對應(yīng)。
      width:設(shè)置列寬度,必須設(shè)置,類型:數(shù)值(單位為像素px),默認(rèn)值:無。
      sortable:是否可排序,類型:boolen,默認(rèn)值:false,不排序。
      process:處理程序,類型:
      function,可格式化單元格。
      hide:設(shè)置列是否隱藏,類型:boolen,默認(rèn)值:false
      align:設(shè)置列數(shù)據(jù)對齊方式,有三個參數(shù):left、center、right。


          代碼示例:

      colModel: 
      [
      {
          display: '序號',
          name: 'seq',
          width: 40,
          sortable: false,
          align: 'center'
      },
      {
          display: '#ID',
          name: 'user_id',
          width: 40,
          sortable: true,
          align: 'left',
          hide: true
      },
      {
          display: '操作工號',
          name: 'username',
          width: 70,
          sortable: true,
          align: 'left'
      },
      {
          display: '真實姓名',
          name: 'name',
          width: 60,
          sortable: false,
          align: 'left'
      },
      {
          display: '分配角色',
          name: 'role',
          width: 80,
          sortable: false,
          align: 'left'
      },
      {
          display: '市縣單位',
          name: 'sxmc',
          width: 120,
          sortable: false,
          align: 'left'
      },
      {
          display: '營業(yè)機(jī)構(gòu)',
          name: 'jgmc',
          width: 120,
          sortable: true,
          align: 'left'
      },
      {
          display: '工號創(chuàng)建時間',
          name: 'created',
          width: 110,
          sortable: false,
          align: 'left',
          hide: false
      },
      {
          display: '密碼更新時間',
          name: 'pwdupdated',
          width: 110,
          sortable: false,
          align: 'left',
          hide: false
      }
      ],
      


      2、buttons:工具欄Button定義數(shù)組,用來設(shè)置數(shù)據(jù)網(wǎng)格的工具條按鈕。

      參數(shù)說明:
      name:Botton的標(biāo)識,類型:string, 默認(rèn)值:無
      bclass :樣式, 類型:boolen,默認(rèn)值:無
      onpress :當(dāng)button被點擊時觸發(fā)的事件接受button的name為第一個參數(shù),Grid為第二個參數(shù)的一個function
      separator :是否顯示分隔符

       

          代碼示例:

      buttons: 
      [
      {
          name: '添加',
          bclass: 'add',
          onpress: opt
      },
      {
          name: '修改',
          bclass: 'edit',
          onpress: opt
      },
      {
          name: '刪除',
          bclass: 'delete',
          onpress: opt
      },
      {
          separator: true
      },
      {
          name: '導(dǎo)出EXCEL',
          bclass: 'excel',
          onpress: opt
      }
      ]


          其中:
         
          name:設(shè)置按鈕文字
          separator:設(shè)置是否顯示分隔線
          bclass:設(shè)置按鈕樣式,示例:

      < style > 
      .flexigrid div.fbutton.add
       {
          background: url(.. / lib / jquery / flexigrid / css / images / row_add.gif) no - repeat center left;
      
      }
      
      .flexigrid div.fbutton.edit
       {
          background: url(.. / lib / jquery / flexigrid / css / images / row_edit.gif) no - repeat center left;
      
      }
      
      .flexigrid div.fbutton.delete
       {
          background: url(.. / lib / jquery / flexigrid / css / images / row_delete.gif) no - repeat center left;
      
      }
      
      .flexigrid div.fbutton.reset
       {
          background: url(.. / images / user_reset.gif) no - repeat center left;
      
      }
      
      .flexigrid div.fbutton.excel
       {
          background: url(.. / images / excel.gif) no - repeat center left;
      
      }
       < /style>

       

          onpress:點擊按鈕時觸發(fā)的事件,接受button的name為第一個參數(shù),grid為第二個參數(shù)的一個function。

          示例代碼:

      /**
           * 點擊工具條按鈕操作
           */
      function opt(com, grid) {
          switch (com) {
              case '添加':
              ...
              break;
              case '修改':
              ...
              break;
              case '刪除':
              ...
              break;
              case '導(dǎo)出EXCEL':
              ...
              break;
      
          }
      
      }
       


      3、后臺PHP代碼(json):

      摘自FlexiGrid最新版的示例代碼:

      function runSQL($rsql) {
      
          $connect = mysql_connect($hostname,$username,$password) or die ("Error: could not connect to database");
          $db = mysql_select_db($dbname);
      
          $result = mysql_query($rsql) or die ('test');
          return $result;
          mysql_close($connect);
      }
      
      function countRec($fname,$tname) {
          $sql = "SELECT count($fname) FROM $tname ";
          $result = runSQL($sql);
          while ($row = mysql_fetch_array($result)) {
          return $row[0];
          }
      }
      
      $page = $_POST['page'];
      $rp = $_POST['rp'];
      $sortname = $_POST['sortname'];
      $sortorder = $_POST['sortorder'];
      
      if (!$sortname) $sortname = 'name';
      if (!$sortorder) $sortorder = 'desc';
      
      $sort = "ORDER BY $sortname $sortorder";
      
      if (!$page) $page = 1;
      if (!$rp) $rp = 10;
      
      $start = (($page-1) * $rp);
      
      $limit = "LIMIT $start, $rp";
      
      $sql = "SELECT iso,name,printable_name,iso3,numcode FROM country $sort $limit";
      $result = runSQL($sql);
      
      $total = countRec('iso','country');
      
      // 生成json格式數(shù)據(jù)
      header("Expires: Mon, 26 Jul 1997 05:00:00 GMT" );
      header("Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . "GMT" );
      header("Cache-Control: no-cache, must-revalidate" );
      header("Pragma: no-cache" );
      header("Content-type: text/x-json");
      $json = "";
      $json .= "{\n";
      $json .= "page: $page,\n";
      $json .= "total: $total,\n";
      $json .= "rows: [";
      $rc = false;
      while ($row = mysql_fetch_array($result)) {
          if ($rc) $json .= ",";
          $json .= "\n{";
          $json .= "id:'".$row['iso']."',";
          $json .= "cell:['".$row['iso']."'";
          $json .= ",'".addslashes($row['name'])."'";
          $json .= ",'".addslashes($row['printable_name'])."'";
          $json .= ",'".addslashes($row['iso3'])."'";
          $json .= ",'".addslashes($row['numcode'])."']";
          $json .= "}";
          $rc = true;
      }
      $json .= "]\n";
      $json .= "}";
      echo $json;

       

      本人的后臺后代碼:

      /**
           * 返回JSON分頁數(shù)據(jù)到前臺
           *
           */
          function actionGetPagerData()
          {
              $user = $this->user;
      
              $page = ($_POST['page']) ? $_POST['page'] : 1;
              $limit = ($_POST['rp'])?$_POST['rp'] : 15;
              $sortname = ($_POST['sortname']) ? $_POST['sortname'] : 'username';
              $sortorder = ($_POST['sortorder']) ? $_POST['sortorder'] : 'DESC';
      
              $sort = "$sortname $sortorder";
              $offset = ($page - 1) * $limit;
      
              $query = ($_POST['query']) ? trim($_POST['query']) : '';
              $qtype = ($_POST['qtype']) ? trim($_POST['qtype']) : '';
              if ($qtype == 'name' || $qtype == 'sxmc') {
                  $query = mb_convert_encoding($query, 'GB2312', 'utf-8');
              }
      
              if ($user['RBAC_ROLES'][0] == 'SYSTEM_ADMIN') {
                  $conditions = array(
                      array('auth', 1, '=', 'OR'),
                      array('auth', 2, '='),
                  );
              } elseif ($user['RBAC_ROLES'][0] == 'POWER_USER') {
                  $conditions = array(
                      array('sx_id', $user['SXID'], '=', 'AND'),
                      array('auth', 3, '=', 'OR'),
                      array('sx_id', $user['SXID'], '=', 'AND'),
                      array('auth', 4, '='),
                  );
              }
      
              if ($query  && $user['RBAC_ROLES'][0] == 'POWER_USER') {
                  $conditions = array(
                      array('sx_id', $user['SXID'], '=', 'AND'),
                      array($qtype, $query, '=')
                  );
              }
              if ($qtype == 'name' && $query != ''  && $user['RBAC_ROLES'][0] == 'POWER_USER') {
                  $conditions = array(
                      array('sx_id', $user['SXID'], '=', 'AND'),
                      array($qtype, '%' . $query . '%', 'LIKE')
                  );
              }
              if ($qtype == 'sxmc' && $query != '' && $user['RBAC_ROLES'][0] == 'SYSTEM_ADMIN') {
                  $cxtj = array(
                      array('sxmc', '%' . $query . '%', 'LIKE')
                  );
                  $sxjg = & FLEA::getSingleton('Table_Sxjg');
                  $row = $sxjg->find($cxtj);
      
                  $conditions = array(
                      array('sx_id', $row['SXID'], '=', 'AND'),
                      array('auth', 1, '=', 'OR'),
                      array('sx_id', $row['SXID'], '=', 'AND'),
                      array('auth', 2, '='),
                  );
              }
              if ($qtype == 'jgmc' && $query != '' && $user['RBAC_ROLES'][0] == 'POWER_USER') {
                  $cxtj = array(
                      array('sx_id', $this->user['SXID'], '=', 'AND'),
                      array('jgmc', '%' . $query . '%', 'LIKE')
                  );
                  $tblYyjg = & FLEA::getSingleton('Table_Yyjg');
                  $row = $tblYyjg->find($cxtj);
                  $conditions = array(
                      array('sx_id', $this->user['SXID'], '=', 'AND'),
                      array('jg_id', $row['jg_id'], '=')
                  );
              }
      
              //$conditions = null;
              $this->_tblUsers->enableLinks();
              $rows = $this->_tblUsers->findAll($conditions, $sort, array($limit, $offset));
              $rs = $this->_tblUsers->findAll($conditions);
              $total = count($rs);
              $json = "";
              $json .= "{\n";
              $json .= "page: $page,\n";
              $json .= "total: $total,\n";
              $json .= "rows: [";
              $rc = false;
              $i = 1;
              foreach ($rows as $row) {
                  if ($rc) $json .= ",";
                  $json .= "\n{";
                  $json .= "user_id:'".$row['user_id']."',";
                  $json .= "cell:['".$i."'";
                  $json .= ",'".$row['user_id']."'";
                  $json .= ",'".$row['username']."'";
                  $json .= ",'".$row['name']."'";
                  $json .= ",'".$row['roles'][0]['rolename_cn']."'";
                  $json .= ",'".$row['sxjg']['sxmc']."'";
                  $json .= ",'".addslashes($row['yyjg']['jgmc'])."'";
                  $json .= ",'".$row['created']."'";
                  //$json .= ",'".$row['updated']."']";
                  $json .= ",'".$row['pwdupdated']."']";
                  $json .= "}";
                  $rc = true;
                  $i++;
              }
              $json .= "]\n";
              $json .= "}";
              echo $json;
              exit;
          }


      四、功能優(yōu)化擴(kuò)展版說明

      功能優(yōu)化擴(kuò)展版的改變:

      1、修改了仿ext的皮膚,界面更加漂亮;
      2、優(yōu)化了渲染表格代碼,速度提高了60%;
      3、增加了顯示checkbox列功能;
      4、為方便處理行數(shù)據(jù),增加了行數(shù)據(jù)綁定功能。

      options新增參數(shù):

      qop: "Eq", //搜索的操作符
      showcheckbox: false, //是否在列首添加checkbox
      rowhandler: false, //在生成行時綁定事件,如雙擊,右鍵等
      rowbinddata: false, // 是否在行上綁定數(shù)據(jù)
      extParam: {}, // 擴(kuò)展外部參數(shù)動態(tài)注冊到grid,實現(xiàn)如自定義查詢等操作
      onrowchecked: false, // checkbox選中狀態(tài)發(fā)生變化時觸發(fā)的事件
      gridClass: "bbit-grid" //綁定樣式

       

      buttons新增參數(shù):

      btnText: 設(shè)置工具按鈕附加文本,原來的為displayname,我這里改成了btnText。

      示例:

      buttons:
      [
          {name: 'Add', btnText: "新增", bclass: 'add', onpress: function(Add, grid){alert('這是新增操作。');return false;}},
          {name: 'Edit', btnText: "修改", bclass: 'edit', onpress: ''},
          {name: 'Delete', btnText: "刪除", bclass: 'delete', onpress: ''},
          {separator: true},
          {name: 'Export', btnText: "導(dǎo)出Excel", bclass: 'excel', onpress: ''}
      ]

       

      新增方法1:

      var ids = $("#grid").getCheckedRows(); 可以獲取到選中行的主鍵值,里面保存的是記錄的ID數(shù)組。

       

      *注意:

      該方法需要十分注意JSON分頁格式數(shù)據(jù),舉例說明:

       ...
       $json .= "\n{";  
       $json .= "user_id:'".$row['user_id']."',";  
       $json .= "cell:['".$i."'";  
       $json .= ",'".$row['user_id']."'";
       ...
      
       

      其中的:

      $json .= "user_id:'".$row['user_id']."',";  
       

      里面的主鍵名必須統(tǒng)一使用id,即為:

      $json .= "id:'".$row['user_id']."',";  

       getCheckedRows()才能正確獲取數(shù)據(jù)。

       

      新增方法2:

      var rows = $("#grid).getSelectedRows(); // 獲取表格行數(shù)據(jù)

       
      *注意,該方法需要將 rowbinddata 參數(shù)設(shè)為 true,而且返回的數(shù)據(jù)為二維數(shù)組。

       

      同時,為了保證該方法在IE、FF下都能使用正常,需要修改FlexiGrid.js代碼。

      打開FlexiGrid.js文件,找到代碼行:


      items.push($(this).attr("ch").split('_FG$SP_'));
       

      將其修改為:

      items.push($(this).attr("CH").split('_FG$SP_'));
       


      功能實現(xiàn)示例:

      1、查詢的布局可自行設(shè)置,完了調(diào)用方法刷新grid即可,類似如下所示:

      var p = { extParam: [
          { name: "stuName", value: $("#selectinput").val() },
          { name: "stuId", value: $("#selectStuId").val() },
          { name: "stuNo", value: $("#selectNo").val() },
          { name: "stuGrade", value: $("#selectGrade").val() },
          { name: "SID", value: $("#sugvalue").val() },
          { name: "Sname", value: $("#sugname").val() },
          { name: "Sgust", value: $("#suggust").val() }
          ]
      };
      $("#grid").flexOptions(p).flexReload();
       

      2、grid中有一些記錄是已經(jīng)選中的,我怎樣讓它們從數(shù)據(jù)庫中查出來時前面的checkbox設(shè)置成選中?

      首先把是否選中的值作為列表中的列和其他數(shù)據(jù)一起查詢回來一次,
      然后再在Flexigrid中的 rowhandler參數(shù)定義一個函數(shù),如下所示:

      rowhandler: InitGridCheck,
       

      函數(shù)實現(xiàn):

      function InitGridCheck(tr) {
          var ch = $.browser.msie ? tr.ch : target.getAttribute("ch");
          var cell = ch.split("_FG$SP_");
          if(cell[7] != 1){return;}
          var chkb = $(tr).find(":checkbox");
          if (chkb.length>0) {
              chkb[0].checked = true;
              chkb[0].defaultChecked = true;
              $(tr).addClass('trSelected');
          }
      }

       

      除錯:

       

      由于xuanye的修改版代碼在取消顯示checkbox列(showcheckbox: false)時,存在無法單擊表格行時無法選定記錄行的bug,因為如果不能選定記錄行,則無法進(jìn)行編輯、刪除等操作。

      打開jquery.flexigrid.js文件,找到735行,加入單擊表格行事件代碼:

      $('tbody tr', g.bDiv).each(
      function() {
          // 增加單擊行時的處理代碼(modified by hegz 2009/03/29)
          $(this)
          .click(
          function(e)
          {
              var obj = (e.target || e.srcElement);
              if (obj.href || obj.type) return true;
              if ($(this).hasClass('trSelected')) {
                  $(this).removeClass('trSelected');
                  if (p.showcheckbox)
                  $("input.itemchk", this)[0].checked = false;
      
              } else {
                  $(this).addClass('trSelected');
                  if (p.showcheckbox)
                  $("input.itemchk", this)[0].checked = true;
      
              }
              if (p.onrowchecked) p.onrowchecked.call(this);
              if (p.singleSelect) $(this).siblings().removeClass('trSelected');
      
          }
          );
          // modified end
          ...

       

      其實,原版代碼是有這樣的代碼的,但xuanye修改后取消了。

      原版FlexiGrid代碼:

      addRowProp: function() {
          $('tbody tr', g.bDiv).each(function() {
              $(this).click(function(e) {
                  var obj = (e.target || e.srcElement);
                  if (obj.href || obj.type) return true;
                  $(this).toggleClass('trSelected');
                  if (p.singleSelect) $(this).siblings().removeClass('trSelected')
              }).mousedown(function(e) {
                  if (e.shiftKey) {
                      $(this).toggleClass('trSelected');
                      g.multisel = true;
                      this.focus();
                      $(g.gDiv).noSelect()
                  }
              }).mouseup(function() {
                  if (g.multisel) {
                      g.multisel = false;
                      $(g.gDiv).noSelect(false)
                  }
              }).hover(function(e) {
                  if (g.multisel) {
                      $(this).toggleClass('trSelected')
                  }
              },
              function() {});
              if ($.browser.msie && $.browser.version < 7.0) {
                  $(this).hover(function() {
                      $(this).addClass('trOver')
                  },
                  function() {
                      $(this).removeClass('trOver')
                  })
              }
          })
      },
      

      (今天,通過與xuanye兄交流,這個不是bug,只是通過右鍵菜單來支持,現(xiàn)在的最新代碼已支持該功能,我有可能白忙活了,哈哈。)

       

       

      五、jQuery 1.4.2支持測試

       

      jQuery 1.4.2推出后,由于效率比jQuery 1.3.2高很多,因此我們的項目開發(fā)需要逐漸過渡到j(luò)Query 1.4.2,以改善項目的整體運(yùn)行效率。懷著這樣的目的,這兩天來我抽時間對FlexiGrid在jQuery 1.4.2下的運(yùn)行做了簡單的測試。發(fā)現(xiàn)舊版本在jQuery 1.4.2也能正常運(yùn)行,但由于jQuery 1.4.2對JSON數(shù)據(jù)格式有嚴(yán)格的限制,名值對必須加雙引號括起來,否則將發(fā)生JSON數(shù)據(jù)解析錯誤。如下圖所示:

       當(dāng)然了,如果想彈出上面的警告框,需要稍微修改下Flexigrid的js代碼。

       

      打開Flexigrid的源代碼,找到populate()方法,將其中的Ajax error回調(diào)函數(shù)修改為:

      error:function (data, textStatus, errorThrown) {
                              alert(textStatus);
                          }

      即可。不過,測試完后要記得將源代碼恢復(fù)原狀就行。

       

       

      六、結(jié)束語

       

      Paulo P. Marinas 的目標(biāo)是致力打造功能完善、簡單易用的輕量級grid。他確保將來增加新的功能后,代碼經(jīng)過壓縮,大小不超過20K,這確實令人贊賞。但其一直以來計劃增加的Editable功能始終無法實現(xiàn),就令我等有點失望了,或者xuanye等大蝦在不久的將來會去擴(kuò)充實現(xiàn)這一功能也未可知。


      七、參考資料

      1、官方網(wǎng)站(http://www./ )。
      2、基于jQuery的GridView-Flexigrid(2)-擴(kuò)展和修復(fù)(http://www.cnblogs.com/xuanye/archive/2009/11/08/Xuanye_jQuery_FlexiGrid_Demo.html )
      3、基于jQuery的GridView-FlexiGrid的使用和改造(1)--如何使用,完全參數(shù)說明(http://www.cnblogs.com/xuanye/archive/2009/11/04/Xuanye_jQuery_FlexiGrid.html )

       

       

      1 樓 siweilinux 2010-04-27  
      請問版主如何從flexigrid導(dǎo)出excel呢。
      2 樓 hegz 2010-04-29  
      這個較簡單。

      步驟如下:

      1、用2003版以上的EXCEL創(chuàng)建好模板文件,文件保存為“XML表格”。
      模板格式如下所示:
      <?xml version="1.0" encoding="gb2312"?>
      <?mso-application progid="Excel.Sheet"?>
      <Workbook xmlns="urn:schemas-microsoft-com:office:spreadsheet"
       xmlns:o="urn:schemas-microsoft-com:office:office"
       xmlns:x="urn:schemas-microsoft-com:office:excel"
       xmlns:ss="urn:schemas-microsoft-com:office:spreadsheet"
       xmlns:html="http://www./TR/REC-html40">
       <DocumentProperties xmlns="urn:schemas-microsoft-com:office:office">
        <Author>USER</Author>
        <LastAuthor>tech1</LastAuthor>
        <LastPrinted>2009-08-13T09:35:20Z</LastPrinted>
        <Created>2009-04-21T07:03:50Z</Created>
        <LastSaved>2009-08-13T09:36:41Z</LastSaved>
        <Company>CHINA</Company>
        <Version>11.9999</Version>
       </DocumentProperties>
       <ExcelWorkbook xmlns="urn:schemas-microsoft-com:office:excel">
        <WindowHeight>8100</WindowHeight>
        <WindowWidth>13524</WindowWidth>
        <WindowTopX>288</WindowTopX>
        <WindowTopY>108</WindowTopY>
        <ProtectStructure>False</ProtectStructure>
        <ProtectWindows>False</ProtectWindows>
       </ExcelWorkbook>
       <Styles>
        <Style ss:ID="Default" ss:Name="Normal">
         <Alignment ss:Vertical="Center"/>
         <Borders/>
         <Font ss:FontName="宋體" x:CharSet="134" ss:Size="12"/>
         <Interior/>
         <NumberFormat/>
         <Protection/>
        </Style>
        <Style ss:ID="s21">
         <Alignment ss:Horizontal="Center" ss:Vertical="Center"/>
         <Borders>
          <Border ss:Position="Bottom" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Left" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Right" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Top" ss:LineStyle="Continuous" ss:Weight="1"/>
         </Borders>
         <Font ss:FontName="楷體_GB2312" x:CharSet="134" x:Family="Modern" ss:Size="12"/>
         <Interior ss:Color="#CCFFFF" ss:Pattern="Solid"/>
        </Style>
        <Style ss:ID="s22">
         <Alignment ss:Vertical="Center"/>
         <Borders>
          <Border ss:Position="Bottom" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Left" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Right" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Top" ss:LineStyle="Continuous" ss:Weight="1"/>
         </Borders>
        </Style>
        <Style ss:ID="s23">
         <Alignment ss:Horizontal="Center" ss:Vertical="Center"/>
         <Borders>
          <Border ss:Position="Bottom" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Left" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Right" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Top" ss:LineStyle="Continuous" ss:Weight="1"/>
         </Borders>
        </Style>
        <Style ss:ID="s24">
         <Alignment ss:Horizontal="Left" ss:Vertical="Center"/>
         <Borders>
          <Border ss:Position="Bottom" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Left" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Right" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Top" ss:LineStyle="Continuous" ss:Weight="1"/>
         </Borders>
        </Style>
        <Style ss:ID="s27">
         <Alignment ss:Horizontal="Center" ss:Vertical="Center"/>
         <Borders>
          <Border ss:Position="Bottom" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Left" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Right" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Top" ss:LineStyle="Continuous" ss:Weight="1"/>
         </Borders>
         <Font ss:FontName="楷體_GB2312" x:CharSet="134" x:Family="Modern" ss:Size="12"/>
         <Interior ss:Color="#CCFFFF" ss:Pattern="Solid"/>
         <NumberFormat ss:Format="@"/>
        </Style>
        <Style ss:ID="s28">
         <Alignment ss:Horizontal="Center" ss:Vertical="Center"/>
         <Borders>
          <Border ss:Position="Bottom" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Left" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Right" ss:LineStyle="Continuous" ss:Weight="1"/>
          <Border ss:Position="Top" ss:LineStyle="Continuous" ss:Weight="1"/>
         </Borders>
         <NumberFormat ss:Format="@"/>
        </Style>
        <Style ss:ID="s29">
         <NumberFormat ss:Format="@"/>
        </Style>
        <Style ss:ID="s32">
         <Alignment ss:Horizontal="Left" ss:Vertical="Center"/>
         <Borders>
          <Border ss:Position="Bottom" ss:LineStyle="Continuous" ss:Weight="1"/>
         </Borders>
         <Font ss:FontName="楷體_GB2312" x:CharSet="134" x:Family="Modern" ss:Size="14"/>
        </Style>
        <Style ss:ID="s34">
         <Alignment ss:Horizontal="Center" ss:Vertical="Center"/>
         <Font ss:FontName="楷體_GB2312" x:CharSet="134" x:Family="Modern" ss:Size="18"
          ss:Bold="1"/>
        </Style>
       </Styles>
       <Worksheet ss:Name="Sheet1">
        <Table ss:ExpandedColumnCount="7" ss:ExpandedRowCount="200" x:FullColumns="1"
         x:FullRows="1" ss:DefaultColumnWidth="52.8" ss:DefaultRowHeight="15.45">
         <Column ss:Width="32.4"/>
         <Column ss:StyleID="s29" ss:Width="75.600000000000009"/>
         <Column ss:AutoFitWidth="0" ss:Width="56.4"/>
         <Column ss:Width="95.399999999999991"/>
         <Column ss:AutoFitWidth="0" ss:Width="68.399999999999991"/>
         <Column ss:AutoFitWidth="0" ss:Width="69.6"/>
         <Column ss:Width="82.199999999999989"/>
         <Row ss:AutoFitHeight="0" ss:Height="26.55">
          <Cell ss:MergeAcross="6" ss:StyleID="s34"><Data ss:Type="String">代收交通違法罰款系統(tǒng)操作工號分配表</Data></Cell>
         </Row>
         <Row ss:AutoFitHeight="0" ss:Height="26.55">
          <Cell ss:MergeAcross="6" ss:StyleID="s32"><Data ss:Type="String">導(dǎo)出日期:{{$exportdate}}</Data></Cell>
         </Row>
         <Row ss:AutoFitHeight="0">
          <Cell ss:StyleID="s21"><Data ss:Type="String">序號</Data></Cell>
          <Cell ss:StyleID="s27"><Data ss:Type="String">用戶工號</Data></Cell>
          <Cell ss:StyleID="s21"><Data ss:Type="String">用戶姓名</Data></Cell>
          <Cell ss:StyleID="s21"><Data ss:Type="String">所屬機(jī)構(gòu)</Data></Cell>
          <Cell ss:StyleID="s21"><Data ss:Type="String">分配角色</Data></Cell>
          <Cell ss:StyleID="s21"><Data ss:Type="String">創(chuàng)建日期</Data></Cell>
          <Cell ss:StyleID="s21"><Data ss:Type="String">密碼修改日期</Data></Cell>
         </Row>
      {{section name=i loop=$lists}}
         <Row ss:AutoFitHeight="0">
          <Cell ss:StyleID="s22"><Data ss:Type="Number">{{$lists[i].seq}}</Data></Cell>
          <Cell ss:StyleID="s28"><Data ss:Type="Number">{{$lists[i].username}}</Data></Cell>
          <Cell ss:StyleID="s24"><Data ss:Type="String">{{$lists[i].name}}</Data></Cell>
          <Cell ss:StyleID="s24"><Data ss:Type="String">{{$lists[i].jggl.name}}</Data></Cell>
          <Cell ss:StyleID="s24"><Data ss:Type="String">{{$lists[i].roles.0.rolename_cn}}</Data></Cell>
          <Cell ss:StyleID="s23"><Data ss:Type="String">{{$lists[i].cdate}}</Data></Cell>
          <Cell ss:StyleID="s23"><Data ss:Type="String">{{$lists[i].pdate}}</Data></Cell>
         </Row>
      {{/section}}
        </Table>
        <WorksheetOptions xmlns="urn:schemas-microsoft-com:office:excel">
         <PageSetup>
          <Header x:Margin="0.51181102362204722"/>
          <Footer x:Margin="0.51181102362204722"/>
          <PageMargins x:Bottom="0.98425196850393704" x:Left="0.74803149606299213"
           x:Right="0" x:Top="0.98425196850393704"/>
         </PageSetup>
         <Unsynced/>
         <Print>
          <ValidPrinterInfo/>
          <PaperSizeIndex>9</PaperSizeIndex>
          <VerticalResolution>0</VerticalResolution>
         </Print>
         <Selected/>
         <Panes>
          <Pane>
           <Number>3</Number>
           <ActiveRow>7</ActiveRow>
           <ActiveCol>3</ActiveCol>
          </Pane>
         </Panes>
         <ProtectObjects>False</ProtectObjects>
         <ProtectScenarios>False</ProtectScenarios>
        </WorksheetOptions>
       </Worksheet>
       <Worksheet ss:Name="Sheet2">
        <Table ss:ExpandedColumnCount="0" ss:ExpandedRowCount="0" x:FullColumns="1"
         x:FullRows="1" ss:DefaultColumnWidth="52.8" ss:DefaultRowHeight="15.45"/>
        <WorksheetOptions xmlns="urn:schemas-microsoft-com:office:excel">
         <Unsynced/>
         <ProtectObjects>False</ProtectObjects>
         <ProtectScenarios>False</ProtectScenarios>
        </WorksheetOptions>
       </Worksheet>
       <Worksheet ss:Name="Sheet3">
        <Table ss:ExpandedColumnCount="0" ss:ExpandedRowCount="0" x:FullColumns="1"
         x:FullRows="1" ss:DefaultColumnWidth="52.8" ss:DefaultRowHeight="15.45"/>
        <WorksheetOptions xmlns="urn:schemas-microsoft-com:office:excel">
         <Unsynced/>
         <ProtectObjects>False</ProtectObjects>
         <ProtectScenarios>False</ProtectScenarios>
        </WorksheetOptions>
       </Worksheet>
      </Workbook>
      

      *注意其中的代碼段,是通過后臺PHP代碼及Smarty引擎動態(tài)批量替換。
      {{section name=i loop=$lists}}
         <Row ss:AutoFitHeight="0">
          <Cell ss:StyleID="s22"><Data ss:Type="Number">{{$lists[i].seq}}</Data></Cell>
          <Cell ss:StyleID="s28"><Data ss:Type="Number">{{$lists[i].username}}</Data></Cell>
          <Cell ss:StyleID="s24"><Data ss:Type="String">{{$lists[i].name}}</Data></Cell>
          <Cell ss:StyleID="s24"><Data ss:Type="String">{{$lists[i].jggl.name}}</Data></Cell>
          <Cell ss:StyleID="s24"><Data ss:Type="String">{{$lists[i].roles.0.rolename_cn}}</Data></Cell>
          <Cell ss:StyleID="s23"><Data ss:Type="String">{{$lists[i].cdate}}</Data></Cell>
          <Cell ss:StyleID="s23"><Data ss:Type="String">{{$lists[i].pdate}}</Data></Cell>
         </Row>
      {{/section}}
      


      2、編寫后臺生成報表的代碼,由Smarty動態(tài)生成報表。如下所示:
      	/**
      	 * 導(dǎo)出EXCEL
      	 *
      	 */
      	function actionExport()
      	{
      		$user = $this->user;
      		$sort = '`jg_id`, `username` ASC';
      		
      		$this->_tblUsers->enableLinks();
      		$rows = $this->_tblUsers->findAll(null, $sort);
      		//dump($rows);
      		$i = 0;
      		foreach ($rows as $row) {
      			$rows[$i]['seq'] = $i + 1;
      			$rows[$i]['cdate'] = date('Y.m.d', strtotime($row['created']));
      			$rows[$i]['pdate'] = $row['pwdupdated'] == '0000-00-00 00:00:00' ? '' : date('Y.m.d', strtotime($row['pwdupdated']));
      			$i++;
      		}
      		
      		$this->tpl->assign('exportdate', date('Y年m月d日'));
      		$this->tpl->assign('lists', $rows);
      		
      		$this->excelHeaderSend('用戶操作工號分配表.xml');
      		$this->display('ghgl.xml', false);
      	}
      

      *說明:上面的代碼在FleaPHP下使用,如果不是在FleaPHP下使用,使用其它方式讀取MySQL數(shù)據(jù)即可。
      3 樓 siweilinux 2010-05-04  
      謝謝回復(fù),可是我用的是jsp,請問如何導(dǎo)出excel呢?
      4 樓 hegz 2010-05-04  
      siweilinux 寫道
      謝謝回復(fù),可是我用的是jsp,請問如何導(dǎo)出excel呢?

      對不起,我沒有研究過利用jsp來導(dǎo)出EXCEL。
      5 樓 hejh 2010-09-04  
      請教1個問題,
      在彈出的dialog窗里,通過dialog里的button再做一個彈出dialog窗,怎么實現(xiàn)?它們之間如何傳遞值?
      6 樓 java_MagicWang 2012-06-05  
      求導(dǎo)出Excel源碼,QQ416263135
      7 樓 java_MagicWang 2012-06-05  
      java端
      8 樓 pangxin12345 2012-07-05  
      請問大師  如何使用 extParam

        本站是提供個人知識管理的網(wǎng)絡(luò)存儲空間,所有內(nèi)容均由用戶發(fā)布,不代表本站觀點。請注意甄別內(nèi)容中的聯(lián)系方式、誘導(dǎo)購買等信息,謹(jǐn)防詐騙。如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點擊一鍵舉報。
        轉(zhuǎn)藏 分享 獻(xiàn)花(0

        0條評論

        發(fā)表

        請遵守用戶 評論公約

        類似文章 更多