Hello,
I'm wondering if there are any Rails users out there who have successfully integrated ActiveWidgets Grid & RoR.
======================================================
In a fairly typical use of Rails with RJS, I would load a table/grid something like the following:
-----------------------------------------------------
index.rhtml
----
code here to select category & trigger loading of the
table
----
<table>
<thead>
<tr>
<td> columnHead1 </td>
<td> columnHead2 </td>
<td> columnHead3 </td>
</tr>
</thead>
<tbody id="grid" class="scrollingContent">
</tbody>
</table>
---------------------------------------------------
main_controller.rb
.
.
.
def load_table
@things = Thing.find(:all)
---------------------------------------------------
_table_rows.rhtml
<% @things.each do |thing| -%>
<tr>
<td>
<%= thing.attribute1 %>
</td>
<td>
<%= thing.attribute2 %>
</td>
<td>
<%= thing.attribute3 %>
</td>
</tr>
<% end %>
---------------------------------------------------
load_table.rjs
page.insert_html :bottom, 'grid', :partial => 'table_rows', :object => @things
==================================================
So, typically, the controller creates the collection which, at the behest of the RJS template, is then used by the partial to load the table.
Assuming the collection is reformatted as xml (either manually or by using the Rails ".to_xml" method ), how would it then be loaded into the grid?
Would the ActiveWidgets ".setURL();" method be used?
What would the Rails code look like?
Thanks!
Hi Randy,
I just started working with ActiveWidgets grid classes today and made a little progress. My view code looks like this:
<%= javascript_include_tag :defaults %>
<link href ="/javascripts/ActiveWidgets/runtime/styles/xp/aw.css" rel="stylesheet" type="text/css" ></link>
<script src="/javascripts/ActiveWidgets/runtime/lib/aw.js"></script>
.
.
.
<div id="systemGrid">
<script>
<% rowCount = 0 %>
var obj = new AW.UI.Grid;
var myHeaders = ["Column 0",
"Column 1",
"Column 2",
"Column 3"];
var html = new AW.Formats.HTML;
var myCells = [
<% @myTable.each do |rows| %>
<% id = rows.id %>
<% col0 = rows.col0%>
<% col1 = rows.col1 %>
<% col2 = myTable.col2 %>
<% col3 = myTable.col3 %>
<% sep = rowCount > 0 ? "," : "" %>
<%= sep %>["<a href='/myView/myAction/<%= id %>'><%= col0 %></a>","<%= col1 %>","<%= col2 %>","<%= col3 %>"]
<% rowCount += 1 %>
<% end %>
];
obj.setId("tableSelectGrid");
obj.setPanelWidth("800px");
obj.setPanelHeight("400px");
obj.setCellText(myCells);
obj.setCellFormat(html, 0);
obj.setHeaderText(myHeaders);
obj.setColumnCount(6);
obj.setRowCount(<%= rowCount %>);
obj.setColumnWidth(150, 0);
obj.setColumnWidth(110, 1);
obj.setColumnWidth(100, 2);
obj.setColumnWidth(150, 5);
document.write(obj);
</script>
</div>
I had to jump through a couple of hoops to get this to work and there's no doubt a better way to do it. I'm trying to create a table which displays some summary data including a column of links to more detail for the selected row. <% link_to ... %> inserted double quotes into the href that it generates, so I grabbed the generated code from the browser's View Source listing, inserted it into that column definition and replaced the double quotes with single quotes. Then I included the
var html = new AW.Formats.HTML;
and
obj.setCellFormat(html, 0);
statements to get it to format as html.
The <% sep = rowCount > 0 ? "," : "" %>
<%= sep %>
inserts a comma at the beginning of each row except the first one. I couldn't get a plain comma to work, but the variable representing it did. Go figure. The rowCount part is there because you have to manually set the number of rows.
There's a php example in the grid documentation that looks a lot cleaner. Unfortunately, I don't know enough javascript yet to translate it cleanly so I went with this kind of brute force approach that probably makes it clear that I don't really know what I'm doing.
What's not working yet is an ajax call to redraw the grid with the results of a filtered selection. Above the table definition I have a form input field and an observer that I use to insert a LIKE filter into an ActiveRecord :conditions statement. It works in my homegrown table but is blowing up so far with the grid, generating an error message that says it doesn't recognize "aw". I tried moving the ActiveWidgets links from the top of the file to the grid div, but got the same results. That must be possible, but I'm really new to all this and I haven't figured it out yet. If anyone can tell me what I need to do, I'd appreciate it.
The extended grid also worked with all the same code but was noticeably slow. I'm presenting a little over 1000 rows, so that's not surprising. I don't really need the additional functionality it provides, so I went with the simpler version.
If you haven't already figured this all out on your own, this might help you get started.
Good luck!