How to dynamically change the list data when click on picker 'done' button in Sencha Touch - list

I am developing my application in Sencha touch. In that I have a list and Picker and I want to update the list data dynamically when selecting the picker i.e., I want to add data to list dynamically when tap on 'Done' button of Picker. I used some logic for this but this doesn't update the list content.
listeners: {
change: function(picker,value) {
textValue = picker.getValue()['name'];
var me = this,
nameList = this.down('#namesList');
nameList.add({fullname:textValue}) ;
}
}
When I update like this, it throws me the error that 'Uncaught TypeError: Cannot call method 'add' of null' eventhough 'namesList' is already defined. Please show me the way to solve this problem.

I would add a record to the data/store of the list, and then capture the list and refresh.
The issue there is that nameList isnt actually the list component.
Try adding for example an id to the list, and then in the picker change listener:
Ext.getCmp('mylist-id').refresh()
Hope it helps.

Related

Attachments moved away from Item after validation and before submit process in Apex

I have multiple File Browser Item fields on one page of Application in Oracle Apex.
What happens: When I miss any Item for which validation error fires, I want to hold that file to the browser but I usually loose it if I get that validation error. Is there a solution for the same like other Items fields hold previous value except File Browser Item field. Please see below ss:
Anshul,
APEX 4.2 is very old and no longer supported. A later (or preferably latest) version of APEX will behave differently as Dan explained above.
Can you import your application into apex.oracle.com (which is running APEX 20.1) and you will probably see better results. Based on this you can hopefully use it as justification to upgrade your environment.
Regards,
David
Go to your page-level attributes and a function like the following in the Function and Global Variable Declaration:
function validateItems(request) {
var $file1 = $('#P68_FILE_1');
var $file2 = $('#P68_FILE_2');
var errorsFound = false;
if ($file1.val() === '') {
errorsFound = true;
// Show item in error state
}
if ($file2.val() === '') {
errorsFound = true;
// Show item in error state
}
if (!errorsFound) {
// I think doSubmit was the name of the function back then. If not, try apex.submit
doSubmit(request);
} else {
// Show error message at top of page, I'll use a generic alert for now
alert('You must select a file for each file selector.');
}
}
Then, right-click the Create button and select Create a Dynamic Action. Set the name of the Dynamic Action to Create button clicked.
For the Action, set Type to Execute JavaScript Code. Enter the following JS in code:
validateItems('CREATE');
Finally, ensure that Fire on Initialization is disabled.
Repeat the process for the Save button, but change the request value passed to validateItems to SAVE.

Flex Change List Item Selected While Mouse Down

I am trying to create a List which behaves like, for example, the Finder Menu on my Mac. In other words if I click on a List Item, keep my mouse down and move up and down the List I want the Selected Item to change.
In my Flex application if I click on my List and then, with the mouse still down, move up and down the List the Selected Item remains the same.
Any advice would be gratefully received.
Thanks
In StackOverflow tradition I am posting a solution to my own problem after working at it more:
I had an ItemRenderer on my List. In the ItemRenderer I declared a variable to hold a reference to the owning List.
private var _parentList:List;
In the 'set data' function I set this variable to the owner List.
override public function set data(value:Object):void {
super.data = value;
// Check to see if the data property is null.
if (value == null)
return;
// If the data property is not null.
// Get a reference to the parent list.
_parentList = this.owner as List;
...
I then added an EventListener to listen for MouseDown events.
// Attach an eventListener to the ItemRenderer.
this.addEventListener(MouseEvent.MOUSE_OVER, onMouseOver);
...
My onMouseOver handler looks like this.
private function onMouseOver(event:MouseEvent):void {
//trace(data.LocationName);
if (event.buttonDown == true) {
_parentList.selectedIndex = itemIndex;
}
}
So with this in place I can mouse-down on my List and keeping the mouse button depressed move up and down the List with the List Item beneath the cursor always being selected. The final piece to this is to ensure that the List responds to the selectedIndex being set by the ItemRenderer. When the user changes the selectedIndex property by interacting with the control, the control dispatches the change and changing events. When you change the value of the selectedIndex property programmatically, it dispatches the valueCommit event. To ensure I responded to my programmatic changing of the selected list item I added a handler to the valueCommit event.
<s:List
id="locationsList"
dataProvider="{presenter.locations}"
itemRenderer="itemrenderers.locationListItemRenderer"
useVirtualLayout="false"
width="1869.698" height="1869.698"
y="65.151" x="65.151"
borderVisible="true"
borderColor="{presenter.backgroundColour}"
contentBackgroundAlpha="0"
contentBackgroundColor="0xff336c"
labelField="label"
change="presenter.onLocationListChange(event)"
valueCommit="presenter.onLocationListValueCommit(event)">
<s:layout>
<s:BasicLayout />
</s:layout>
</s:List>
So far it seems to work fine. Hope it helps.

how to know if grid or list view is active with custom magento page

I have a custom product list page and i´m using the following code to show the pagenumbering and filters:
$pager = $this->getLayout()->createBlock('page/html_pager');
echo $this->getLayout()->createBlock('catalog/product_list_toolbar')->setChild('product_list_toolbar_pager', $pager)->setCollection($products)->toHtml();
If i'm changing the mode from grid to list view nothing happens.
How can i get the active mode (grid or list).
Magento normaly uses $this->getMode() but this one doesnt work.
I have fixed it with the following code:
$mode = $this->getLayout()->createBlock('catalog/product_list_toolbar')->setChild('product_list_toolbar_pager', $pager)->getCurrentMode();
Another solution,
if(Mage::getSingleton('catalog/session')->getDisplayMode())
{
$productListMode=Mage::getSingleton('catalog/session')->getDisplayMode();
}

Flex How can I change item in dataProvider when Items is selected or deselected in the mx:List

Flex How can I change item in dataProvider when Items(multiple selection) is selected or deselected in the mx:List
I just want my data reflect what items I selected in the list dynamically. Base on that do some sorting with the list, for example make selected items first in the list when they are selected, and go back to original place when items are deselected....
You can use the IViewCursor to get/add/remove items of the list.
Below is a code example of how to create the cursor, based on that you will just need to apply the logic you need.
var col:ICollectionView = ICollectionView(list.dataProvider);
var myCursor:IViewCursor = col.createCursor();
//do the logic using the myCursor functions
...
//refresh the collection to the changes reflect in the list
col.refresh();
Here you can check some more info about it.
You can add an event listener to your list so that whenever a selection/deselection occurs it triggers.
<s:List id="myList"
labelField="firstName"
change="selectionChangedHandler(event)"
dataProvider="{peopleArray}">
</s:List>
....
protected function selectionChangedHandler(event:IndexChangeEvent):void
{
var currentIndx:int = event.currentTarget.selectedIndex;
var currentDataItem:Object = event.currentTarget.selectedItem;
peopleArray.removeItemAt(currentIndx);
peopleArray.addItemAt(currentDataItem,0);
peopleArray.refresh();
}
I haven't run it but you may need to set selection on refreshed list too.

Animation on sencha touch 2 list item

I have a list extending Ext.dataview.List.
I would like to play an animation in only one of the list items.
If it is triggered by the itemTap, it is easy, because the callback provides a third argument, I just run the animation on it. (I mean Ext.Anim.run).
But what if I need to animate the n-th element independently from the list, like triggered by a user tap on a separate button?
Thanks
Let's say you have a list which has the following config :
xtype:'list',
cls: 'myList',
...
Then you can access its DOM element with :
var items = Ext.DomQuery.select('.myList .x-list-item');
It will returns all the items of the list with the cls 'myList' so be sure to have only one list with this class.
From there you can do whatever you want with it like hiding the second item :
items[1].style.display = 'none';
Hope this helped