This is a migrated thread and some comments may be shown as answers.

Radspell control in a Table and setting tabindex

7 Answers 126 Views
Spell
This is a migrated thread and some comments may be shown as answers.
Gerald
Top achievements
Rank 1
Gerald asked on 20 Jun 2012, 07:28 PM
I have a Radspell control in a cell of a table. All is fine until I try setting tabindex on the various controls on my page.  After setting Tabindexes the cell the Radspell control is on is recieving the focus not the control itself.  What am I doing wrong?

Thanks,
Gerald

7 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 25 Jun 2012, 11:13 AM
Hi,

RadSpell is a composite control and the tabIndex attribute is applied to its DIV wrapper element but not to the input button which launches the spellchecker dialog: http://screencast.com/t/zlfgw1FNuV6. If you want to apply the tabIndex to the input button, you can do it using the following JavaScript code:

<table>
    <tbody>
        <tr>
            <td>
                <asp:TextBox runat="server" ID="TextBox1" TabIndex="1" />
            </td>
            <td>
                <asp:TextBox runat="server" ID="TextBox2" TabIndex="2" />
            </td>
        </tr>
        <tr>
            <td>
                <telerik:RadSpell ID="RadSpell" TabIndex="3" ControlsToCheck="TextBox1,TextBox2"
                    OnClientLoad="OnClientLoad" runat="server" />
                <script type="text/javascript">
                    function OnClientLoad(spell) {
                        var wrapper = spell.get_element();
                        var button = $get("RadSpell_SpellCheck");
                        var spellTabIndex = wrapper.getAttribute("tabIndex");
 
                        button.setAttribute("tabIndex", spellTabIndex);
                        wrapper.removeAttribute("tabIndex");
                    }               
                </script>
            </td>
            <td>
                  
            </td>
        </tr>
    </tbody>
</table>


All the best,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Gerald
Top achievements
Rank 1
answered on 25 Jun 2012, 09:20 PM
Rumen,

Thanks for your reply. 

I am not able to get the button.  The following is returning null.  My RadSpell ID is "RadSpell" as in your example.
var button = $get("RadSpell_SpellCheck");

Regards,
Gerald
0
Rumen
Telerik team
answered on 27 Jun 2012, 09:52 AM
Hello,

For your convenience I recorded a video http://screencast.com/t/9forq8LhdsG and attached my test project. If you still experience any troubles modify the project to demonstrates your scenario and send it via a support ticket.

Greetings,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
Gerald
Top achievements
Rank 1
answered on 27 Jun 2012, 04:54 PM
Rumen,

Thanks again for your attention to this matter.  I believe my problem stems from the fact that I have a master page and the Radspell control is in a ContentPlaceHolder.  If I look at the source the id of the Spell_Check is "ctl00_MainContent_RadSpell_SpellCheck" thus the $get() is not finding the button.

I was able to fix this by changing to the following line:
    var button = spell._spellCheckButton;

I believe my issue is resolved. 

Thank you,
Gerald

0
Dejan
Top achievements
Rank 1
answered on 25 Jul 2012, 09:37 AM
Dear Rumen

I've come to this thread, because I was also trying to set the tabindex on the RadSpell control and it didn't work as expected. 

It is nice that you provide a JavaScript workaround to this problem, but I would rather have this fixed on the control itself. 

You see, my application already has a lot of JavaScript code each time the page is loaded, and I do not want to add more code for something that can be handled on the server. (Plus, I don't want to create extra code for testing/maintenance)

Anyways, what is the purpose of setting the tabindex attribute on the wrapper div of the RadSpell element?

As per the W3C HTML specification, these are the only elements that support the tabindex property

The following elements support the tabindex attribute:
A, AREA, BUTTON, INPUT, OBJECT, SELECT, and TEXTAREA.

Hopefully you will reconsider and actually fix this problem

Thanks

Dejan
0
Rumen
Telerik team
answered on 30 Jul 2012, 11:35 AM
Hello Dejan,

Thank you for your valuable feedback.

I do agree with you and I escalated your feature request. We will enhance the TabIndex property and it will be applied to the input type="button" element of RadSpell. Here you can find the PITS Issue: Public URL and vote for raising its priority.

All the best,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
0
TonyG
Top achievements
Rank 1
answered on 27 Aug 2012, 11:20 PM
I'm linking this thread with a posting I just made about TabIndex in the ComboBox forum, but I'm having the exact same problem tabbing between RadTextBox controls and with an asp:RadioButton to a RadDatePicker.

Should I be scripting this for the reasons documented in this thread?
Thanks!

EDIT: I don't know if that's the right solution, but the scripting from this thread worked for me. See linked thread.
Tags
Spell
Asked by
Gerald
Top achievements
Rank 1
Answers by
Rumen
Telerik team
Gerald
Top achievements
Rank 1
Dejan
Top achievements
Rank 1
TonyG
Top achievements
Rank 1
Share this question
or