Change single itemtpl record on Sencha Touch List - sencha-touch-2

how can I change single itemtpl at itemtap event in Sencha Touch 2?
I would like to change HTML record's code when I click on item.
If I try to do this with setItemTpl() method on dataview it changes all list's records.
Thanks

On "itemtap" event, you can find the target from params. And then get the target element
var target = Ext.get(target);
then apply, setHtml() function there and do what you want.

Related

Render a DetailsList component with all items preselected

I want to render a DetailsList with all items in that list preselected. I pass a Selection prop to the DetailsList, but calling setAllSelected() on the Selection from the component's constructor won't render all items as selected.
Though, calling setAllSelected() from an event handler would select all items as expected.
I have tried to call setAllSelected() from componentDidMount(), but without success.
I suppose items must be internally created (wrt the DetailsList component) before the Selection can select them, but I have no idea how to force this.
I have added a CodePen.
You need to set the items on the selection first like so:
this._selection.setItems(this.state.items, false)
I adjusted your codepen here to demo this. Hope this helps.

Spinner on clicking an item in DetailsList

How do I show a spinner in a DetailsList? For instance, let's say I have the following items in a DetailsList:
list of items
On clicking the item with the name 'AdipiscingUt.onetoc', show a spinner on the rightmost side of that item (next to 125 KB). Please let me know if you have any suggestions on the same.
Thanks!
You can use selection attribute in <DetailsList> component to catch the selection events. Then create extra column with hidden spinner and display it via selection event.
At least I had the experience when I needed to display the icon status according to each item. I added unique id per each item (using onRender method for columns attribute in <DetailsList>) and use it for identification.

Programatically move layout element to another layout element on Windows Phone

If I e.g. have a Grid with 2 rows, in the first row is a TextBox and in the 2nd. an Image: is it possible on Windows Phone to programatically move the textBox to the 2nd row. My intention is to be able to move elements around.
Let me know if I'm not clear enough.
You can do it this way to move to a different row in same Grid:
yourTextBox.SetValue(Grid.RowProperty, 1);
The first parameter is the DependencyProperty you want to set, the second is the value to set.
To move between different containers, remove it from Children elemento of the source container to add to the Children element of the target container. e.g:
yourSourceContainer.Children.Remove(yourTextBox);
yourTargetContainer.Children.Add(yourTextBox);
Make sure you remove it from the old container first or it will throw an exception.
private void SwapContainers(UIElement element, Panel source, Panel destination)
{
source.Children.Remove(element);
destination.Children.Add(element);
}
If you want to move things around in the same grid, you can use SetRow or SetColumn:
Grid.SetRow(myElement1, 2);
Grid.SetRow(myElement2, 1);

In ExtJS dataview single select mode how can I clear item selection

I want to clear dataview item when it lost focus, mean when user click somewhere else x-item-selected class is removed from current selected item.
you can use
dataview.getSelectionModel().deselectAll();
to remove the selection

Sencha Touch radiofield value

I am trying to get the values of form elements in sencha touch. I am using
fields= form.getFields();
var name = fields["name"].getValue();
This is working for most of my fields, but not for my radio button field.
I am using two radio fields with the same name of 'gender' that have values of male or female. I tried the above code for this field, but I get an error that the radiofield has no method getValue(). However, in the sencha touch documentation under Ext.form.radio it says that radio does have the method. What is the correct way to get the value of a radio group?
Try
var fields = form.getValues();
console.log(fields['name']);