[Anonymous]

Hi Keith

This might be possible with Custom Display settings in qListView. The custom display properties lets the page designer customize the display of the data using HTML and JavaScript. The custom display appears after the default display (if the Display Fields property is defined). Please refer to the help file for more details.

There are 3 parts to control the output and format of the qListView grid layout. Typically you will use a table layout. I used a Web Parts Gallery list to show in this case and only displayed the Web Part name. It will be a long narrow list if I do not use Custom Display and Pagination. So here is what you can do:

1. In the Results Header section, initiate the script variable, such as <table><th><td>Web Part</td></th><script type='text/javascript'>var index =0;</script>. You may not need table header part <th><td>Web Part</td></th>
2. In the Results Body section, output the field and orgainze new row only when specific count is reached (the count will be the number to shown per row), suc as show below
3. In the Result Footer section, close out the table with </table>


<script type='text/javascript'>
if (index == 0) {
index++;
document.write("<tr>");
} else if (index < 6) { // if you want 6 items in a row
document.write("<td>");
document.write("<%Name%>");
document.write("</td>");
index++;
} else {
index = 0;
document.write("</tr>");
}
</script>

The end result could be something like below screen shot. Note I have left “Display Fields” property blank so to not render anything by default and only use Custom Display result. You can further check into SharePoint CSS style to apply to the table we used here to give it some nice display.

Hope this helps.

[Anonymous]

Thank you for this great lead.  This is a good start, but not quite meeting my needs.

The method you suggested yields these results:

·        I had to Hide the OOB Web Part or 2 web parts would be displaying.

·        Above the table that is generated, the qListView web part is displayed.  Marking the Chrome State as Minimized, or setting the Layout’s Hidden property prevents viewing of the entire resulting web page.

·        With the Quest Web Part displaying, the resulting page loads both the original vertical list items, as well as the generated table beneath it.  But after configuring the QWP with no display fields, I got just the table I was looking for.

·        I had to slightly modify the IF logic comparing to the max number of columns – if you specify < 6, it’ll stop at 5, so I just changed it to <=.

·        The table generated is simply a table.  I am also looking to maintain the linkage between the item and its source, in order to view or edit the item from the table (instead of from the vertical list).  I figure I can probably extract the item’s URL somehow and embed that as a href anchor/tag around the table entry; I just don’t know where I can get that URL value.

·        The table values are sized such that the columns are as wide as the widest value in the column.  For those table entries that are the widest, they abut the value to its right.  Is there a way to add some resizable, minimum padding?

·        The table head/title (yours is listed as “Web Part”) is in the 2nd column.  Is there a way to center across the page, or left justify it?

·        Is there a way sort the list results (such as alphabetically) before splitting into the table?  Will be much easier to find the items in the table then.

Thanks again for your assistance!

Keith

[Anonymous]

The field expression <%FieldName%> translates to the value for each row in the qListView. To get the URL, assuming that there is a field in the list you are connecting has a field named "URL", then you can use field expression <%URL%> to get the value, same as the way you output the <%Name%> >field. And your javascript would output something like:

document.write("<a href='<%URL%>' ><%Name%></a>");

The approach is really a quick way to display content and is driven by the web part on a per row bases. To sort it in the order you wanted by certain field, you would need to specify that in the Display Field tab "Sort Field" not doing here in the JavaScript or Custom Display.

You can output any HTML code here. Not necessary a table/tr/td elements but could be any div tag with classes that you have. You may try to add colspan to the header so it center on the table.

[Anonymous]

I was able to figure out the Field Name thing and that’s how I was able to generate the information I was looking for.  I just didn’t do a good job of explaining my needs.

Normally, when SharePoint presents a list, the items in the list are hyperlinks to be able to view or edit the item.  In this particular list, we are only displaying one field; it is displayed with a hyperlink to view it, then has the option to edit it.  And normally, the list is displayed in a single column of items, 1 item per row no matter how many fields in the item.

In the table design you suggested, we only took the contents of one field we were interested in and for each item we threw them into a table.  I would like the contents of the table to function like the original list, in that the cell contents would be hyperlinks to the list item to view/edit the item.  There are no columns or fields named URL in this list, unless a hidden field that SP uses to store the hyperlink (though I wouldn’t think SP would do this).

Like my original post requested, I’m just trying to display the list items in multiple columns to take up less page space, instead of just a single long vertical column.

Thanks!

Keith

[Anonymous]

Hi Keith

In order to render each item as hyperlink to its own view page, you will want to first find out where the view page goes. You can construct another qListView connect to the list and right click on the list item’s “View Properties” menu, which typically opens up the dialog. Right click inside the dialog for “Properties” menu where you can copy the full URL address.

An example looks like the following when I connect to Web Part Catalog list:

http://sharepointsite/_catalogs/wp/Forms/DispForm.aspx?Source=http%3A%2F%2Fwin2k8r2%2Dxchen%3A80%2FSitePages%2Flistview%2Easpx%3FPageView%3DShared%26InitialTabId%3DRibbon%2EWebPartPage%26VisibilityContext%3DWSSWebPartPage&ID=1&RootFolder=%2F%5Fcatalogs%2Fwp&IsDlg=1

You want to rewrite the Custom Display body part to something like the following:

document.write("<a href='ModifiedURLString'><%Name%></a>");

Where ModifiedURLString is the entire string you captured earlier (recommend to use relative path though so remove http://sharepointsite part) but you need to look into this string carefully and notice the part “ID=1” and replace it with “ID=<%ID%>”. This tells to build the hyperlink to use field expression to pass the right ID of the item you clicked. If you have multiple lists defined in this qListView, this might not work but as long as it is a single list, this URL shall always work. Also notice the part “IsDlg=1” won’t have any effect here as it will be open as a new page. To launch this window in a dialog, you would have to use SharePoint JavaScript dialog framework call to do that.

Hope this helps.

[Anonymous]

That’s the response I was expecting, though I was hoping for one where I could dynamically determine the link properties instead of having to hard-code it…makes it easier to migrate between Dev/Test/Prod environments that way.

Either way, what you provided looks like a workable solution.  Thank you for your time and a great answer!

Keith

[Anonymous]

You can achieve certain degree of dynamic with the expression <%Folder%> to replace part of the URL string.

[Anonymous]

Any idea where I can view a list of available <%variables%>?  Thanks!

Keith

[Anonymous]

Thank you both for helping me come to this solution:

qListView web part

Display tab

Viewed Lists field:

<Lists>

<List SiteUrl=”.” ListName=”theList” />

</Lists>

Sort Fields field:

Title

Custom Display tab

Results Header field:

<table><th><td><b>Appraiser List</b></td></th>

<script type=’text/javascript’>var index = 0; var rowmax = 8;</script>

Results Body field:

<script type=’text/javascript’>

if (index == 0) {

index++;

document.write(“<tr>”);

} else if (index <= rowmax) {

document.write(“<td>”);

document.write(“<a href=/sites/Site_Collection/Site/Lists/theList/dispform.aspx?&ID=<%ID%>>”);

document.write(“<%Title%></a>”);

document.write(“</td>”);

index++;

} else {

index = 0;

document.write(“</tr>”);

}

</script>

Results Footer field:

</table>

Adjust the ‘rowmax’ value in the Results Header to match the number of desired columns.  The column width auto-adjusts and wraps the Titles within each cell if they end up too long.

Additionally, the documentation you mentioned can be found at: http://documents.quest.com/QB18575 (for the version I am using, at least).

There may still be a better, more dynamic way to do this, but I doubt it will end up this simple.

[Anonymous]

Hi Keith,

  Thanks for sharing the solution with us. I hope that other persons can use your case to solve their problems.

[Anonymous]

Any idea where I can view a list of possible field replacement expressions (not counting the field names specific to my list)?  I don’t see them documented anywhere.

Thanks!

Keith

[Anonymous]

Hi Keith,

  <%FilePath%> is one of then It returns the full path to the file when qListView or qCalendar points to a document library.

Are you looking for some specific expression?

[Anonymous]

To summarize my initial need, I have list of a few hundred items, where I only need to display one small field; let’s just say it’s the Title for this discussion.  By default, the list will be displayed one title per line, where the title is linked to the item View.  This results in a lot of lost page real estate, so helped me format the results in a table using qListView and Custom Display options.  His technique has made such an improvement to the page that I can actually display all the titles on a single page.

The resulting table, however, is just a list of the item titles.  None of the titles link back to the item View, so it’s not a total solution.  I’m trying to figure a way to manually insert the html tags in the Body around each title so that each will become a hyperlink to its View.  This really isn’t ideal; it is a lot of work, and I would like to make it dynamic enough that it could figure this out for itself, making the transition across Dev -> Test -> Prod environments simpler…make full use of all our Quest tools.  I don’t know that this is possible, but I’m certainly going to give it a shot.

Most of our company’s lists are not for documents, including this one.  So at least for now, we can focus on a standard list instead of a document library.  While I haven’t yet tried it, I wouldn’t think that the <%FilePath%> expression would be usable in this case.

Would you have any other advice?  Thanks!

Keith

[Anonymous]

Hi Keith,

  Just follow 's suggestion (great and detailed explanation) and use relative URL's so you have a smooth transition from Dev to QC and Production.

The important part to identify the item is to use in your URL ID=<%ID%>.

I'm not aware of any variable that would do all that work for you.

[Anonymous]

Thanks for your advice as well.  To my point though, while you aren’t aware of a variable that could do all that work, I don’t know any of the variables, so I was hoping someone could point me to where they are identified…which may lead to some other interesting ideas too.

Thanks again!

Keith

[Anonymous]

Hi Keith

Some of the variables that we made available to users (not including any field expression) can be found in the online help documentation. I used to be able to search by “CurrentUserID” for example to locate the part of the help file but I seemed unable to do it now. We will look into this. But for the list of variables you are looking for, we have a couple of places mentioning them (probably a good idea to consolidate them in one list and one page). As mentioned, you can search for “FilePath” and find the use of this variable.

Some other variables, such as CurrentUserName, CurrentUserID, and CurrentUserEmail can be found to be used in System Integration Web Part as Input, such as the screen shot of the help page included below – I will also need to check with the documentation team as I cannot locate them in the new help files today.

[Anonymous]

Hi,

I’ve tried out the same thing using jQuery but it didn’t help out.

My list has below items:

Item1
Item2
Item3
Item4
Item5
Item6
Item7
Item8
Item9
Item10

Its displaying the result like this:
Item1          Item2          Item3          Item4          Item5

The order is correct. But its not displaying the rest of the items in next row. Please check the code below and suggest:

<script type='text/javascript'> var index = 0; var rowmax = 8;</script>
<script language="javascript" type="text/javascript">
var title = "";
var url = "";
$(document).ready(function () {
GetData();
//alert($('#tabk').find('td[colspan!=""]').length);
});
function GetData() {
$().SPServices({
operation: "GetListItems",
async: false,
listName: "TestFooter",
CAMLViewFields: "<ViewFields><FieldRef Name='Title' /><FieldRef Name='Link' /></ViewFields>",
completefunc: function (xData, Status) {
$(xData.responseXML).SPFilterNode("z:row").each(function () {
AddRowToTable(title, url);
title = $(this).attr("ows_Title");
url = $(this).attr("ows_Link");
// alert(title);
//AddRowToTable(title, url);
});
}
});
}
function AddRowToTable(title, url) {
if (index == 0) {
index++;
$("#abk").append("<tr>");
} else if (index <= 5) {
$("#tabk").append("<td><a href=" + url + ">" + title + "</a></td>");
index++;
} else {
index = 0;
$("#tabk").append("</tr>");
}
}
</script>
<div id="siteOwner">
<table id="tabk">
</table>
</div>

[Anonymous]

Is there a Web Part, or a configuration option in the qListView, to display a list across columns or in a table? I’m looking to display a list that is normally shown as:

Item 1

Item 2

Item 3

Item 4

Item 5

Item 6

Item 7

Item 8

 

as something like:

Item 1      Item 2      Item 3

Item 4      Item 5      Item 6

Item 7      Item 8

 

or:

Item 1      Item 4      Item 7

Item 2      Item 5      Item 8

Item 3      Item 6

 

…it just takes up too much real estate when there is just one column, e.g., Title field, making up the list.  This is not for a Form or input, just output/display.

 

Thanks!

[Anonymous]

Hi,

I don’t think the ‘AddRowToTable’ function in your script is correct, the structure of the table should be as below:
<table>
<tr>
<td>…</td>
<td>…</td>
<td>…</td>
</tr>
</table>
But the ‘$(“#tabk”).append(“<td><a href=” + url + “>” + title + “</a></td>”);’ will generate the structure below, the td is not embedded under the <tr/>:
<table>
<td>…</td>
</table>
You should create a <tr/> object first, and then add all the td elements into this object, finally, append the tr object into the table object.

 

[Author]

Posts