In a recent application, we helped customers modify the panel of a Forum. All of them were designed to discuss the panel list. Generally, the width of the bar can be set through the designer view, you can set the panel of the list, but the discussion board cannot be handled like this. When you insert a custom view, some problems may occur in the partial column, such as the "number of replies" column and "topic" column. Since the custom data view cannot be processed, there is no way to start with modifying the html page data. When the page loads all the data, the JS method is used, dynamically modify the width of all columns in the list. Note that when you set the width of all columns in the list, you must also modify the width of all columns, fix the width of all columns so that the Panel is not neat due to a large amount of data in a column. The following is a JS sample code for modifying the width of the column in the list. It is best to put this code in masterpage. If it is modified directly on the aspx page, the effect can also be achieved, but the next time you modify it, an error occurs when the View data of the Forum list is displayed. Code
<Script type = "text/javascript" language = "javascript">
Var tagName = "";
Var tags = document. getElementsByTagName (tagName );
For (var I = 0; I <tags. length; I ++ ){
If (tags [I]. title = "sort by topic ")
{
Var obj = tags [I];
Var objparent = obj. parentElement;
Objparent. width = "550px ";
}
If (tags [I]. title = "sort by creator ")
{
Var obj = tags [I];
Var objparent = obj. parentElement;
Objparent. style. width = "100px ";
}
If (tags [I]. title = "sort by Last Update Time ")
{
Var obj = tags [I];
Var objparent = obj. parentElement;
Objparent. style. width = "150px ";
}
}
TagName = "TH ";
Var tags = document. getElementsByTagName (tagName );
For (var I = 0; I <tags. length; I ++ ){
If (tags [I]. innerHTML. indexOf ("")>-1)
{
Tags [I]. width = "100px ";
}
}
</Script>
Shows the effect:
I hope to give a reference to anyone who needs it.
