Column Width of easyui DataGrid

Last Update: 2012/04/07 18:39+08

Intro

target: jQuery EasyUI DataGrid 的 Column 自適應寬度
如果您沒有指定寬度給 Grid 的 Columns
在載完資料後, 您會發現 Header 和 Body 的欄寬沒有對齊
主要是因為它產生的 Header 和 Body 是在不同的 table

Content

在 DataGrid 的 onLoadSuccess 的事件中加入一些代碼, 如下:

onLoadSuccess: function (data) {
    var panel = $(this).closest(".datagrid");
    var dg = $(this);
    panel.find("div.datagrid-view2 > div.datagrid-body tr:first > td[field]").each(function (k, v) {
        var bodyCol = $(v);
        var field = bodyCol.attr("field");
        var headerCol = panel.find("div.datagrid-view2 > div.datagrid-header tr:first > td[field='" + field + "']");
        var bodyContent = bodyCol.children(":first");
        var headerContent = headerCol.children(":first");
        var content = null;
        if (bodyCol.width() > headerCol.width()) {
            content = bodyCol.children(":first");
        } else {
            content = headerCol.children(":first");
        }

        var col = dg.datagrid("getColumnOption", field);
        col.width = content.outerWidth();
        col.boxWidth = $.boxModel == true ? content.width() : content.outerWidth();

        bodyContent.width(col.boxWidth);
        headerContent.width(col.boxWidth);
    });
    dg.datagrid("fitColumns");
    dg.datagrid("fixColumnSize");
}

B.R. : )

WCF Inspector

Last Update: 2012/04/03 00:14
Type: Normal

Intro

目標: 攔截 Client 與 WCF 的溝通訊息

Content

.. 專案建置(可跳過)

... 輸入WCF專案名稱(TestWcf)
請毫不猶豫的按下新增後, 完成 Server!!
就用他預設的Sample Code就好

... 啟動 WCF(Web Service)
在專案上按右鍵 => 偵錯 => 開始新執行個體
找到你的 wsdl 的 uri (ex: http://localhost:1101/Service1.svc?wsdl)

.. 新增Client專案
這裡用 Web Site (TestWeb)
對專案點右鍵 => 加入服務參考 => 輸入 wsdl 的 uri => 確定


===我不是分隔線========================
這東西講起來
就是用 MS 架構好的 Inspector
所以說明起來沒啥意義
直接 2 步驟 完成它!!!

.. step1建立攔截處理器

在 TestWeb 新增下述 class

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

namespace TestWeb
{
    public class MyWcfMessageInspector : System.ServiceModel.Configuration.BehaviorExtensionElement,
        System.ServiceModel.Dispatcher.IClientMessageInspector,
        //System.ServiceModel.Dispatcher.IDispatchMessageInspector,
        System.ServiceModel.Description.IEndpointBehavior
    {
        protected override object CreateBehavior() { return new MyWcfMessageInspector(); }
        public override Type BehaviorType { get { return typeof(MyWcfMessageInspector); } }


        #region IClientMessageInspector
        public void AfterReceiveReply(ref System.ServiceModel.Channels.Message reply, object correlationState)
        { System.Diagnostics.Debug.WriteLine("===AfterReceiveReply"); }
        public object BeforeSendRequest(ref System.ServiceModel.Channels.Message request, System.ServiceModel.IClientChannel channel)
        { System.Diagnostics.Debug.WriteLine("===BeforeSendRequest"); return null; }
        #endregion

        //#region IDispatchMessageInspector
        //public object AfterReceiveRequest(ref System.ServiceModel.Channels.Message request, System.ServiceModel.IClientChannel channel, System.ServiceModel.InstanceContext instanceContext) { throw new NotImplementedException(); }
        //public void BeforeSendReply(ref System.ServiceModel.Channels.Message reply, object correlationState) { throw new NotImplementedException(); }
        //#endregion

        #region IClientMessageInspector
        public void AddBindingParameters(System.ServiceModel.Description.ServiceEndpoint endpoint, System.ServiceModel.Channels.BindingParameterCollection bindingParameters) { }

        public void ApplyClientBehavior(System.ServiceModel.Description.ServiceEndpoint endpoint, System.ServiceModel.Dispatcher.ClientRuntime clientRuntime)
        {
            clientRuntime.MessageInspectors.Add(new MyWcfMessageInspector());
        }
        public void ApplyDispatchBehavior(System.ServiceModel.Description.ServiceEndpoint endpoint, System.ServiceModel.Dispatcher.EndpointDispatcher endpointDispatcher) { throw new NotImplementedException(); }
        public void Validate(System.ServiceModel.Description.ServiceEndpoint endpoint) { }
        #endregion

    }
}

BehaviorExtensionElement: 為了在 web.config 裡設定
IClientMessageInspector: Client端的訊息攔截
IEndpointBehavior: 設定此class的行為是Endpoint

.. step2 設定 web.config

加入下述設定, 用來建立攔截器

<system.serviceModel>
  ...
  <extensions>
    <behaviorExtensions>
      <add name="MyWcfMessageInspector" type="TestWeb.MyWcfMessageInspector, TestWeb, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null"/>
    </behaviorExtensions>
  </extensions>
  <behaviors>
    <endpointBehaviors>
      <behavior name="MyWcfMessageInspectorBehavior">
        <MyWcfMessageInspector />
      </behavior>
    </endpointBehaviors>
  </behaviors>
  ...
</system.serviceModel>

在你欲攔截的 Endpoint 設定中
加入 behaviorConfiguration="MyWcfMessageInspectorBehavior"

<system.serviceModel>
  ...
  <client>
    <endpoint ... behaviorConfiguration="MyWcfMessageInspectorBehavior" />
  </client>
  ...
</system.serviceModel>

OK 大功告成