I've got a page where I am using relations to pull in various items
Dropdown lets you select an employee
Second dropdown lets you pick a timeframe
The table then pulls items related to the employee + timeframe
The problem is that the loader disappears before the screen is refereshed with the data from #3.
I've tried binding the visibility of the loader to multiple datasources
widget.datasource.loading || second_datasource.loading || ...
but I'm struggling to get it to appear for the duration of the load. Is there anything I can do to have it appear until my client is fully updated? Do I need to be manually manipulating visibility with jQuery or is there is an App Maker binding I should be using?
At this time App Maker doesn't provide any global variable (something like #app.isBusy) that would help you to tackle the problem, there is also no easy way to discover all datasources being loaded... So, the answer will be: you need to thoroughly investigate your code to discover all things you are loading. One more trick that I can recommend is specifying datasources explicitly:
#app.datasources.DsOne.loading ||
#app.datasources.DsTwo.loading ||
#app.datasources.DsThree.loading ||
...
Related
I have an asp page that has a Treeview on it that is populated in code behind (so not data-bound). As I expand the nodes eventually the list of item becomes so big that after the postback, I lose where I was in the tree. So I've been looking into using client-side script to use scrollIntoView but all the examples of how to get the current selected node (the node I just expanded), seem to fail for me.
var elem = document.getElementById('navTree_SelectedNode');
alert(elem.value);
For me the .value is always null, as though no item has been selected. I've tried calling this code on the window.load and also by running a script from the code-behind. So I know there are lots of posts of this is how to do it, but I can't get an ID back of the item so I can then do a document.getElementById() on to then run the scrollIntoView. Maybe I'm trying to access the value too early/late and it's not been set, so where would the best place for me to check this be?
I've also tried accessing it with:
var test = document.getElementById('navTree_Data.selectedNodeID');
and still no luck.
Just a thought, selected is the item I have just clicked on to expand, not Checked as the nodes have check boxes?
Many thanks
The issue was being caused by the .SelectAction on my nodes being set to TreeNodeSelectAction.Expand when it should be set to .SelectExpand.
I have an AppMaker app that has a from based off of one address table/datasource. I can get a form with next/prev buttons, but replaced the key field (name) with a dropdown list of all names (a user can start typing names to jump there, with the dropdown showing).
My hope is that when a user selects from the dropdown, the entire form updates and the next/prev buttons work properly as well (there too many records to page thru with next/prev only). I don't have to have next/prev functionality if it complicates things too much.
Currently the dropdown is working, but I cannot get the index for the next/prev buttons set or the rest of the form to reflect the selected dropdown record.
I've tried to set the "onValueEdit" event to something like this...
var selected = widget.value;
var idx = widget.options.indexOf(selected);
console.log("Selected: "+selected+", index = "+idx+"\n");
if(idx < 0) { //...this error is never hit
console.log("Index error - setting to zero!\n");
idx = 0;
}
widget.datasource.loadPage(idx); //...update form?
Two observations via console logging:
The "idx" var is never set to the selected dropdown index reliably, and is
often "0" (tho no error msg ever shows), so the "indexOf()" function
isn't working as expected.
The "selected" var (name) is always correct.
If I call widget.datasource.loadPage(...) with a fixed value (say 5) it has no effect on what is shows in the form either (previous loaded data remains) - obviously not the way to do it :v/
Can you steer a noob in the right direction?
If you are using default App Maker form, then you can see that so-called pager, doesn't actually paginate. It triggers prevItem/nextItem datasource methods, in other words it navigates through datasource items, not pages. Here is a quote from App Maker docs:
nextItem: Selects the next item. For Query Datasources, if the current item is the last item on the page, then this loads the next page and selects the first item on the newly loaded page.
So, if you already have all your items loaded(you set query page size for your datasource to 0), then you need just to change selected item within datasource:
// onValueEdit dropdown event
// assuming, that form and dropdown share same datasource
widget.datasource.selectKey(newValue._key);
If you really have lots of items and it is not feasible to load all of them in one call... then it will be all another story...
UPDATE:
It's important that Options and Value are set as shown in the image below!
However, I had trouble setting them that way (read: wasted hours!) until I wiped them both completely using More options in the binding picklist, and tried again (I had even tried on a brand new app!). I was being forced to choose ..projections.. and then a final field before the OK button would be available.
Not sure if AppMaker is buggy here or there is something simple I'm not understanding!
None of the coding in my original question is required.
Once set this way, binding just works as you would expect it!!
All other fields are set as #datasource.item. and are bound to whatever item is chosen. No Events settings are necessary for the dropdown either, as I thought they might be.
I deleted this page and started again, and replaced the default business name data field with a drop down, I set the dropdown as:
Options: #datasources.Addresses.items
Value: #datasources.Addresses.item
It works fine?! Not sure what happend in my original page!
UPDATE:
So it seems you need to delete both the Value and Options and then re-enter these. The OK will light up when you do.
Also, my original take on App Maker was to build the UI and attach data. That was my first mistake. You build the data then have App Maker build edit/add pages for you.
I seem to be struggling with this. I am working on a project management app in Google App Maker. I am using SQL data models. The portion of the app I am having trouble with is several project detail pages linked with a project list page. I have no trouble going from the project list page to the first project detail page.
I have a table widget in the project list page, and the onClick code for a table row is:
app.datasources.Projects.selectKey(widget.datasource.item._key);
app.showPage(app.pages.ProjectPage);
This filters the first detail page with the primary key of the record in focus. No problem here. When I want to navigate the next detail page that has a different datasource (but I still need to filter using the same primary key) I am struggling.
If someone can guide me in making a button in the first detail page that when clicked gets the _key of the project loaded in that current page and filters another detail page for the same project in focus, (using another data model, let's call it ProjectBudgetPage for example) I would really appreciate the help.
This was one my latest attempts at navigation to other detail pages within a project, this was for an onClick event:
var widgets = widget.parent.descendants;
var projectID = widgets.HiddenProjectID.text;
var projectDataSource = app.datasources.ProjectBudgetView.item;
projectDataSource = projectID;
app.showPage(app.pages.ProjectInfoPage);
which results in: (TypeError) : Cannot read property '__gwt_instance' of undefined
at HeaderProjectTabs.HeaderContainer.InfoTabButton.onClick:5:5
I am not sure if I understood properly but I suggest that you start by checking this official App Maker template available here https://developers.google.com/appmaker/templates/partner-management/ which provides a ready-to-run app you can use to manage an internal list of partners, but you can also customize it with your own needs. I recently used most of the UI and logic of this template and I was able to integrate it with SQL data models and it works really great.
I noticed that for this template they are saving the (widget.datasource.item._key) to a Page custom property which you can access afterwards. Custom properties are page-level properties that store data for a single user session. Custom properties are useful when you need to bind properties of multiple widgets to a single value. More info available here https://developers.google.com/appmaker/ui/binding#custom_properties
In your scenario, you can create a new custom property (string) inside your ProjectInfoPage and then you can add a script to the button onClick event in your ProjectPage to save the _key or any other item to a page property. For example:
app.pages.ProjectInfoPage.properties.ProjectKey = widget.datasource.item._key;
app.showDialog(app.pages.ProjectInfoPage);
Then you can get the “ProjectKey” property by adding this to the onAttach event in your ProjectInfoPage:
var key = app.pages.ProjectInfoPage.properties.ProjectKey;
…
In the onAttach event you can filter the new model or pass the property values to a server script. I believe there are other approaches but I hope this helps!
This question already has an answer here:
Closed 10 years ago.
In a page inside the insert component popup window. When a user is trying to Select a component and a Template then how to *restrict them to select the same combination of component and template * that is already present in the component list.
I thought of writing a javascript on insert button.Please suggest if i am going in right way.
As Bart says above your question is amazingly vague, but here is an attempt at an answer as i've just done something similar. Given the vagueness, i'm assuming that you're knee deep in JS code and what I'm putting here will make sense to you :)
In your javascript you'll likely store the selected component presentation in a property as your user clicks on a given cp in the list, for example:
// keeps stock of the current selected component presentation
p.selectedComponentPresentation;
to use simply:
var componentPresentation = p.selectedComponentPresentation;
and to set you can see i get the tab control first, store the component presentationTab and from there call the getSelectedComponentPresentation():
var masterTabControl = $controls.getControl($("#MasterTabControl"),
"Tridion.Controls.TabControl");
p.compPresTab = masterTabControl.getPage("ComponentPresentationsTab");
p.selectedComponentPresentation
= p.compPresTab.getSelectedComponentPresentation();
Again I do hope this makes sense, I'm also assuming by now you'll know how to get the pageId
If you're in a Component popup window, you can get the ID of the Component through
$display.getItem().getId()
This will actually work in any Item edit popup (so Pages and other item types too).
It will not work in the main Dashboard view (so where you see the tree on the left and the list on the right), since there you don't have a single "current item".
You will have to update your question with information as to where your code is running, because that is unclear to me now. As far as I know there is no place in the Web GUI where you have both a "current Component" and a "current Page".
I`m really new to Flex and ActionScript so please be patient with me.
I want to implement this script: tinyurl.com/yafqrqb
...that is doing this "magic" : tinyurl.com/y9qg32r
...but I want to tweak it a little on InfoWindowTabbedComponent. To be more precisely I`m trying to insert links in that tabs, and when you click one the state will change.
You can see my custom InfoWindowTabbedComponent at the end of the post As you can see, right now I have 2 functions that open url`s.
What I`m trying to do is to change this:
var adobeURL:URLRequest = new URLRequest("http://www.microsoft.com" );
navigateToURL(adobeURL, "_self");
Into something that change the current state.
Can you please help me?
Here`s my custom InfoWindowTabbedComponent: http://pastebin.com/f387bc3b9
I'm not sure I understand what you want to do. If you just want to set the selected Tab, instead of calling navigateToURL() set myTabNavigator.selectedIndex (or selectedChild)
If you really want to change the state, each component has a currentState property, but then you would have to define the states first (via the tag)
And if you really want to navigateToURL() you could navigate to javascript:somefunction() and then set the application state via ExternalInterface, but that would be horribly circumstantial.
Cheers,
Jörg