0

I am working on sharepoint server 2013 on-premise, and i have the following requirement:-

  1. we want to create a new list which have 15 department items. such as HR,Finance,IT, etc.

  2. and for each department we want to enter the number of employees who left the department for each month.

  3. now each department have its own KPI about the maximum number of employees which have to leave each month.

  4. depending on each department KPI the list item will have green, yellow or RED color. for example if the number of employees who left the HR dept is 3 then the item should be red colored.while for the fiance if the number of 5 then it will be red colored and so on...

so i am thinking of following these steps to achieve the above requirements:-

  1. to create a new list, with the following fields:-

    1. Department Name.
    2. add 12 fields represents the Months. Such as January, Feb, March , etc...
  2. so in this case for each department we will have 12 fields to enter the number of employees who left the department at that month.
  3. Description. This field describe the latest number entered for each dept item.

now the issue i am asking about is how i can represents the data, so for each department it will show the number of employees who left at the current month, and color the item based on each department KPI. also i want to add "?" symbol beside each department name, and when user hover over the "?" it will show the item Description field.

now the first thin which came to my mind is to do the following:-

  1. to write a java-script which integrate with the list using REST API.
  2. where i can retrieve the related data for each department and color it accordingly.
  3. then inside my site home page >> i can add a code snippet web part >>reference the javascrpt.

so can anyone adivce if my above appraoch sound valid ? or i should be looking to create this using JSLINK or create an APP.... i am confused on which appraoch i should/preferred to follow and why ?

1 Answer 1

1
  1. to write a java-script which integrate with the list using REST API.

Not if you write CSR javascript code code to change a ListView that gives you all the data without you having to do anything. You only have one List with 15 Items

  1. where i can retrieve the related data for each department and color it accordingly.

Your description is missing where you want to store the KPI treshold value. Looks to me it is just another Field in the List

  1. then inside my site home page >> i can add a code snippet web part >>reference the javascrpt.

Not if you use a ListView WebPart and set the JSLink to your CSR javascript file

Before diving in at the deep end; install the Cisar Chrome Extension and learn to develop CSR code, only then can you become un-confused

There is no JavaScript versus JSLink as your title says

CSR is the JavaScript file that rewrites your View/Form output

JSLink is the technology that connects a ListView/Form webpart to your CSR file

They can be (and are usually) used together, but don't have to

https://www.codeproject.com/Articles/620110/SharePoint-Client-Side-Rendering-List-Views

Re:comments

John, you have to decide for yourself what is better. Skilllevel is not the only parameter

I did this with the Cisar editor in 14 minutes, including creating a Custom List:

function indicator(ctx,Schema,CurrentItem){ var value = CurrentItem[Schema.Name]; var kpi=CurrentItem.KPI; var color='lightgreen'; if(value===kpi) color='orange'; if(value>kpi) color='lightcoral'; return "<div style=text-align:center;background:"+color+">"+value+"</div>"; }

6
  • thanks for the reply.. now of course i am aware of both CSR and JSLINK .. but my question is about the approach to achieve what i am looking for... now for me it will be easier to write a pure javascript which integrates with list API , rather than writing a JSLINK.. but i was asking if any appraoch can provide advantages over the other ... and for the Description field yes it is a field inside the list as mentioned on my question.. but i want to add "?" symbol , where when users hover over the symbol the Description field for the item will be shown in a dialog ...
    – John John
    Apr 7, 2017 at 14:58
  • so i find doing this using javascript which is rendered using a code snippet ,, easier and more standard way rather than writting JSLINK to create a custom view..
    – John John
    Apr 7, 2017 at 14:59
  • 1
    Your way is the classic SP2007/SP2010 way... it works.. If you have normal JavaSscript skills then your ? challenge is 5 minutes work with the CSR WYSIWYG Cisar editor rewriting your Description field with different CSR (ClientSideRendering). But if you think Microsofts SP2013/2016 CSR/JSLink way is too complex for you, then don't use it. Fine by me. Apr 7, 2017 at 15:07
  • so regardless of the skills level i have... generally speaking which appraoch is better and why ?
    – John John
    Apr 7, 2017 at 15:10
  • and how it i easy using JSLINK to add a hover effect on the "?" to show the item Description inside a dialog box??
    – John John
    Apr 7, 2017 at 16:48

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.