HI,
I create a “send form” with 23 input/fields.
I have to change positions, of some fields… I also removed and add fields…
Now, when I go on the form, on the web, I start writing info in the first field, do a “tab” to change field and so on…
BUT, when I go further, the order of the fields don’t follow the way I want to get the informations !
Is there a way to change the ORDER of these fields ???
Than you
Denis
freewaytalk mailing list
email@hidden
Update your subscriptions at:
Unless you do something manual to change this (by setting the tabindex property of the fields themselves) the source order in the published HTML will determine the order of the fields as you tab through them. You can see the source order (sort of) by toggling the left panel from its normal Site listing view to the Page view. Click the word Site (or Page, depending whether you have clicked it already) to toggle between the entire site and the current page.
Counter-intuitively, the lowest item on the list will be the highest item in the page’s stacking order (z-index) but it will be the last item in the source code order.
You can identify your form elements by clicking on them in the right pane and then noting which item in the left list has the dark blue highlight. If your form elements are placed on the page as absolutely positioned layers (as it sounds) then you can drag them up and down the list to change their source order (bottom = last in source, top = first in source) without affecting the look of the page (unless items were drawn overlapping one another).
Now that you know how to fix the issue, you need to know that it is of your own making. By drawing fields directly on the screen, you have decoupled their visual position (which is governed only by CSS) from the order of the fields in the code*. This leaves the page in a very fragile state. Depending on the browser in use, these elements will be of vastly different dimensions, and what looks aligned in one browser will look really amateur-hour in another. In Freeway, the best way to sort this is to use a table for the form layout (really, even though Tables for Layout Are Bad, as you may have heard). There really is a semantic reason to do thing this way, because you are able to use the structure of the table to group the fields with their labels, and this is a legitimate form of “tabular” data. By setting the borders of the table to 0, you will not see the structure, but a screen reader or other visually disabled reader will be able to discern the structure of your form and navigate it without confusion. Equally important, by placing the fields in the cells of a table, you will be forcing the visual and source order of the page to be one and the same.
Walter
*Source order vs. CSS
<input id="second_field" name="last_name" style="top: 200px">
<input id="first_field" name="first_name" style=top:100px">
Those two fields will look like they are in the correct (first/last name) order on screen, but the tab order will put the cursor first in the last name, then the first name field. The way they look on screen is only governed by CSS positioning.
<input id="first_field" name="first_name">
<input id="second_field" name="last_name">
Those two fields are in the correct source order, and thus appear one after the other. Their styling can change based on how the browser decides to draw them, so you won’t potentially end up with one field overlapping another. Tab order matches the source order.
On May 30, 2016, at 11:07 AM, Denis Landry email@hidden wrote:
HI,
I create a “send form” with 23 input/fields.I have to change positions, of some fields… I also removed and add fields…
Now, when I go on the form, on the web, I start writing info in the first field, do a “tab” to change field and so on…
BUT, when I go further, the order of the fields don’t follow the way I want to get the informations !
Is there a way to change the ORDER of these fields ???
Than you
Denis
freewaytalk mailing list
email@hidden
Update your subscriptions at:
Information for existing FreewayTalk / Groups.io users - Site Feedback - Softpress Talk
freewaytalk mailing list
email@hidden
Update your subscriptions at:
https://freewaytalk.softpress.com/person/options
This was the solution:
Select the input item, then menu Item > Extended… choose the input tab at the top of the Extended Item window, click for a new attribute, name = tabindex, value = 1 (or 2, 3, etc)
Denis
freewaytalk mailing list
email@hidden
Update your subscriptions at: