Formatting in Related Items
Hi, I have two questions related to formatting in Related Items:
1. How can I size a field? In the picture below I have a field I would like to make wider, either fixed width or a certain percentage of the row width.
2. Is there a way to create an alias or display name for the column headings. Since many tables have the field "ID", my example above would be to change the "ID" column heading in the related items to "Ticket ID". We also may like to include things like spaces in our column headings.
1. How can I size a field? In the picture below I have a field I would like to make wider, either fixed width or a certain percentage of the row width.
2. Is there a way to create an alias or display name for the column headings. Since many tables have the field "ID", my example above would be to change the "ID" column heading in the related items to "Ticket ID". We also may like to include things like spaces in our column headings.
Hi!
Sorry for a late reply!
1) Please add this CSS rule to your CSS Editor:
Notice that you should replace '5' with a zero-based index of your column you expect to be resized.
2) To rename a column, you can simply rename it in the source List of the Related Items control. If you go to List Settings of the original list, you can rename any column. Be careful as the internal name of the column still stays the same.
But if you don't want to change the source list, there is another approach:
- add a CSS class to your Related Items, i.e. "related-issues'
- add this code snippet to your JavaScript Editor:
Notice that you should replace "Col" with an existing column name you would like to replace.
Sorry for a late reply!
1) Please add this CSS rule to your CSS Editor:
Code: Select all
.ms-viewheadertr th:nth-child(5) {
width: 350px;
}
2) To rename a column, you can simply rename it in the source List of the Related Items control. If you go to List Settings of the original list, you can rename any column. Be careful as the internal name of the column still stays the same.
But if you don't want to change the source list, there is another approach:
- add a CSS class to your Related Items, i.e. "related-issues'
- add this code snippet to your JavaScript Editor:
Code: Select all
var elem = $(".related-issues").find("div [name=Col]").find("a");
elem.html("Your Title With Spaces".replace(/ /g, " "));
elem.attr("Title","Your Hint");
-
- Information
-
Who is online
Users browsing this forum: No registered users and 17 guests