Topic: Tabindex

Suggest ordered 'tabindex' of the FORM elements to make a more logic jump for tab-key.

Example:
In 'Add Forum' the cursor goes in this order when starting in 'Position'

Position
[Options] Admin/moderators only
Update
Name
[Options] Closed
Description
Category

Now, since all forums are listed in a row, i'm not sure how to make a practical solution, but it would nice to have it jump in this order:

Position
Name
Description
[Options] Admin/moderators only
[Options] Closed
Category
Update

More info http://www.w3schools.com/xhtml/xhtml_st … ibutes.asp about tabindex.

One possible solution chould be to add 7 to each tabindex for each forum-loop.

$tab_pos = 1;
$tab_name = 2;
$tab_desc = 3;
$tab_op_admin = 4;
$tab_op_closed = 5
$tab_cat = 6;
$tab_update = 7;

Like this (Loop1):
Position - tabindex=$tab_pos
Name - tabindex=$tab_name
Description - tabindex=$tab_desc
[Options] Admin/moderators only - tabindex=$tab_op_admin
[Options] Closed - tabindex=$tab_op_closed
Category - tabindex=$tab_cat
Update - tabindex=$tab_update

$tab_pos += 7;
$tab_name += 7;
$tab_desc += 7;
$tab_op_admin += 7;
$tab_op_closed += 7;
$tab_cat += 7;
$tab_update += 7;


If anyone understands what i'm rembling about...

Last edited by RNilsson (2003-07-24 00:30:42)

Heaven dosen't want me, and hell's afraid I'll take over...
Are YOU ready to post on the forum?

Re: Tabindex

Why make it complicated? wink


Replace

                        <td class="pun_right" style="width: 10%"><b>Position</b></td>
                        <td style="width: 32%"> <input type="text" name="position[<?php print $cur_forum['fid'] ?>]" size="3" maxlength="3" value="<?php print $cur_forum['position'] ?>"></td>
                        <td class="pun_right" style="width: 10%" rowspan="2"><b>Options</b></td>
                        <td style="width: 32%; white-space: nowrap"> <input type="checkbox" name="admmod_only[<?php print $cur_forum['fid'] ?>]" value="1"<?php if ($cur_forum['admmod_only'] == '1') print ' checked'; ?>> Admins/moderators only</td>
                        <td class="pun_cent" style="width: 16%" rowspan="3"><input type="submit" name="update[<?php print $cur_forum['fid'] ?>]" value="Update"></td>
                    </tr>
                    <tr>
                        <td class="pun_right"><b>Name</b></td>
                        <td> <input type="text" name="forum_name[<?php print $cur_forum['fid'] ?>]" size="35" maxlength="80" value="<?php print htmlspecialchars($cur_forum['forum_name']) ?>"></td>
                        <td style="white-space: nowrap"> <input type="checkbox" name="closed[<?php print $cur_forum['fid'] ?>]" value="1"<?php if ($cur_forum['closed'] == '1') print ' checked'; ?>> Closed</td>
                    </tr>
                    <tr>
                        <td class="pun_right">Description<br>(HTML)</td>
                        <td> <textarea name="forum_desc[<?php print $cur_forum['fid'] ?>]" rows="3" cols="50"><?php print htmlspecialchars($cur_forum['forum_desc']) ?></textarea></td>
                        <td class="pun_right"><b>Category</b></td>
                        <td>
                             <select name="cat_id[<?php print $cur_forum['fid'] ?>]">
<?php

        $cur_category2 = 0;
        @reset($forum_list);
        while (list(, $cur_forum2) = @each($forum_list))
        {
            if ($cur_forum2['cid'] != $cur_category2)    // A new category since last iteration?
            {
                $selected = ($cur_forum['cid'] == $cur_forum2['cid']) ? ' selected' : '';

                print "\t\t\t\t\t\t\t\t".'<option value="'.$cur_forum2['cid'].'"'.$selected.'>'.htmlspecialchars($cur_forum2['cat_name']).'</option>'."\n";

                $cur_category2 = $cur_forum2['cid'];
            }
        }

?>
                            </select>

with:

                            <table width="100%" cellpadding="0" cellspacing="0">
                                <tr>
                                    <td>
                                        <table width="100%" border="0" cellpadding="0" cellspacing="3">
                                            <tr>
                                                <td class="pun_right">
                                                    <b>Position</b>
                                                </td>
                                                <td>
                                                     <input type="text" name="position[<?php print $cur_forum['fid'] ?>]" size="3" maxlength="3" value="<?php print $cur_forum['position'] ?>">
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="pun_right">
                                                    <b>Name</b>
                                                </td>
                                                <td>
                                                     <input type="text" name="forum_name[<?php print $cur_forum['fid'] ?>]" size="35" maxlength="80" value="<?php print htmlspecialchars($cur_forum['forum_name']) ?>">
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="pun_right">
                                                    Description<br>(HTML)
                                                </td>
                                                <td>
                                                     <textarea name="forum_desc[<?php print $cur_forum['fid'] ?>]" rows="3" cols="50"><?php print htmlspecialchars($cur_forum['forum_desc']) ?></textarea>
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                    <td>
                                        <table width="100%" border="0" cellpadding="0" cellspacing="3">
                                            <tr>
                                                <td class="pun_right">
                                                    <b>Options</b>
                                                </td>
                                                <td>
                                                     <input type="checkbox" name="admmod_only[<?php print $cur_forum['fid'] ?>]" value="1"<?php if ($cur_forum['admmod_only'] == '1') print ' checked'; ?>> Admins/moderators only
                                                    <br>
                                                     <input type="checkbox" name="closed[<?php print $cur_forum['fid'] ?>]" value="1"<?php if ($cur_forum['closed'] == '1') print ' checked'; ?>> Closed
                                                </td>
                                            </tr>
                                            <tr>
                                                <td class="pun_right">
                                                    <b>Category</b>
                                                </td>
                                                <td>
                                                     <select name="cat_id[<?php print $cur_forum['fid'] ?>]">
<?php

        $cur_category2 = 0;
        @reset($forum_list);
        while (list(, $cur_forum2) = @each($forum_list))
        {
            if ($cur_forum2['cid'] != $cur_category2)    // A new category since last iteration?
            {
                $selected = ($cur_forum['cid'] == $cur_forum2['cid']) ? ' selected' : '';

                print "\t\t\t\t\t\t\t\t".'<option value="'.$cur_forum2['cid'].'"'.$selected.'>'.htmlspecialchars($cur_forum2['cat_name']).'</option>'."\n";

                $cur_category2 = $cur_forum2['cid'];
            }
        }

?></select>
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                    <td>
                                        <table width="100%" border="0" cellpadding="0" cellspacing="3">
                                            <tr rowspan="3">
                                                <td>
                                                    <input type="submit" name="update[<?php print $cur_forum['fid'] ?>]" value="Update">
                                                </td>
                                            </tr>
                                        </table>
                                    </td>
                                </tr>
                            </table>

Could be made with a smaller piece of code but that didn't look that good smile

Last edited by Cactuz (2003-07-26 19:21:43)

http://www.punres.org/img/banner.png

Re: Tabindex

Not entierly sure what that code does, but my suggestion was only to make the marker jump in a predictable order in the input-fields.

If the code does so, it's time for me to go te bed...

hmm, it's bedtime anyways...

Heaven dosen't want me, and hell's afraid I'll take over...
Are YOU ready to post on the forum?

Re: Tabindex

Thats what it doing.

http://www.punres.org/img/banner.png

Re: Tabindex

I agree that the tab order is a bit screwed, but it's not something I will fix for 1.0. I'm putting it on the TODO list however :-)

"Programming is like sex: one mistake and you have to support it for the rest of your life."

Re: Tabindex

Great, keep it up.

Heaven dosen't want me, and hell's afraid I'll take over...
Are YOU ready to post on the forum?