Making Accordion more "tablet-friendly" through tab-key

[Deanna Delapasse]

I have a sample attached where I create some controls for a listView inside an Accordion.  The fieldnames end in the value of the tabIndex, but we have tried many combinations and can not get the fields to tab through in the correct order. 

Issues

1) If a section is closed, tabbing into it should open it.  That doesn't seem to happen by default - can we configure it somehow to open if any of the inner controls have focus?

2) When  new section is opened we want it to scroll up to the top of the view.  We tried setting ScrollViewer.BringIntoViewOnFocusChange="True", but that didn't help.  Is there some other way to scroll the newly opened section up into the center or top of the Accordion?

Attachment: Accordion_65a2b33d.zip

[Venkateshwaran Ramdoss]

Hi Deanna,

Thank you for contacting Syncfusion Support.

Query #1:" If a section is closed, tabbing into it should open it. That doesn't seem to happen by default - can we configure it somehow to open if any of the inner controls have focus?"

We have prepared a workaround sample based on your requirement. In this we have used "GotFocus" event of SfAccordionItem and set the IsSelected as True to open the focussed item. Please download the sample from the below link.

Sample:  accoriontabindexsample

Query #2:" Is there some other way to scroll the newly opened section up into the center or top of the Accordion?"

By default the "ScrollViewer.BringIntoViewOnFocusChange" property is true, the Selected item GotFocus it gets the view. Could you please provide more details about your exact requirement. It will be help us to proceed further.

Regards,
Venkateshwaran V.R.

[Deanna Delapasse]

Hi Venkateshwaran,

#1) We have to use the ContentTemplate.  Is it possible to attach to the GotFocus event using that method?  We found this:  https://www.syncfusion.com/forums/114318/accessing-control-inside-contenttemplate  which might be helpful, but we can't access ("access denied")

#2) If the section is way down at the bottom I think the Accordion considers it open, but our customer complains that he can't see the content.  He wants us to auto-scroll (ie "center") the open section in the window.   Possibly if we could catch the ItemOpened event we could force the scrolling?  Seems like the ScrollViewer.BringIntoViewOnFocusChange doesn't do anything if the section header is visible.

Thanks for your help!

[Venkateshwaran Ramdoss]

Hi Deanna,

Query #1:" We have to use the ContentTemplate. Is it possible to attach to the GotFocus event using that method?"

We have modified your previously updated sample. In that we have get the SfAccordionItem from the SfAccordion control and invoke the GotFocus method and set IsSelected as True to open the Focussed item. Please download the sample from the below link.

Sample: http://www.syncfusion.com/downloads/support/forum/124918/ze/AccordionModifiedSample-1506308211.zip  

Query #2:" He wants us to auto-scroll (ie "center") the open section in the window. Possibly if we could catch the ItemOpened event we could force the scrolling? "

We have raised query in the msdn related to the same. Please followup the below link for this. 

Link: https://social.msdn.microsoft.com/Forums/windowsapps/en-US/59376987-8789-40f7-8dcf-4fa46765c0eb/how-to-set-the-scrollviewer-of-a-control-in-to-center-or-top-of-the-item?forum=wpdevelop  

Regards,
Venkateshwaran V.R. 

[Deanna Delapasse]

Looks like someone posted a response to your issue!   Is this issue related to the scrolling problem in SelectMode=One (124971)?  If so, I am requesting a patch for 124971, so could you possible fix this one as well in the same patch?  

thanks!

Deanna

>>Can anyone suggest that how to change the position of the ScrollViewer programmatically based on the SelectedItem?.

To meet your requirements, you can get the ScrollViewer object from the ListBox control firstly. And then invoke the ScrollViewer.ChangeView method to change the view as you want.  The ChangeView method need parameters such as horizontalOffset and verticalOffset. You can get the previous position and calculate how much to scroll by the selected item. Then you can set the target position to the method to change the view. 

For detail code you can reference: http://stackoverflow.com/questions/32557216/windows-10-scrollintoview-is-not-scrolling-to-the-items-in-the-middle-of-a-lis

[Venkateshwaran Ramdoss]

Hi Deanna,

We have checked the reported behavior.  Could you please confirm the requirement “are need to get the Selected SfAccodrionItem get into view” in the Forum 124971 and requirement in this forum are the same? This will help us to proceed further.

Regards,
Venkateshwaran V.R.

[Deanna Delapasse]

I believe this is the same issue as 160574.   Please see that issue with my attached video.   We can close this issue as we have resolved #1.

thanks,

Deanna

[Vijayalakshmi Roopkumar]

Hi Deanna,

Thank you for the update.

Please follow-up with the incident “Accordion Scroll Issue with SelectMode=One” created under your Direct-trac account for further assistance.

Regards,
Vijayalakshmi R.