[Resolved] Creating a form for front end form

[Author]

Posts

[vasukib]

I am trying to:
Create a front end form for my school management system. I have created a form for continuous assessment of students. Teachers enter marks for 4-5 assignments that a student gets and assign a grade.
My problem is:
a) While I created fields for Assignments 1-5, I want the last but one field to calculate the total. The sixth field has a dropdown from which the teacher assigns a grade.
b) How do i get to display the form horizontally (and not vertically as forms normally do?)
Something like this:

Student Assign 1 Assign 2 Assign 3 Total Marks Grade (select from dropdown)
(form totals)
Stu 1
Stu 2
Stu 3
etc
I visited this URL:
I've checked out the tutorials on views and layouts and I can't simply seem to get about it.
Please help! Thanks in advance!
I expected to see:

Instead, I got:

[vasukib]

#1
PHP
5.5.38
MySQL
5.6.31
Memory Usage
12,767,904 bytes
Please Enable
WP_DEBUG
Object Cache
Cache Hits: 3451
Cache Misses: 117

Group: options - ( 419.53k )
Group: default - ( 0.03k )
Group: users - ( 0.37k )
Group: userlogins - ( 0.03k )
Group: useremail - ( 0.04k )
Group: userslugs - ( 0.03k )
Group: user_meta - ( 7.92k )
Group: themes - ( 1.31k )
Group: types_cache_groups - ( 3.36k )
Group: posts - ( 7.95k )
Group: post_meta - ( 4.02k )
Group: counts - ( 0.37k )
Group: terms - ( 11.90k )
Group: term_meta - ( 0.12k )
Group: category_relationships - ( 0.03k )
Group: types_cache_ids - ( 0.05k )
Group: types_cache - ( 1.97k )

[Luo Yang]

Dear vasukib,

Q1) I want the last but one field to calculate the total
There isn't such a feature within CRED form, it needs custom codes.
If you are going to calculate the total in front-end, you can create some custom JS codes to calculate the total value, triggered by any of the assignment field is changed: for example:
hidden link
Bind an event handler to the "change" JavaScript event, or trigger that event on an element.
If you need to calculate in server side, you can try with CRED action hook cred_save_data
This hook allows doing a custom action when post data is saved to database.
https://toolset.com/documentation/user-guides/cred-api/#csd

Q2) How do i get to display the form horizontally (and not vertically as forms normally do?)
It needs custom CSS codes, for example here is a similar thread:
https://toolset.com/forums/topic/display-radio-buttons-horizontally/
More help:
https://toolset.com/documentation/user-guides/styling-cred-forms/
Styling CRED forms
Each page has its own individual character and design. Forms used on our pages should be as consistent as possible with the rest of the design. Fortunately, the appearance of CRED forms can be easily adapted to suit every original style.