Appmaker Input Form, change options based on earlier dropdown choices - google-app-maker

Hypothetical:
Say i'm having someone order a cake and they choose vanilla or chocolate, and then they have to choose a frosting
if vanilla: strawberry or buttercream
if chocolate: mocha, dark chocolate or buttercream.
Right now the frosting value in the data model can accept all four options, so all four show up in the dropdown.
a) is there a way to change the binding for the second dropdown after the first is chosen?

This can be done without having the data saved in any datasource. Simply do the following...
Suppose the first dropdown is named primaryDropdown and the second dropdown is called secondaryDropdown. In the primaryDropdown options set the following:
["Vanilla", "Chocolate"]
Also, make sure to uncheck the option allowNull and on the onAttach event handler, place the following:
widget.value = "Vanilla";
Now we move on to the secondaryDropdown. Here, we will do a binding so place the following in the options value:
getAvailableOpts(#widget.root.descendants.primaryDropdown.value)
In the client script, we need to make sure that function exists so please paste the following in any client script:
function getAvailableOpts(primaryValue){
var options;
switch(primaryValue){
case "Vanilla":
options =["Strawberry","Buttercream"];
break;
case "Chocolate":
options = ["Mocha","Dark Chocolate","Buttercream"];
break;
default:
options = [];
}
return options;
}
From here, you are good; However we can still make it better. For that, make sure to also uncheck the allowNull option for the secondaryDropdown and then we need to add some logic in the onValueChange event handler of the primaryDropdown.
widget.root.descendants.secondaryDropdown.value = widget.root.descendants.secondaryDropdown.options[0];
References:
https://developers.google.com/appmaker/ui/input-widgets#dropdown
https://developers.google.com/appmaker/ui/binding#bindings
https://developers.google.com/appmaker/scripting/client#use_scripts_in_binding_expressions

Im guessing you set the dropdown "possible value" options in the data source and you have those fields as just string fields in your table.
the quick and dirty way to do this is go to the Cake drop down and on the Property Editor>Events>OnValueChange select Custom Action and use this Code
if(widget.value==="Vanilla"){
widget.root.descendants.Field.options = ['Strawberry','Buttercream'];
}else if (widget.value === "Chocolate"){
widget.root.descendants.Field.options = ['Mocha','Dark Chocolate','Buttercream'];
}
"Field" here is replaced with the name of the dropdown box for your frostings
also go to the property editor of the frostings dropdown and delete everything in the options field there.

I was trying to solve for a similar situation and created an additional table to serve as a lookup.
I have a drop down for CATEGORY with possible options set on the field in the main data source.
Then I have a second table with 2 Columns: CATEGORY, and SUB_CATEGORY.
On the entry form I have options for the SUB_CATEGORY drop down set to SUB_CATEGORY on the CATEGORY_MATRIX lookup table.
Then for an onValueEdit event on the CATEOGRY drop down I have a script to reload the CATEGORY_MATRIX table source based on the value of the CATEGORY drop down in the query so when the CATEGORY is selected only valid SUB_CATEGORY options are shown in the second drop down.
var datasource = app.datasources.CATEGORY_MATRIX
datasource.query.filters.CATEGORY._equals = newValue;
datasource.load();
There may be more efficient ways to do this but the benefit is I could create another form page and dynamically add new combos so there isn't any required code change as new combos are needed.

Related

Datasource Paging Issue (Revised Again)

See Datasource Paging Issue (Revised)
for the original question.
Markus, you were kind enough to help with out with the issue of incorporating a record count into a query using a calculated datasource. I have a search form with 15 widgets - a mix of date ranges, dropdowns, text values and ._contains, ._equals, ._greaterThanOrEquals, ._lessThanOrEquals, etc.
I have tested this extensively against mySQL SQL code and it works fine.
I have now added a 16th parameter PropertyNames, which is a list with binding #datasource.query.filters.Property.PropertyName._in and Options blank. The widget on the form is hidden because it is only used for additional filtering.
Logic such as the following is used, such that a particular logged-in user can only view their own properties. So if they perform a search and the Property is not specified we do:-
if (params.param_Property === null && canViewAllRecords === false) {
console.log(params.param_PropertyNames); // correct output
ds.filters.Property.PropertyName._in = params.param_PropertyNames;
}
The record count (records.length) is correct, and if I for loop through the array of records the record set is correct.
However, on the results page the table displays a larger resultset which omits the PropertyNames filter. So if I was to search on Status 'Open' (mySQL results 50) and then I add a single value ['Property Name London SW45'] for params.param_PropertyNames the record count is 6, the records array is 6 but the datasource display is 50. So the datasource is not filtering on the property array.
Initially I tried without adding the additional parameter and form widget and just using code such as
if (params.param_Property === null && canViewAllRecords === false) {
console.log(params.param_PropertyNames); // correct output
ds.filters.Property.PropertyName._in = properties; // an array of
properties to filter out
}
But this didn't work, hence the idea of adding a form widget and an additional parameter to the calculated recordcount datasource.
If I inspect at query.parameters then I see:-
"param_Status": "Open",
"param_PropertyNames": ["Property Name London SW45"],
If I inspect query.filters:-
name=param_Status, value=Open
name=param_PropertyNames, value=[]}]}
It looks as though the filter isn't set. Even hard coding
ds.filters.Property.PropertyName._in = ['Property Name London SW45'],
I get the same reuslt.
Have you got any idea what would be causing this issue and what I can do for a workaround ?
Using a server side solution I would suggest editing both your SQL datasource query script (server side) that is supposed to filter by this property list and including the same code in your server side script for your calculated Count datasource. The code would look something like this, not knowing your exact details:
var subquery = app.models.Directory.newQuery();
subquery.filters.PrimaryEmail._equals = Session.getActiveUser().getEmail();
subquery.prefetch.Property._add();
var results = subquery.run();
if(!results[0].CanViewAllRecords) {
query.filters.Property.PropertyName._in = results[0].Property.map(function(i) {return i.PropertyName;});
}
By adding this code you are filtering your directory by your current user and prefetching the Property relation table, then you set the filter only if your user canviewallRecords is false and use JS map function to create an array of the PropertyName field in the Property table. As I stated, your code may not be exactly the same depending on how you have to retrieve your user canviewallrecords property and then of course I don't know your relation between user and Property table either, is it one-to-many or other. But this should give you an idea how to implement this on server side.

Add grid columns dynamically

I created a form with a single data source: InventJournalTable.
I also added a grid on it and two field from the data source : JournalType and JournalId
The ActionPane has a button and in its clicked event handler I am trying to do the following:
1. add a new data source and join it with the current one on JournalId
2. add to fields from the newly added data source to the current Grid.
This is what I have until now ... just for testing.. I have tried to access data source and add a range. It works nice, maybe the join is working too, but how can I add those two fields?
void clicked()
{
Query query;
QueryBuildDataSource qbdsInventJournalTable;
QueryBuildDataSource qbdsvwInventJournals;
super();
query = InventJournalTable_ds.query();
qbdsInventJournalTable = query.dataSourceTable(tableNum(InventJournalTable));
qbdsInventJournalTable.addRange(fieldNum(InventJournalTable, JournalType)).value(queryValue(InventJournalType::LossProfit));
qbdsvwInventJournals = qbdsInventJournalTable.addDataSource(tableNum(vwInventAdjJrnlCostAmount));
qbdsvwInventJournals.addLink(fieldNum(InventJournalTable, JournalId), fieldNum(vwInventAdjJrnlCostAmount, JournalId));
qbdsvwInventJournals.joinMode(JoinMode::OuterJoin);
//gridOverview.addDataField(
InventJournalTable_ds.executeQuery();
}
One more thing, I plan to add another button named "Remove details" which will remove the second data source and the grid should return to its initial state.
Am I on the right track at least? Can I get some hints about this?
Instead of dynamically adding the datasource/fields/etc have you considered just adding them on the form, but disabling the joined datasource until you need it? Seems to me like a simpler/cleaner solution.
See here:
http://olondono.blogspot.com/2008/06/how-to-enable-or-disable-joined.html

NSTableView set column to disabled

I have a NSTableView tied to a NSArrayController. The first column are checkboxes. I want to have the users select the rows to perform an action on via the checkboxes and when the user clicks the "Run" button I want to set the state of that column to be un-editable.
How do I go about this?
Thanks!
rather than disabling the column I disable the individual checkbox cells in my app based on a global app state.
Preconditions:
1.) your "Run button" sets some sort of a global state in your controller class. For me its a "Play" button that sets a member in my controller like:
if ([self gotoNextSong])
_currentPlayMode = PLAYMODE_PLAY;
else
_currentPlayMode = PLAYMODE_STOP;
2.) Your controller is already a delegate to the NSTableView. If not:
In your MyController.h:
#interface MyController : NSObject <NSTableViewDelegate>
In your MyController.m make your controller to a delegate of the table - e.g. in your init: method
[self.myTableView setDelegate:self];
3.) You know the identifier of the column that holds the checkboxes. If not, either its the automatic name like column1, column2, ... or you can set it in Interface Builder while the column is active in Identity Inspector / Identity / Identifier. In my case the column name is "checkboxes"
Solution:
1.) Add a delegate method for the table to inform you when the cells are rendered. Inside this method enable or disable the cells of the checkbox-row as desired
- (void)tableView:(NSTableView *)aTableView willDisplayCell:(id)aCell forTableColumn: (NSTableColumn *)aTableColumn row:(int)rowIndex
{
if(([[aTableColumn identifier] isEqualToString:#"checkboxes"]))
{
if (_currentPlayMode == PLAYMODE_PLAY)
[aCell setEnabled:NO];
else
[aCell setEnabled:YES];
}
}
2.) Make sure that your RUN-button not only sets the global state (in my case _currentPlayMode), but also force the NSTableView to redraw afterwards:
[self.myTableView setNeedsDisplay:YES];

Pass records to a dialog

In a customised form I would have a create Purchase Menubutton which opens a dialog to create a purchase order.
But I need to select few records like one or two lines and then create purchase order only for those records. How do I do that?
Take a look on the "Create purchase order" button on the SalesTable form.
It works differently: you select the lines to purchase after you press the button, but it might work in your case also.
Also have a look on how to use multiple selected records in a grid.
Here is a piece of code which allows you to get the record from the previous form.
You have to put this piece of code in the INIT method of the dialog. So you have to override the init of the dialog.
DmoVehicleTable vehicleTable;
DmoVehicleId vehId;
// Get the vehicle ID from the previous form
if (element.args() && element.args().record())
{
switch (element.args().record().TableId)
{
case (tableNum(DmoVehicleTable)):
vehicleTable = element.args().record();
vehId = vehicleTable.VehicleId;
break;
default:
throw error (strFmt("#SYS477", this.name()));
}
}
I hope this will help you.
If you need more help: http://sirprogrammer.blogspot.com/

ASP.NET Dynamic Data setting the default value of a Dropdown list

I have a dropdown list (FK) which I would like to set and display a default value based on a login userid. Can you please tell me how to do it? I only want to affect the dropdown filter that appear at the top above the Gridview.
Thanks
Nikos
If you only want this functionality in the DropDown list that appears in the Filter Criteria section, just modify the URL by adding the QueryString parameters you would like to filter by. The DynamicFilter will pick up the values from the QueryString and set the DropDown lists accordingly. (fyi. this is the same functionality that the ForeignKey.ascx FieldTemplate provides)
It would be nice if there was a better way to actually create this URL (instead of using string), but as of right now, any solution I provide is probably going to break in a subsequent version.
example (in page_load)
Response.Redirect("~/Employees/List.aspx?ReportsTo=1234");
Is this a universal change, or just for one foreign key relationship?
Assuming it is for just one foreign key relationship, you could create a new FieldTemplate, to be used just for that relationship. The New FieldTemplate would be a copy of the default "ForeignKey" FieldTemplate. In the New FieldTemplate modify the OnDataBinding (or Page_PreRender) event to set the "default value" of the DropDownList.
Then, to force the New FieldTemplate to be used for that relationship, you would need to use the System.ComponentModel.DataAnnotations.UIHint attribute on the member of your Entity Class that represents that foreign key relationship. (links below)
http://msdn.microsoft.com/en-us/library/system.componentmodel.dataannotations.uihintattribute.uihint.aspx
or http://www.asp.net/learn/3.5-SP1/video-291.aspx (around 07:30 mins)
For a little help, you could take a look at the DynamicData Futures release on CodePlex. Specifically the "Populate Insert templates with values from filters" section. http://www.codeplex.com/aspnet/Release/ProjectReleases.aspx?ReleaseId=14475
I have figured out a workaround, but am open to a more elegant solution.
I edited the FilterUserControl.ascx.cs by inserting the following line in the Page_Init after PopulateListControl(DropDownList1);
DropDownList1.SelectedIndex = DropDownList1.Items.IndexOf(DropDownList1.Items.FindByText("Bob")); // Username is hardcoded just for test
This seems to work but I would prefer using the custom Partial Entity Class with metadata to solve this if possible.
I have solved this in an application I am working on, in your insert view template code behind:
In ItemCreated event for the details view:
foreach (DetailsViewRow row in DetailsView1.Rows)
{
foreach (Control ctl in row.Controls)
foreach (Control c in ctl.Controls)
foreach (Control x in c.Controls)
{
if (x.ClientID.Contains("tblName"))
{
foreach (Control y in x.Controls)
{
if (y.ClientID.Contains("DropDownList"))
{
ddl = y as DropDownList;
ddl.SelectedValue = Convert.ToString(UserId);
ddl.Enabled = false;
}
}
}
}
}
With this code, when a user is logged in and they go to insert some entity (tblName) the drop down list (fk to userId) is already selected and disabled.

Resources