Multi columns, possible?

I’ve looked up your answers in the FAQ and now I know how to use 2, 3 or 4 columns..

Is there a way to format the form in a table structure (various fields in the same line) ?
Into the form editor click a field and into its settings there is one field named “Add Css Layout Keywords”. Into that field you can put the name of a CSS class that will be applied to the field.

There are some pre-defined CSS classes to use align two, three or four fields into the same line. The CSS classes are named:

column2
column3
column4
For example if you want to put two fields into the same line then specify for both fields the class name “column2”.

Great! worked like a charm!
But I noticed that the cursor focus goes to the first field at the left side, even if that field is not fieldname1.
Because I build Arabic forms, I’ve arranged the fields so that fieldname1 shows at the right side, and fieldname2 at the left side.

Is there a way I can make the cursor focus on fieldname1, regardless of its position in the table? and same for the tab button too please?

Hi,

If you want set the focus in the second field, each time you move to a different page in a multipage form, you should edit the fbuilder-pro-public.jquery.js file, located in “/wp-content/plugins/calculated-fields-form/js/fbuilder-pro-public.jquery.js”.

Please, open the file in the text editor your choice, and go to the line of code:

$(“#fieldlist”+identifier+” .pb”+page).find(“.field”)[0].focus();

If you want set the focus in the second field, modify the previous line like follow:

$(“#fieldlist”+identifier+” .pb”+page).find(“.field:eq(1)”)[0].focus();

And that’s all.
Best regards.

Its not a multipage form. Its a single page, but the fields are 2 in each line. I want it to focus on fieldname1, which in my form is located at the right side, not the left side.
And I wanted to make it so the focus is set to fieldname1, instead of the first field to the left.

I do not want it to permanetly focus on the second field, because some forums would have 1 column in each line, and in that case it would skip the first line.

Hi,

Could you send me a link to your page to check the issue in detail, please?

Best regards.

Sure, here is the link:
https://my2cents.gawaher.com/2027/%D8%AD%D8%B3%D8%A7%D8%A8-%D8%AA%D9%83%D9%84%D9%81%D8%A9-%D8%A3%D9%89-%D8%B5%D9%86%D9%81-%D8%A3%D9%83%D9%84-%D9%88%D9%85%D9%82%D8%AF%D8%A7%D8%B1-%D8%A7%D9%84%D9%88%D9%81%D8%B1-%D9%85%D9%82%D8%A7%D8%B1.html/2

You’ll notice that I’ve arranged the form so that the first field at the left is fieldname3, then to the right is fieldname2 (because in Arabic everything starts at the right side)
It seems that your script focuses on the first field it finds at the top left. That is why the focus goes to fieldname3, but I want it to focus on the the lowest numbered field, in this case: fieldname2, not the first field it finds at the left side.

Alternatively, it could perhaps focus on the first field it finds at the right side, and the tab goes from right to left in each line? (or from the lowest numbered fieldname to the higher ones?)

Hi,

Could you send me the WordPress access to implement a solution in your copy of plugin, please? If the solution is definitive, I will publish an update of plugin to make it available for all users.

For send us sensitive information, use our support page:

https://wordpress.dwbooster.com/support

Best regards.

Can you please type here what files to edit and what lines to be changed or edited and I’ll do it myself please?
If you want me to try several times its ok, I’ll repeat as much as you want me to.

Hi,

Follow the steps below, but please let me know the results:

1. Create a backup of fbuilder-pro-public.jquery.js file.

2. Open the fbuilder-pro-public.jquery.js file in the text editor your choice.

3. Go to the snippet of code:

$(“#fieldlist”+opt.identifier+” .pb”+page).append(items[i].show());

and replace by the following code:

tap_count = ( typeof tap_count != ‘undefined’ ) ? tap_count : 100;
var _e = $( items[i].show() );
_e.find( ‘.field’ ).attr( ‘tabindex’, ++tap_count );
$(“#fieldlist”+opt.identifier+” .pb”+page).append( _e );

Best regards.

Did exactly as you said, but nothing changed.
https://my2cents.gawaher.com/2027/%D8%AD%D8%B3%D8%A7%D8%A8-%D8%AA%D9%83%D9%84%D9%81%D8%A9-%D8%A3%D9%89-%D8%B5%D9%86%D9%81-%D8%A3%D9%83%D9%84-%D9%88%D9%85%D9%82%D8%AF%D8%A7%D8%B1-%D8%A7%D9%84%D9%88%D9%81%D8%B1-%D9%85%D9%82%D8%A7%D8%B1.html/2

Hi,

Could you contact me through the support page, to try solve the issue in your website by myself, please?

https://wordpress.dwbooster.com/support

Best regards.