I have been struggling to get columns to line up in list view. There was not default template for list view so I had to create my own. When I look at other moodle databases, they all have these cool grey grid lines and line up perfectly.
I am approximating that effect by carefully specifying the exact % width I need (in HTML) in each <td> </td> field and in one case, I have to type in this!!! (specifying pixel widths) ...
<td width="20%">
<div style="overflow: auto; width: 200px; height: 40px;" id="dataList">
<table cellspacing="0" cellpadding="0" valign="bottom"><tbody>
<tr>
<td>Article URL
</td>
</tr></tbody>
</table></div>
</td>
This is crazy! How does everyone else do it?
If it is this hard to set up a list layout in moodle, I think I'll abandon it and try a different product.
I have attached a screen shot (after hours of tweaking).
Whenever I create a new database, after creating the fields, I go to my view single templates and copy the code.
Then I open a full featured html editor (I use Dreamweaver), paste the code and create a table that represents how I want my data to look. When finished with that table I duplicate the table and replace the field identifiers with desired labels in one of the tables.
Then I copy and paste each table back to the "list view" templates utility, the table with labels in the header box and the table with field IDs in the body box.
This way I am assured that tables will align.
Joe
Then I open a full featured html editor (I use Dreamweaver), paste the code and create a table that represents how I want my data to look. When finished with that table I duplicate the table and replace the field identifiers with desired labels in one of the tables.
Then I copy and paste each table back to the "list view" templates utility, the table with labels in the header box and the table with field IDs in the body box.
This way I am assured that tables will align.
Joe
Hi, Michael.
Don't make a table for every row, that's the problem. Just have a row.
When editing your template make sure your HTML editor is switched off too (the editor can't cope too well with partial tables).
As an example, I've attached the code from the Modules and Plugins database, exported as a Database preset. You can just import it to your site if you want (under the Presets tab in the database).
For reference, here is how I did the HTML (there are some extra classes and Javascript there which help with the fancy highlighting etc)
<th align="left" class="c0 header">Name</th>
<th align="left" class="c1 header">Type</th>
<th align="left" class="c2 header">Requires</th>
<th align="left" class="c3 header">Status</th>
<th align="left" class="c4 header">Summary</th>
<th align="center" class="c5 header"> </th>
</tr>
<td class="c0"><b><a href="##MoreURL##">Name</a></b></td>
<td class="c1">Type</td>
<td class="c2">Requirement</td>
<td class="c3">Status</td>
<td class="c4">Summary</td>
<td align="center" class="c5">##Edit## ##Delete## ##More## ##Approve## </td>
</tr>
Don't make a table for every row, that's the problem. Just have a row.
When editing your template make sure your HTML editor is switched off too (the editor can't cope too well with partial tables).
As an example, I've attached the code from the Modules and Plugins database, exported as a Database preset. You can just import it to your site if you want (under the Presets tab in the database).
For reference, here is how I did the HTML (there are some extra classes and Javascript there which help with the fancy highlighting etc)
Header
<table width="80%" cellpadding="5" border="1" align="center" class="modulesdata generaltable"><tr><th align="left" class="c0 header">Name</th>
<th align="left" class="c1 header">Type</th>
<th align="left" class="c2 header">Requires</th>
<th align="left" class="c3 header">Status</th>
<th align="left" class="c4 header">Summary</th>
<th align="center" class="c5 header"> </th>
</tr>
Repeated entry
<tr onmouseover="this.className='trhighlight'" onmouseout="this.className='trnormal'"><td class="c0"><b><a href="##MoreURL##">Name</a></b></td>
<td class="c1">Type</td>
<td class="c2">Requirement</td>
<td class="c3">Status</td>
<td class="c4">Summary</td>
<td align="center" class="c5">##Edit## ##Delete## ##More## ##Approve## </td>
</tr>
Footer
</table>
And here is the preset for Moodle Buzz, which is even closer to your needs I think.
Thanks for your help, both of you. I will try what you suggested on the weekend.
Is this a case of applying an individual css class to each column (using a single row in list view)? I have applied one class to all columns and it did not work. I also tried creating a single new class for each column, and this works. I have not tested this theory to see if it works again, but looking at the code above, I am beginning to suspect there is something about Moodle that this is true. I may however be proved wrong on this. Fingers crossed I'm not.
Hi Martin (or any other experts available),
I'm using your pretty Moodle Buzz preset which suits most of my needs, however, I've encountered three problems I cannot solve:
1. How do I get the rating to work/show? Rating is enabled, but nowhere can I see that people can rate the posts. How do I set it up in all the templates, including search?
2. If an url is not posted, can the title (in all views) simple show as plain text, instead of as a link (leading to a blank page, which will frustrate the users)? Our resources include books only available in print.
3. An url such as http://books.google.ca/books?id=K2AvZmco3E0C&lpg=PP1&ots=cKrlI1Gufe&dq=man's%20search%20for%20meaning&pg=PP1#v=onepage&q&f=false cannot be saved. Is there a solution?
My ability to write html code is zero. Your preset has been such a great help. Look forward to solving these remaining issues. The first one is the most urgent.
Many thanks!!!
Martin,
If the editor is not turned on, how do you edit the HTML for the table?
If the editor is not turned on, how do you edit the HTML for the table?
What I mean is i need to add to the columns and add new fields. Once i do that, the view list is distorted.
You add a column by modifying the html.
If you have a header row in the header section you should add
<th>Column name</th>
And then in the repeated section
<td>||Column field||</td>
such that the position of the td in the repeated row correspond to the position of the th in the header row.
If you have a header row in the header section you should add
<th>Column name</th>
And then in the repeated section
<td>||Column field||</td>
such that the position of the td in the repeated row correspond to the position of the th in the header row.
Thanks Itamar,
I got it to work. I guess the problem I was having was related to what Martin said here “When editing your template make sure your HTML editor is switched off too (the editor can't cope too well with partial tables)” and I found that to be true.
So I saw another post that said “Another way would have been to turn off the HTML editor altogether (in your profile), whenever you work on the templates...” so that’s what I did.
Yes, but it should suffice to turn it off in the database templates without turning it off in the profile.
It may be too late. I mean that by the time you get a chance to turn it off when editing a template, the editor might have already mangled the content.
Only if you make changes to the template in the editor and only then turn it off. But if you disable the editor before touching the content, the underlying code remains intact.
Can a preset from 1.9 be used in 2.0.2? I am getting "Import error". I tried the Moodle Buzz preset posted above.
Tieku
Don't know. Haven't got to that yet.