5

I have spent many hours to try to write a script which allow me to do the following :-

  1. Currently i have a Discussion Board list which contain many items. where inside my site home page i added a new App Part representing the Discussion Board list.

  2. Now i edit the app part setting and i select the "Subject" as the view.

  3. So the final result i got is as follow. where there are links named; Recent, What's hot, My discussions... and inside the list menu i got links named; unanswered question, answered questions and Featured, as follow:-

enter image description here

  1. Now i tried to find a way to set the default view for the app part to be "Featured" instead of "Recent".. but seems inside the app part setting we can not have these settings.

  2. Now i already know that inside the App part there is a view named "Featured Discussions", but this view will only show the discussion item title and created by, without showing the number of replies or the number of likes..so that why i need to use the "Featured" link inside the "Subject" app part view.

  3. so i tried this script to mimic clicking on the "..." link >> then clicking on the "Featured" link.

<script type="text/javascript">
var timer1
$(document).ready(function(){
      if($("#MSOZoneCell_WebPartWPQ2").find("a:contains('Featured')").length==0)
      {
        ($("#MSOZoneCell_WebPartWPQ2").find("img.ms-ellipsis-icon")).trigger('click');
        time1= setTimeout(test,1000);
      }

  });

 function test()
 {
   $("a:contains('Featured')").trigger('click');
 }
  clearTimeout(timer1);
</script>

At first i thought the script worked well. but seems with some extra testing it did not, as currently i am facing these issues:-

  1. on google chrome, Firefox and safari the script will work well. where when i first visit the page the list menu will open and the "Featured" view will be selected automatically. but when i open many tabs and refresh them all (where the response time will increase), then on some tabs i have noted that either the list menu is shown without selecting the "Featured" link (as shown in the above picture). and on other tabs the app part will be rendered as white area!!.

  2. now on IE (currently i am using IE 11), the situation was as follow:-

    • If i do a hard refresh for the page (CTRL + F5), the list menu menu will be shown, but the "Featured" link will not get clicked.
    • If i access the page without doing a hard refresh (CTRL + F5) the script will not have any effect... even the list menu will not get shown.

Now I think that the issue i am facing is that the script will be accessing some components/markups that have not been rendered yet. due to performance delay or due to having 2 .trigger('click'); where one is depending on the other... so i am not sure if i can modify my script to work on a more robust way? and to eliminate the browser differences and performance issues which are breaking the script...

Edit

now based on @Aveenav reply, i added the following script inside a script editor web part:-

<script  type="text/javascript">
(function () {
    // String overrides
    function DiscussionListViewStringOverride() {

    SP.UI.Discussions.SortFilterItem.onPivotControlMenuOptionClick("SortItem4");
    }

    DiscussionListViewStringOverride();
    ExecuteOrDelayUntilScriptLoaded(DiscussionListViewStringOverride, "strings.js");

})();
</script>

but this did not have any effect and still the Recent link will be selected. also i should mention that inside the page i have added 2 app parts for the Discussion Board list. now i need the first app part to have the "Featured" as the default , while for the other app part to keep the "Recent" as the defualt.. Thanks

  • take a look at sp.ui.discussions.debug.js and override the function that does the initial rendering. – Aveenav Sep 5 '17 at 16:24
2

I think "window.onload" method should do the trick. This should be affected only for the first app part on the page and it should show up Featured items by default while second app part should keep Recent as default. Please give it a try.

<script type="text/javascript">

window.onload = function() {
    SP.UI.Discussions.SortFilterItem.onPivotControlMenuOptionClick('SortItem4');
};

</script>
  • waaaw your appraoch worked for me ... but not sure how did window.onload fix this ? – john Gu Sep 7 '17 at 0:28
  • can u advice on what is the secrete behind your reply.. as seems it is the only appraoch which worked for me... – john Gu Sep 18 '17 at 14:54
  • It appears that “SP.UI.Discussions.SortFilterItem.onPivotControlMenuOptionClick” has dependencies on css classes. (take a look on sp.ui.discussions.debug.js ) Therefore, it’s required to make sure all the required objects are loaded before calling this function. $(document).ready executes when DOM is ready where as window.onload executes after all the objects(css/images) are loaded. – Prasanna Sep 19 '17 at 22:25
5

Take a look at sp.ui.discussions.debug.js

Here's one way to trigger Featured link. You may have to use ExecuteOrDelayUntilScriptLoaded or some sort of setTimeOut delay.

$(doucument).ready(function() {
   // SortItem4 is for Featured
   setTimeout(function(){ SP.UI.Discussions.SortFilterItem.onPivotControlMenuOptionClick('SortItem4'); }, 500);
};
  • thanks for the hint and info.. now i tried your approach but did not work.. can u please check my edit.. thanks – john Gu Sep 6 '17 at 1:20
  • can u advice more on my edit please? – john Gu Sep 6 '17 at 10:09
  • try executing SP.UI.Discussions.SortFilterItem.onPivotControlMenuOptionClick('SortItem4'); in your console. You'd see it should select the Featured tab. It think probably needs some delay. Also for ExecuteOrDelay you'd need to wait for sp.ui.discussions.js to load not strings.js ExecuteOrDelayUntilScriptLoaded(DiscussionListViewStringOverride, "sp.ui.discussions.js"); Since you have two discussions list, it would be little tricky. You may want to use JSLink PostRender handler and use current ctx of the JSLink. – Aveenav Sep 6 '17 at 16:54
  • 1
    try the edited answer: added setTimeout function – Aveenav Sep 6 '17 at 17:15
  • now i tried this jslink and i link it to my first app part :- (function () { // String overrides function DiscussionListViewStringOverride() { SP.UI.Discussions.SortFilterItem.onPivotControlMenuOptionClick("SortItem6"); alert("2"); } DiscussionListViewStringOverride(); ExecuteOrDelayUntilScriptLoaded(DiscussionListViewStringOverride, "sp.ui.discussions.js") })(); now i got the alert displayed but the "Featured" view was not selected – john Gu Sep 7 '17 at 0:07

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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