Wednesday, November 23, 2016

Smart Table using AngularJS in Visualforce page

AngularJS provide functionality through which we can display records in table and can perform sorting, searching, pagination etc on client side (on Visualforce page). Previously we have to write sorting, searching logic in apex controller and need to call controller methods to perform operation and then rerender the page. AngularJS makes this job easy.

Below is sample angularJS code present in visualforce. This page display Account and its related cases. User can sort cases and search cases from related cases.



Please see below snaphot. In order to test this code, pass account id in url as below URL
https://ap1--skforce.ap1.visual.force.com/apex/smartTableAnguarJs?id=0019000000ld4kN





More Blogs>>: HighCharts in Visualforce Page Batch Apex Job Progress Bar     Dynamic Apex in Salesforce

Refer Below Links for Salesforce Interview Questions

-
Labels: , ,

16 comments:

  1. UnknownMarch 28, 2017 at 7:11 PM

    System.ListException: List index out of bounds: 0
    got error ?

    ReplyDelete
    Replies
    1. Sunil KumarMarch 29, 2017 at 11:13 AM

      Hi Jagan,

      Pass the account Id in VF URL as parameters. Below is sample URL:
      https://xxx.xxxxx.force.com/apex/smartTableAnguarJs?id=0019000000ld4kO

      Thanks,
      Sunil Kumar

      Delete
  2. UnknownJanuary 17, 2018 at 3:04 AM

    All the blog writings are demonstration of what we call, Brilliant.
    resumeyard.com

    ReplyDelete
  3. UnknownMarch 29, 2018 at 11:10 AM

    Nice blog and nice post.Thak you so much for sharing.It is really helpful for a newbie like me. I am a regular follower of your blog. Really very informative post you shared here. Kindly keep blogging.Please check out Yiioverflow to know more about Angular JS framework and its wonderful feautres.

    ReplyDelete
  4. sriramMay 17, 2018 at 2:34 PM

    This is an awesome post.Really very informative and creative contents. These concept is a good way to enhance the knowledge.I like it and help me to development very well.Thank you for this brief explanation and very nice information.Well, got a good knowledge.
    Angularjs course in chennai

    ReplyDelete
  5. UnknownAugust 25, 2018 at 4:39 PM

    Thanks for one marvelous posting! I enjoyed reading it; you are a great author. I will make sure to bookmark your blog and may come back someday. I want to encourage that you continue your great posts, have a nice weekend!
    Online training in USA

    ReplyDelete
  6. BhuvanaOctober 21, 2018 at 6:21 PM

    Expected to form you a next to no word to thank you once more with respect to the decent recommendations you've contributed here. Those guidelines additionally worked to become a good way to recognize that other people online have the identical fervor like mine to grasp great deal more around this condition. We are providing AngularJs training in velachry.
    For more details: AngularJs training in velachery

    ReplyDelete
  7. UnknownOctober 23, 2018 at 11:28 AM

    I just needed to record a speedy word to express profound gratitude to you for those magnificent tips and clues you are appearing on this site. We are providing AngularJs training in Velachery.
    For more details: AngularJs Training in Chennai

    ReplyDelete
  8. UnknownOctober 30, 2018 at 4:24 PM

    Needed to compose you a very little word to thank you yet again regarding the nice suggestions you’ve contributed here. we are providing AngularJs training in velachery.
    for more details: AngularJs training in velachery

    ReplyDelete
  9. Laura bushSeptember 7, 2019 at 5:37 AM

    I am completely satisfied with the techniques you have written over here on angular js. The effort you made in this article is truly nice. If anybody is seeking for this angular tutorial in affordable price then contact us. Best Web Development In Angular Js Course In Delhi

    ReplyDelete
  10. Vale Co XeniaNovember 4, 2019 at 1:12 PM

    Great Article
    B.Tech Final Year Projects for CSE in Angular


    Angular Training in Chennai


    Project Centers in Chennai


    JavaScript Training in Chennai

    ReplyDelete
  11. AppDevelopersMarch 4, 2020 at 12:46 PM

    Being one of the best Angular JS Development Company USA , HireFullStackDeveloperIndia is devoted to providing the most excellent proficiency to deliver dazzling applications and websites. They aspire at delivering high-class AngularJS based solutions to assist their customers.

    ReplyDelete
  12. sindhuja cynixitJuly 30, 2020 at 4:13 PM

    Angularjs online training

    ReplyDelete
  13. un knownOctober 5, 2020 at 5:37 PM

    Thanks for Sharing This Article.It is very so much valuable content. I hope these Commenting lists will help to my website
    devops online training
    best angularjs online training
    top angularjs online training

    ReplyDelete
  14. un knownOctober 30, 2020 at 5:12 PM

    Thanks for Sharing This Article.It is very so much valuable content. I hope these Commenting lists will help to my website
    angular js online training
    best angular js online training
    top angular js online training

    ReplyDelete

Subscribe to: Post Comments (Atom)