Creating master-detail grids using Agile Toolkit - atk4

How can I create a form that displays two grids, master and detail. When you select a record from the master, the details grid is refreshed.

Your question is difficult to understand, as you are mixing terms Form & Grid. Those are two different UI elements.. If you, however, have imagined following situation:
1) GridA - shows list of user
2) GridB - shows activity log filtered by user
then syntax would be straight forward:
class page_x extends Page {
function init(){
parent::init();
$g = $this->add("Grid");
$g->setModel("User");
$g->addColumn("button", "filter");
$m = $this->add("Model_Log");
if ($_GET["user_id"]){
$m->addCondition("user_id", $_GET["user_id"]);
}
$g2=$this->add("Grid");
$g2->setModel($m);
if ($_GET["filter"]){
$g2->js()->reload(array("user_id" => $_GET["filter"]))->execute();
}
}
}
not parsed, but should give you idea of how to use conditional reloads, grids, buttons, event handling.

Related

Drupal 7: How to draw all widgets for a node-add form dynamically

I'm working on a module in which I need to draw multiple node-add forms, from different content-types, in the same page and save them all at once. I have all the content types of every node I need to add, and I even managed to get the fields using field_info_instances("node", $type).
Now I need to render the fields. I found node_add() but this function creates the entire form, including save buttons and publishing options. I only need the widgets for the fields.
Is there a hook or a function in drupal that will render only the widgets for a node-add form given the content type, or even the widgets for a field given it's info?
R.
PS: I'm working on drupal 7.x
Calling node_add($content_type); will give you the node add form for this specific form type.
I'd think this way
$form = array();
$types = array('page', 'blog', 'article');
foreach ($types as $type) {
$type_form = node_add($type);
// Somehow merge this data with the $form array avoiding the conflicts
// resulting from mulitple fields with same name.
// and find a way to submit all of them with one button .. ajax?
}
return $form;

How should 2 seemingly independent views under the same parent interact

Please consider following scenario:
<ParentView>
<FilterSubview></FilterSubview>
<ListSubview></ListSubview>
</ParentView>
To give you and example: I have a view which in turn shows view with filter (user can select to display books, magazines or both of them) and the list with items.
Both filter and list have corresponding models. Filter - what can we filter. List - list of all items.
Use case: user sees the full list and then can filter results by selecting only desired category.
Questions:
How those two views should interact? Should they know about each other or should parent view handle it?
Who should store filtered list to display? It could be list subview model directly or parent view can filter complete list and then pass it to render.
There is no one correct answer to your questions, but I'll try to explain a common, idiomatic way here.
Two sibling views should not know of each other. Instead they should interact via events through some kind of a mediator. Since in your case both FilterView and ListSubView share a common parent view which is responsible for rendering both of them, you could let the parent view mediate the events:
var ParentView = Backbone.View.extend({
initialize: function() {
this.listenTo(this.filterView, "filter", this.filterChanged);
},
filterChanged: function(filterValue) {
this.listSubView.filter(filterValue);
}
});
var FilterView = Backbone.View.extend({
events: {
"change .filter" : "filterValueChanged"
},
filterValueChanged: function() {
var filterValue = //get filter value...
this.trigger("filter", filterValue);
}
});
Alternatively (preferrably, even) you can cut out a middle man and use the Mediator pattern. For that you need a third component whose job it is to pass messages between parties who should not know of each other. If you're using Backbone 0.9.9, there's just such a mediator built in: the Backbone root object works as a global event bus for this purpose.
So:
//ListSubView
this.listenTo(Backbone, "listfilterchanged", this.filterChanged);
//FilterView
Backbone.trigger("listfilterchanged", filterValue);
Then there's the question of who should be responsible of the list data. I tend to prefer to have the most specialized component be in charge, but so that only one component is in charge. In your case that would mean that the ListSubView should manage the filtered list, but only if the ParentView doesn't need to operate on it. That's just a generalization though, so take it with a grain of salt and do what feels right for your case.

EXT.JS getting a list of items from a fieldset

How can I get a list of items from a Ext.form.Fieldset? I'm trying to find a component based on one of its properties, this is what I've got so far:
Ext.each(container.items, function (component) {
if (component.name == config.name) {
component.doUpdate(config);
}
}, me);
Of course, items is undefined...so what can I do to access the components contained in my container, which is a fieldset?
You can use container.down(selector) or if its a form field use form.findField(name).
See this answer on the different ways to 'find' things in an extjs app:
Testing extjs apps
For form fields here is an answer that lists different tricks: Best way to access adjacent components / fields
EDIT: Use container.query(selector) method to get an array of objects. As down() method returns first found.

Finding the segue that was called in a ViewController

I'm using storyboarding and have a UITableView containing events, which when clicked load another view with more details. I also have an 'add' button on that list which goes to the same page but doesn't prepopulate the information and changes the banner button.
I do it by setting the detail item with the following method, and then in the configureView method I just check if the detail item exists.
- (void)setDetailItem:(id)newDetailItem {
if (self.detailItem != newDetailItem) {
_detailItem = newDetailItem;
[self configureView];
} }
This works ok, but I thought there might be a better way to distinguish between methods, eg by getting the segue identifier in this new view controller and using that. Is there an easy way to do this or do I need to pass this information through as part of the prepareForSegue method?
Using prepareForSegue: seems right. In general, it's a bad idea for methods to care about the conditions under which they're being called if it's not explicit in their parameters.

Backbone.js - Help With Approach for Static Menus

I am very new at using Backbone. Please forgive me in advance as I am struggling to think in new ways building web apps.
I am confused about how to go about using it for items that are never really covered in any of the tutorials. All the tutorials give the basic "here is a model", "here is a collection of models", "here is a view that uses the model", etc. for entities that we all understand, such as a to-do item.
I do have those cases, and I am doing OK with those, but I am having trouble figuring out how to use Backbone for the following situation.
I have a to-do app (of course.) My UI needs to have several menus that allow the user to filter the to-dos by things like priority, due date, and other properties. So, my filter menus might look like this...
All To-Dos (100)
Inbox (15)
Important (10)
Someday (15)
Today (0)
Tomorrow (6)
This Week (7)
These are all somewhat static menus, except that when a filter is clicked, it should highlight, and possibly cause another filter to be turned off. Also, this would trigger an update in my results by performing a search and re-rendering my to-do list.
So, should I represent these items with views only? Are models needed to represent the state of the menus? Should I create a FilterMenuItem model and FilterMenu model, and also the corresponding views?
Again, I understand the samples when it comes to a model for a to-do item and a to-do collection, but I am stumped on how to tackle these seemingly simple items using Backbone.
I appreciate any suggestions or guidance.
The important thing to remember here is that collections in backbone.js inherit a bunch of cool features from underscore.js. Included in these is filter (or select), which allows you to get only those members of a collection which match your perameters. For example:
render: function(){
myCollection.filter(function(item){return item.folder === "inbox"});
}
If the menus are actually static, then you can use a case select statement to determine which page you are on & therefore which filter to use. Otherwise, you can have an array of objects representing the views, which describe how to filter, i.e.:
[
{view: "all", filter: function(item){return item;}}.
{view: "inbox", filter: function(item){return item.foler === "inbox";}},
{view: "important", filter: function(item){return item.type === "important;}}
]
As far as producing the view for your menu items goes, you have to decide if the the menu is static or not. If it is, then you can simply hard-code the items to different controller routes. If it is not, then you should probably use a collection of menuItem models:
var menuItem = Backbone.Model.extend({});
var menuList = Backbone.Collection.extend({
model: menuItem
});
var menu = new menuList([{name: "All To-Dos", url: "#!/all"}, {name: "index", url: "#!/index"}]);
which you can add or remove items to dynamically, as well as having the options built from the server specifications (i.e. the user may be able to save custom folders, which will get added here) use the refresh command to avoid unneccesary http calls. Then, you can pass this collection to your view, and render the items out however you want.
Hope this helps!

Resources