I have used the SideDrawer example and have a series of dropdown's on my SideDrawer. After the last selection I need to display details on the underlying page, in this case the homepage. How do I update the underlying page as a result of my selections.
Don't know where to start.
exports.installationIndexChanged = function (args){
const drawerComponent = args.object;
const sideDrawer = app.getRootView();
var context = sideDrawer.bindingContext;
var installation = drawerComponent.items[args.newIndex];
console.log(installation);
var installDD = drawerComponent.getViewById("installation");
var selectedInstall = installDD.selectedIndex;
appSettings.setNumber("id",(installDD.get("items").getValue(selectedInstall)));
}
the last line in the code above gets the ID of the record I need to display. I'm not sure if I can address the underlying page at this point, or need to know when the sidedrawer closes, display the record then. My preference would be to keep the sidedrawer open and display the record on the homepage first. The user can then close the sidedrawer to view the complete record.
Related
I have a kendo grid, in which I have selected filter on one column, I am reloading the grid, I want the same filter to be there when grid reloads.
I am using the below code to reload the grid. It works, but it doesn't show the selected filter item checked. I checked IDR in the filter then reloaded the page, it shows 1 item selected but doesn't show IDR as checked.
function ReloadGrid() {
var grid = $('#gridId').data('kendoGrid');
grid.dataSource.read();
grid.setDataSource(grid.dataSource);
}
Well there is two way to achieve this.
One way is to save filters in database and second one is to use local storage as mentioned in comment.
I prefer second one, using local storage to save filters and load it upon read.
#GaloisGirl is pointing you in right direction.
Check this example again: Persist state
Basic usage of locale storage is to save some data under some name (key,value):
let person = {
name: 'foo',
lastName: 'bar'
};
let save = function (person) {
let personString = JSON.stringify(person);
localStorage.setItem('person', personString);
console.log('Storing person: ', personString);
};
let load = function () {
let personString = localStorage.getItem('person'); // <----string
let person = JSON.parse(personString); // <----object
console.log('Stored person: ', person);
};
let remove = function (name) {
localStorage.removeItem(name);
console.log('Removed from local storage!');
};
save(person);
load();
remove(person.name);
In kendo world you need to save current options state of grid in local storage, you can achieve that by adding button like in example or on the fly with change or with window.onbeforeunload or like in your example beforen reload grid.
You can check saved data under application tab in browsers, eg. chrome:
Hope it helps, gl!
Using Nightwatch's Page Object capability, I have all the elements of a page defined as well as its URL. After navigating to the page (e.g., page.navigate()), the code waits for the one of the elements to be visible and then records the values of several elements before clicking on another element that leaves the page. I want to ensure that the page is no longer displayed by waiting for that same element to not be displayed, but that second wait always times out and I'm forced to look for an element that's not on that page to verify I've left the page. For example,
module.exports.command = function (settings)
{ var page = this.page.settings()
page.navigate()
.waitForElementVisible('#firstName',3000)
.getValue('#firstName', function(r) {settings.firstName = r.value})
.getValue('#lastName', function(r) {settings.lastName = r.value})
.waitForElementVisible('#firstName',3000)
.click('#dashboard')
.waitForElementNotVisible('#firstName',3000) // this times out
this.verify.visible('#AvailableProcedures') // but this works
}
My question is: does a page object become invalid once the page is no longer displayed?
'Leaves the page',does that mean navigate to another url ? If yes,you should check the element is 'present or not', instead of 'visible or not'
module.exports.command = function (settings)
{ var page = this.page.settings()
page.navigate()
.waitForElementVisible('#firstName',3000)
.getValue('#firstName', function(r) {settings.firstName = r.value})
.getValue('#lastName', function(r) {settings.lastName = r.value})
.waitForElementVisible('#firstName',3000)
.click('#dashboard')
.waitForElementNotPresent('#firstName',3000,false,
function(),'Element is not there');
}
E.g , when i try to login:
loginPage = client.page.login();
loginPage
.navigate()
.waitForElementVisible('#username',5000,false)
.setValue('#username',username)
.setValue('#password',password)
.click('#submit')
.waitForElementNotPresent('#username,5000,false)
How can I get the current screen I'm working on? For example, I have a slidedrawer containing buttons to navigate to another page. When I'm on a certain page(About Page) and when I tap the button to navigate to the About Page, I want to just close the slidedrawer if it is on the same page.
My idea is that to get the current page and just compare it but I dont know how.
Note: The slidedrawer content menu is a custom component.
There are several ways to solve this problem. The easiest is to install the nativescript-dom plugin and then you can do this really simply:
// This will return an array of elements that are SlideDrawer's.
var slideDrawers = getElementsByTagName('SlideDrawer');
or even better is if you have assigned your SlideDrawer an id, you can do
<!-- Declarative XML -->
<SlideDrawer id="myId">...</SlideDrawer>
// JS: Will return a single element that matching the id.
var mySlideDrawer = getElementById('myId');
However, if you just want to not use any helpers and you want to get direct access to the currentPage the method is to do:
var frame = require('ui/frame');
var myPage = frame.topmost().currentPage;
Please note; the currentPage will reflect the old page while navigation is taking effect until the navigatedTo event is fired, at that point the currentPage is actually updated to be the currentPage. However, if you are looking for the current page during any of the navigation events (NavigatingTo, NavigatedTo, Loaded, Unloaded) each of those events are transferred a parameter with the current page as part of the object.
exports.onNavigatedTo = function(args) {
var page = args.object;
// do what you want with the current page variable
}
I can't figure out how to programatically add a view into a layout or page.
I need to add views at runtime without using static xml declaration since i need to fetch them from an http requested object... . I didn't find useful informations in the docs.
Anyone knows how to do?
I think you meant to dynamically add some view / controls to the page rather than to navigate into another page.
If so, you just need to add some controls into one of the layouts in your page (only containers [=layouts] can have multiple children.
so, your code (viewmodel/page controller) would look something like:
var layout = page.getViewById("Mycontainer");
// create dynamic content
var label = new Label();
label.text = "dynamic";
// connect to live view
layout.addChild(label)
In addition to having a page included inside your app (normal); you download the xml, css, & js to another directory and then navigate to it by then doing something like page.navigate('downloaded/page-name');
you can also do
var factoryFunc = function () {
var label = new labelModule.Label();
label.text = "Hello, world!";
var page = new pagesModule.Page();
page.content = label;
return page;
};
topmost.navigate(factoryFunc);
https://docs.nativescript.org/navigation#navigate-with-factory-function
You should check out this thread on the {N} forum.
The question is about dynamically loading a page and module from a remote server. The (possible) solution is given in this thread.
I'm trying to replicate the code from this page. When I deploy as web app, it brings up the user interface with the input boxes and submit button. However, when I click submit, it brings up this error message: "please select an active sheet first". When I bring up the UI in the spreadsheet itself, I get the same error. Instead of using openById I changed it to getActive.getSheetByName and it worked from the spreadsheet. However, going back to the web app, the new error message is now "Cannot call getSheetByName of null."
Can anyone suggest why I'm getting the "please select an active sheet first" error and what I need to do differently?
Here's the code I've copied, the only change I made was to put my SS key in the two appropriate places.
function doGet(e) {
var doc = SpreadsheetApp.openById("yyyy"); //I've got my SS key here
var app = UiApp.createApplication().setTitle('New app');
// Create a grid with 3 text boxes and corresponding labels
var grid = app.createGrid(3, 2);
grid.setWidget(0, 0, app.createLabel('Name:'));
// Text entered in the text box is passed in to userName
// The setName method will make those widgets available by
// the given name to the server handlers later
grid.setWidget(0, 1, app.createTextBox().setName('userName'));
grid.setWidget(1, 0, app.createLabel('Age:'));
grid.setWidget(1, 1, app.createTextBox().setName('age'));
// Text entered in the text box is passed in to age
grid.setWidget(2, 0, app.createLabel('City'));
grid.setWidget(2, 1, app.createTextBox().setName('city'));
// Text entered in the text box is passed in to city.
// Create a vertical panel..
var panel = app.createVerticalPanel();
// ...and add the grid to the panel
panel.add(grid);
// Create a button and click handler; pass in the grid object as a callback element and the handler as a click handler
// Identify the function b as the server click handler
var button = app.createButton('submit');
var handler = app.createServerHandler('b');
handler.addCallbackElement(grid);
button.addClickHandler(handler);
// Add the button to the panel and the panel to the application, then display the application app
panel.add(button);
app.add(panel);
return app;
}
// Function that records the values in a Spreadsheet
function b(e) {
var doc = SpreadsheetApp.openById("yyyy"); //I've got my SS key here
var lastRow = doc.getLastRow(); // Determine the last row in the Spreadsheet that contains any values
var cell = doc.getRange('a1').offset(lastRow, 0); // determine the next free cell in column A
// You can access e.parameter.userName because you used setName('userName') above and
// also added the grid containing those widgets as a callback element to the server
// handler.
cell.setValue(e.parameter.userName); // Set the value of the cell to userName
cell.offset(0, 1).setValue(e.parameter.age); // Set the value of the adjacent cell to age
cell.offset(0, 2).setValue(e.parameter.city); // set the value of the next cell to city
// Clean up - get the UiInstance object, close it, and return
var app = UiApp.getActiveApplication();
app.close();
// The following line is REQUIRED for the widget to actually close.
return app;
}
Thanks!
You are opening the spreadsheet and should open the sheet in the spreadsheet
sheet = doc.getSheetByName("sheet name")
The documentation