I've binded the same function to all elements that I want(let's say View and Label).
In this onClick handler function I want to get the element which was clicked and increase its 'top' by 1.
Please tell me if you know how to do that, I can't find an answer yet.
My global click handler function:
function increaseElementTop(e) {
// Here we should increase element's top position.
Ti.API.info(JSON.stringify(e));
}
Thanks, any help is appreciated.
Get the e.source attribute from the Event e. Then use the setTop() method.
if (e.source == $.yourLabel) {
$.yourLabel.setTop($.yourLabel.getTop() + 1)
}
UPDATE: Regarding your comment: I thought it would only be used for two elements. A universal approach would be something like this:
e.source.setTop(e.source.getTop() + 1);
Unfortunately I have no machine available to test the code but I will do so later (Tuesday I guess). Just try it and let your programm print the e.source variable. If this does not work you can also try to use e.source.getId().
function increaseElementTop(e) {
var theUIElement = e.source;
theUIElement.top = theUIElement.top + 1;
}
Add the event listener to each of your UIElements, and this will get the element you click on & modify the top.
Related
I have a flyout that appears near the cursor when a particular user input is triggered.
According to the docs, the Flyout.Placement property is only a preference and does not necessarily reflect the position of the flyout.
I expect the framework to call GetFlyoutPlacement to determine the actual placement. I want to know what the actual placement is so that I can add a little arrow pointing at the cursor position, something like shown in the following:
Is my only option to make the call to GetFlyoutPlacement myself (triggered on the Flyout.Opening event), or is there some more convenient way to do this?
My calls on GetFlyoutPlacement and GetFlyoutPlacementTargetInfo resulted in Error HRESULT E_FAIL has been returned from a call to a COM component. which didn't leave me very much to go on, so I just ended up implementing what I imagine is the logic behind those functions:
public static FlyoutPlacementMode GetActualFlyoutPlacement(
Rect placementTarget,
Size flyoutSize,
FlyoutPlacementMode preferredPlacement )
{
Rect ViewArea = Window.Current.Bounds;
ViewArea.X = 0; // may have non-zero offset for multi-monitor setups
ViewArea.Y = 0; // but we are only interested in offset relative to app view area
switch (preferredPlacement)
{
case FlyoutPlacementMode.Right:
if (desiredSize.Width < ViewArea.Width - placementTarget.Right) return FlyoutPlacementMode.Right;
if (desiredSize.Width < placementTarget.Left) return FlyoutPlacementMode.Left;
if (desiredSize.Height < placementTarget.Top) return FlyoutPlacementMode.Top;
return FlyoutPlacementMode.Bottom;
case FlyoutPlacementMode.Left:
...
}
}
Checkout the approach I suggested here. I believe it is better, because instead of guessing the internal placement algorithm it just compares the absolute coordinates of the flyout and the target element.
I need to create a custom back button for a nestedlist. In my controller I have created a listener to capture the button tap event as follows:
onCustomButtonBackTap: function(button, e, options) {
this.getMyList().setDepth(node.data.depth-1); <-- seudo code, does not work
},
My question is how can I set the current level of my nestedlist back by one each time the custom button is clicked? Also, if this approach is not correct, please let me know
Thanks is advance for your help and advice
First you need to get the current active item to set the new one... you need to use the methods in my sample code below to accomplish what you are looking for:
var newIndex = this.getMyList().getActiveItem();
this.getMyList().setActiveItem(newIndex-1);
#Jeff, thank you for your answer but I found the following method which works better in my circumstance
onCustomButtonBackTap: function(button, e, options) {
if (this.getMyList().items.indexOf(this.getMyList().getActiveItem()) > 0) {
this.getMyList().onBackTap();
}
},
Here's my problem: in my application I have a Dojo EnhancedGrid, backed up by an ItemFileReadStore. The page flow looks like this:
The user selects a value from a selection list.
The item from the list is posted on a server and then the grid is updated with data from the server (don't ask why, this is how it's supposed to work)
The new item is highlighted in the grid.
Now, the first two steps work like a charm; however, the third step gave me some headaches. After the data is successfully POSTed to the server (via dojo.xhrPost() ) the following code runs:
myGrid.store.close();
myGrid._refresh();
myGrid.store.fetch({
onComplete : function(items) {
for ( var i = 0; i < items.length; i++) {
if (items[i].documentType[0].id == documentTypeId) {
var newItemIndex = myGrid.getItemIndex(items[i]);
exportMappingGrid.selection.deselectAll();
exportMappingGrid.selection.addToSelection(newItemIndex);
}
}
}
});
Now, the selection of the grid is updated (i.e. the selection object has a selectedIndex > 0), but visually there's no response, unless I hover the mouse over the "selected" row. If I remove the .deselectAll() line (which I suspected as the culprit) then I sometimes end up with two items selected at once, although the grid selectionMode attribute is set to single.
Any thoughts on this one?
Thanks a lot.
You need to use setSelected(), like so
exportMappingGrid.selection.setSelected(newItemIndex, true);
The second parameter is true to select the row, false to unselect it.
This is what works for me:
grid.selection.clear();
grid.selection.addToSelection(newItemIndex);
grid.selection.getFirstSelected();
Jon
can anyone please explain, with an example if possible, how to load dynamic content inside an iscroll div and assign a new height to it?
I can get it to work but I can't control the height of the scroll for the new content.
I'm new to all this and have no clue were to start.
here's what I'm working on:
http://homepage.mac.com/jjco/test/index7.html
when the page is loaded you see the scroll bar where there's no content...
clicking on print/damm (shows the height I originally set for this content)
clicking on print/fcbarcelona (maintains the same height and position of the scroll you used before) as you see it's not working as it should.
obviously, I don't want the scroll to be there when it's not necessary.
any help would be greatly appreciated.
It's better to use the refresh() method in iScroll, which will recalculate the height.
myScroll.refresh();
I had a similar problem, and just refresh() didn't help, so didn't help destroying and recreating iScroll. In my case I was loading a lot of elements into iScroll div. What did solve the problem is setTimeout(). As MASTERING THE REFRESH() METHOD said adding even 0ms to a setTimeout() would solve a lot of problems. In my case it was 500ms. =
here is code sample:
var myScroll;
function createIScroll(){
myScroll = new iScroll('wrapper');
}
function iScrollRefresh(){
setTimeout(function(){
myScroll.refresh();
}, 500);
}
$ajax(){
//receiving data
}
function someFunction(){
//dynamic content is created
iScrollRefresh();
}
My problem was that refresh() function was executed before content was inserted into DOM, so increasing timeout helped. I hope it helps to beginners like me.
try this, when you insert your new data into iScroll do these steps
//myScroll is a global variable you initialize iScroll on
myScroll.destroy();
myScroll = null;
loaded();//this is a functions where you have have your iScroll initializer
To watch height changes:
setInterval(function () {
var newScrollerHeight = $scroller.innerHeight();
if (newScrollerHeight !== prevScrollerHeight) {
prevScrollerHeight = newScrollerHeight;
myScroll.refresh();
}
}, 500);
Take a look at iScroll4
In iscroll.js, I see experimental option: checkDOMChanges: false,// Experimental You can enable and use it.
I have created an image map with flash, I have separate button functions that display rollover and onpress functions for each region ie -
nw_btn.onRollOver = function() {
areaName_txt.text = "This Site (NWPHO)";
}
nw_btn.onPress = function() {
displayOverlay(areaName_txt.text);
}
This is repeated 15 times to cover each area button - I wondered whether there was a way to apply the same function call (displayOverlay) and apply area name text on rollover via one piece of code rather than repeating for each button?
I guess there must be a mistake with your tag, because what you describe look more like an AS2 structure.
But if you really are in AS3, here is what you can do : connect everything to a same function with addEventListener. In this function, test which button is at the source of the event, then put the code to be executed for each button.