function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Nidhi MalhotraNidhi Malhotra 

Visualforce page - Table design for Rows

Hi All,
 
I need urgent help with a Visual force page. Following are the requirements:
  • When we click the new button on the Contact object, a visual force page should be displayed
  • In the first section we will show few fields related to the Contact for user to enter. This is already taken care
  • Next section allow users to add multiple related items (Custom object called Shares) dynamically. A new row can be added when user clicks Add Row button. Maximum of 5 rows can be entered.
  • Each row must display the following fields First Name, Last Name, Email, Relationship, ‘Is Contact Eligible’?
  • Is Contact eligible field is a pick list with values Yes or No, it should be shown as Checkbox.
    • If Is Contact Eligible is checked then four fields Home Phone, Mobile Phone, Other Phone, Work Phone must be show in the same row.
    • This means initial five fields in a Row and additional four fields must be display when Is Contact Eligible checkbox is checked.
  • A Delete button should be available in the end of each row so that we can delete the row.
  • When user saves the rows should be saved in custom object and associated to the Contact.
I can do the new button and saving part. But am facing it difficult to bring the custom object in rows and also properly formatted and aligned.

If anyone can help me with this Visual force page and design, it would be greatly helpful.
Thanks,
Nidhi
William LópezWilliam López
Hello Nidhi can you please share the code you have some far maybe an image of the what problem you have formating.

I think all its possbile by using reRenders and standards Visualforce components, if you have Javascript experience can also use Jquery and HTML to get this done.

But if you show what you have or at least a mock up of were you want to go I might be able to help you. 

Bill
Nidhi MalhotraNidhi Malhotra
Thanks for your Reply Bill!

Following is the mock up. It is an excel mock up. We need it in Visualforce design with Salesforce kind of design is good. The rows for Sahre information section is having many columns in one row and it is also a custom object. Please let me know if you need more information.

User-added image
William LópezWilliam López
Hello Nadhi,

I see, that will be a long post for the whole solution. For the type of table you might have to go with custom HTML and CSS.

I usually like to adapt those mockups to a mockups that can be accomplished wiht VisualForce components, so you wont need HTML, CSS and JS to support your tool.

I created a small example on this blog about how to add Dynamic section to a Visualforce Table using VisualForce components. I Hope it helps you as an start point.

http://billsalesforce.blogspot.ca/2015/02/visualforce-dynimic-section-on-page.html

Regards,

Bill