gridView 调整列宽。

[peihuadavy]

怎样可以让用户调整GridView的列宽？？

谢谢！

[peihuadavy]

呵呵！！！

[cansum396]

后台cs
private void DataGrid1_ItemDataBound(object sender, System.Web.UI.WebControls.DataGridItemEventArgs e)
{
DataTable dt = new DataTable();
dt = (DataTable)((DataGrid)sender).DataSource;
string id = ((DataGrid)sender).ID;
if (e.Item.ItemType == ListItemType.Header)//表头
{
e.Item.Cells[0].CssClass = "fixedHeaderCol";
for (int i = 1; i < dt.Columns.Count; i++)
{
e.Item.Cells[i].Text = "<font style='width:100% table-layout:fixed' class=\"resizeDivClass\" onmousedown=\"MouseDownToResize(this);\" onmousemove=\"MouseMoveToResize(this);\"onmouseup=\"MouseUpToResize(this);\"></font>" + e.Item.Cells[i].Text + "<span class=arrow id=" + e.Item.Cells[i].Text + "></span>";
}
}
}



前台js
function MouseDownToResize(obj){
setTableLayoutToFixed(obj);
obj.mouseDownX=event.clientX;
obj.pareneTdW=obj.parentElement.offsetWidth;
obj.pareneTableW=obj.parentNode.parentNode.parentNode.parentNode.offsetWidth;
obj.setCapture();
}
function MouseMoveToResize(obj){
if(!obj.mouseDownX) return false;
var newWidth=obj.pareneTdW*1+event.clientX*1-obj.mouseDownX;
if(newWidth>0)
{
obj.parentElement.style.width = newWidth;
obj.parentNode.parentNode.parentNode.parentNode.style.width=obj.pareneTableW*1+event.clientX*1-obj.mouseDownX;
}
}
function MouseUpToResize(obj){
obj.releaseCapture();
obj.mouseDownX=0;
}
function setTableLayoutToFixed(obj)
{
if(obj.parentNode.parentNode.parentNode.parentNode.style.tableLayout=='fixed') return;
var headerTr=obj.parentNode.parentNode.parentNode.parentNode.rows[0];
for(var i=0;i<headerTr.cells.length;i++)
{
headerTr.cells[i].styleOffsetWidth=headerTr.cells[i].offsetWidth;
}

for(var i=0;i<headerTr.cells.length;i++)
{
headerTr.cells[i].style.width=headerTr.cells[i].styleOffsetWidth;
}
obj.parentNode.parentNode.parentNode.parentNode.style.tableLayout='fixed';
}


前台Css
.resizeDivClass
{
position:relative;
background-color:whitesmoke;
width:1;
z-index:100;
float:right;
left:1;
height:100%;
cursor:e-resize;
}

[peihuadavy]

谢谢!!我回去试试!!!

[cansum396]

e.Item.Cells[0].CssClass = "fixedHeaderCol";
这一句可以不要

[peihuadavy]

我用gridView的！！没搞成功！！·····
可以把页面代码也给看看吗？

[一品梅]

学习了,我又联想到CSDN的框架也可以用些方法么 ?
需要再修改哪些东东?

[yap111]

我的方法，用代码实现，希望能解决 你的问题：
//设置网格线颜色
this.gdvFields.Attributes.Add("bordercolor", "black");
//列宽设置
this.gdvFields.Columns[0].HeaderStyle.Width = 120;
this.gdvFields.Columns[0].ItemStyle.Width = 120;
this.gdvFields.Columns[1].HeaderStyle.Width = 60;
this.gdvFields.Columns[1].ItemStyle.HorizontalAlign = System.Web.UI.WebControls.HorizontalAlign.Center;
this.gdvFields.Columns[1].ItemStyle.Width = 60;
this.gdvFields.Columns[2].HeaderStyle.Width = 70;
this.gdvFields.Columns[2].ItemStyle.Width = 70;
this.gdvFields.Columns[3].HeaderStyle.Width = 400;
this.gdvFields.Columns[3].ItemStyle.Width = 400;
this.gdvFields.Columns[4].HeaderStyle.Width = 50;
this.gdvFields.Columns[4].ItemStyle.HorizontalAlign = System.Web.UI.WebControls.HorizontalAlign.Center;
this.gdvFields.Columns[4].ItemStyle.Width = 50;

DataView dv = ds.Tables[0].DefaultView;

[Berry_tian]

<asp:BoundField HeaderText="名字" DataField="name">
         <ItemStyle Width="10%" />
</asp:BoundField>

[Berry_tian]

不好意思 答错了！ 没看清。

不会，帮顶

[peihuadavy]

呵呵!!!是不是没办法做到的??

[yzaiml]

可以转成模板列 在设置里面控件的宽

[peihuadavy]

还没成功！！不过主要是那些js！！
先收藏！呵呵

[stray2010]

服务器控件总会生成html标签发到客户端。。。。在客户端用js就好了

[阿非]

XP 风格的可拖动列、可排序、可改变宽度的DataGrid的例子
http://blog.csdn.net/net_lover/archive/2004/06/16/6959.aspx

[yang_kun]

等LZ尝试.......

[peihuadavy]

谢谢！今晚没怎么弄！呵呵！