diff --git a/admin/tool/lp/amd/build/competency_plan_navigation.min.js b/admin/tool/lp/amd/build/competency_plan_navigation.min.js
new file mode 100644
index 00000000000..1862243a241
--- /dev/null
+++ b/admin/tool/lp/amd/build/competency_plan_navigation.min.js
@@ -0,0 +1 @@
+define(["jquery"],function(a){var b=function(b,c,d,e,f){this._baseUrl=c,this._userId=d+"",this._competencyId=e+"",this._planId=f,this._ignoreFirstCompetency=!0,a(b).on("change",this._competencyChanged.bind(this))};return b.prototype._competencyChanged=function(b){if(this._ignoreFirstCompetency)return void(this._ignoreFirstCompetency=!1);var c=a(b.target).val(),d="?userid="+this._userId+"&planid="+this._planId+"&competencyid="+c;document.location=this._baseUrl+d},b.prototype._competencyId=null,b.prototype._userId=null,b.prototype._planId=null,b.prototype._baseUrl=null,b.prototype._ignoreFirstCompetency=null,b});
\ No newline at end of file
diff --git a/admin/tool/lp/amd/build/user_competency_plan_popup.min.js b/admin/tool/lp/amd/build/user_competency_plan_popup.min.js
new file mode 100644
index 00000000000..91da50de5af
--- /dev/null
+++ b/admin/tool/lp/amd/build/user_competency_plan_popup.min.js
@@ -0,0 +1 @@
+define(["jquery","core/notification","core/str","core/ajax","core/templates","tool_lp/dialogue"],function(a,b,c,d,e,f){var g=function(b,c,d){this._regionSelector=b,this._userCompetencySelector=c,this._planId=d,a(this._regionSelector).on("click",this._userCompetencySelector,this._handleClick.bind(this))};return g.prototype._handleClick=function(c){var e=a(c.target).closest("tr"),f=a(e).data("competencyid"),g=a(e).data("userid"),h=this._planId,i=d.call([{methodname:"tool_lp_data_for_user_competency_summary_in_plan",args:{competencyid:f,planid:h},done:this._contextLoaded.bind(this),fail:b.exception}]);i[0].then(function(){d.call([{methodname:"core_competency_user_competency_viewed_in_plan",args:{competencyid:f,userid:g,planid:h},fail:b.exception}])})},g.prototype._contextLoaded=function(a){var d=this;e.render("tool_lp/user_competency_summary_in_plan",a).done(function(a,g){c.get_string("usercompetencysummary","report_competency").done(function(b){new f(b,a,e.runTemplateJS.bind(e,g),d._refresh.bind(d),!0)}).fail(b.exception)}).fail(b.exception)},g.prototype._refresh=function(){var a=this._planId;d.call([{methodname:"tool_lp_data_for_plan_page",args:{planid:a},done:this._pageContextLoaded.bind(this),fail:b.exception}])},g.prototype._pageContextLoaded=function(a){var c=this;e.render("tool_lp/plan_page",a).done(function(a,b){e.replaceNode(c._regionSelector,a,b)}).fail(b.exception)},g.prototype._regionSelector=null,g.prototype._userCompetencySelector=null,g.prototype._planId=null,g});
\ No newline at end of file
diff --git a/admin/tool/lp/amd/src/competency_plan_navigation.js b/admin/tool/lp/amd/src/competency_plan_navigation.js
new file mode 100644
index 00000000000..34a70c73e1f
--- /dev/null
+++ b/admin/tool/lp/amd/src/competency_plan_navigation.js
@@ -0,0 +1,74 @@
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * Event click on selecting competency in the competency autocomplete.
+ *
+ * @package    tool_lp
+ * @copyright  2016 Issam Taboubi <issam.taboubi@umontreal.ca>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+define(['jquery'], function($) {
+
+    /**
+     * CompetencyPlanNavigation
+     *
+     * @param {String} The selector of the competency element.
+     * @param {String} The base url for the page (no params).
+     * @param {Number} The user id
+     * @param {Number} The competency id
+     * @param {Number} The plan id
+     */
+    var CompetencyPlanNavigation = function(competencySelector, baseUrl, userId, competencyId, planId) {
+        this._baseUrl = baseUrl;
+        this._userId = userId + '';
+        this._competencyId = competencyId + '';
+        this._planId = planId;
+        this._ignoreFirstCompetency = true;
+
+        $(competencySelector).on('change', this._competencyChanged.bind(this));
+    };
+
+    /**
+     * The competency was changed in the select list.
+     *
+     * @method _competencyChanged
+     * @param {Event} e
+     */
+    CompetencyPlanNavigation.prototype._competencyChanged = function(e) {
+        if (this._ignoreFirstCompetency) {
+            this._ignoreFirstCompetency = false;
+            return;
+        }
+        var newCompetencyId = $(e.target).val();
+        var queryStr = '?userid=' + this._userId + '&planid=' + this._planId + '&competencyid=' + newCompetencyId;
+        document.location = this._baseUrl + queryStr;
+    };
+
+    /** @type {Number} The id of the competency. */
+    CompetencyPlanNavigation.prototype._competencyId = null;
+    /** @type {Number} The id of the user. */
+    CompetencyPlanNavigation.prototype._userId = null;
+    /** @type {Number} The id of the plan. */
+    CompetencyPlanNavigation.prototype._planId = null;
+    /** @type {String} Plugin base url. */
+    CompetencyPlanNavigation.prototype._baseUrl = null;
+    /** @type {Boolean} Ignore the first change event for competencies. */
+    CompetencyPlanNavigation.prototype._ignoreFirstCompetency = null;
+
+    return /** @alias module:tool_lp/competency_plan_navigation */ CompetencyPlanNavigation;
+
+});
diff --git a/admin/tool/lp/amd/src/user_competency_plan_popup.js b/admin/tool/lp/amd/src/user_competency_plan_popup.js
new file mode 100644
index 00000000000..5ee24906501
--- /dev/null
+++ b/admin/tool/lp/amd/src/user_competency_plan_popup.js
@@ -0,0 +1,124 @@
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * Module to open user competency plan in popup
+ *
+ * @package    report_competency
+ * @copyright  2016 Issam Taboubi <issam.taboubi@umontreal.ca>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+
+define(['jquery', 'core/notification', 'core/str', 'core/ajax', 'core/templates', 'tool_lp/dialogue'],
+       function($, notification, str, ajax, templates, Dialogue) {
+
+    /**
+     * UserCompetencyPopup
+     *
+     * @param {String} The regionSelector
+     * @param {String} The userCompetencySelector
+     * @param {Number} The plan ID
+     */
+    var UserCompetencyPopup = function(regionSelector, userCompetencySelector, planId) {
+        this._regionSelector = regionSelector;
+        this._userCompetencySelector = userCompetencySelector;
+        this._planId = planId;
+
+        $(this._regionSelector).on('click', this._userCompetencySelector, this._handleClick.bind(this));
+    };
+
+    /**
+     * Get the data from the closest TR and open the popup.
+     *
+     * @method _handleClick
+     * @param {Event} e
+     */
+    UserCompetencyPopup.prototype._handleClick = function(e) {
+        var tr = $(e.target).closest('tr');
+        var competencyId = $(tr).data('competencyid');
+        var userId = $(tr).data('userid');
+        var planId = this._planId;
+
+        var requests = ajax.call([{
+            methodname : 'tool_lp_data_for_user_competency_summary_in_plan',
+            args: { competencyid: competencyId, planid: planId },
+            done: this._contextLoaded.bind(this),
+            fail: notification.exception
+        }]);
+
+        // Log the user competency viewed in plan event.
+        requests[0].then(function(){
+            ajax.call([{
+                methodname : 'core_competency_user_competency_viewed_in_plan',
+                args: { competencyid: competencyId, userid: userId, planid: planId },
+                fail: notification.exception
+            }]);
+        });
+    };
+
+    /**
+     * We loaded the context, now render the template.
+     *
+     * @method _contextLoaded
+     * @param {Object} context
+     */
+    UserCompetencyPopup.prototype._contextLoaded = function(context) {
+        var self = this;
+        templates.render('tool_lp/user_competency_summary_in_plan', context).done(function(html, js) {
+            str.get_string('usercompetencysummary', 'report_competency').done(function(title) {
+                (new Dialogue(title, html, templates.runTemplateJS.bind(templates, js), self._refresh.bind(self), true));
+            }).fail(notification.exception);
+        }).fail(notification.exception);
+    };
+
+    /**
+     * Refresh the page.
+     *
+     * @method _refresh
+     */
+    UserCompetencyPopup.prototype._refresh = function() {
+        var planId = this._planId;
+
+        ajax.call([{
+            methodname : 'tool_lp_data_for_plan_page',
+            args: { planid: planId},
+            done: this._pageContextLoaded.bind(this),
+            fail: notification.exception
+        }]);
+    };
+
+    /**
+     * We loaded the context, now render the template.
+     *
+     * @method _pageContextLoaded
+     * @param {Object} context
+     */
+    UserCompetencyPopup.prototype._pageContextLoaded = function(context) {
+        var self = this;
+        templates.render('tool_lp/plan_page', context).done(function(html, js) {
+            templates.replaceNode(self._regionSelector, html, js);
+        }).fail(notification.exception);
+    };
+
+    /** @type {String} The selector for the region with the user competencies */
+    UserCompetencyPopup.prototype._regionSelector = null;
+    /** @type {String} The selector for the region with a single user competencies */
+    UserCompetencyPopup.prototype._userCompetencySelector = null;
+    /** @type {Number} The plan Id */
+    UserCompetencyPopup.prototype._planId = null;
+
+    return /** @alias module:tool_lp/user_competency_plan_popup */ UserCompetencyPopup;
+
+});
diff --git a/admin/tool/lp/classes/output/competency_plan_navigation.php b/admin/tool/lp/classes/output/competency_plan_navigation.php
new file mode 100644
index 00000000000..58ab38bfc9f
--- /dev/null
+++ b/admin/tool/lp/classes/output/competency_plan_navigation.php
@@ -0,0 +1,102 @@
+<?php
+// This file is part of Moodle - http://moodle.org/
+//
+// Moodle is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// Moodle is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
+
+/**
+ * User competency plan page class.
+ *
+ * @package    tool_lp
+ * @copyright  2016 Issam Taboubi <issam.taboubi@umontreal.ca>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+namespace tool_lp\output;
+
+use renderable;
+use renderer_base;
+use templatable;
+use context_course;
+use \core_competency\external\competency_exporter;
+use stdClass;
+
+/**
+ * User competency plan navigation class.
+ *
+ * @package    tool_lp
+ * @copyright  2016 Issam Taboubi <issam.taboubi@umontreal.ca>
+ * @license    http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later
+ */
+class competency_plan_navigation implements renderable, templatable {
+
+    /** @var userid */
+    protected $userid;
+
+    /** @var competencyid */
+    protected $competencyid;
+
+    /** @var planid */
+    protected $planid;
+
+    /** @var baseurl */
+    protected $baseurl;
+
+    /**
+     * Construct.
+     *
+     * @param int $userid
+     * @param int $competencyid
+     * @param int $planid
+     * @param string $baseurl
+     */
+    public function __construct($userid, $competencyid, $planid, $baseurl) {
+        $this->userid = $userid;
+        $this->competencyid = $competencyid;
+        $this->planid = $planid;
+        $this->baseurl = $baseurl;
+    }
+
+    /**
+     * Export the data.
+     *
+     * @param renderer_base $output
+     * @return stdClass
+     */
+    public function export_for_template(renderer_base $output) {
+
+        $data = new stdClass();
+        $data->userid = $this->userid;
+        $data->competencyid = $this->competencyid;
+        $data->planid = $this->planid;
+        $data->baseurl = $this->baseurl;
+
+        $plancompetencies = \core_competency\api::list_plan_competencies($data->planid);
+        $data->competencies = array();
+        $contextcache = array();
+        foreach ($plancompetencies as $plancompetency) {
+            $frameworkid = $plancompetency->competency->get_competencyframeworkid();
+            if (!isset($contextcache[$frameworkid])) {
+                $contextcache[$frameworkid] = $plancompetency->competency->get_context();
+            }
+            $context = $contextcache[$frameworkid];
+            $exporter = new competency_exporter($plancompetency->competency, array('context' => $context));
+            $competency = $exporter->export($output);
+            if ($competency->id == $this->competencyid) {
+                $competency->selected = true;
+            }
+            $data->competencies[] = $competency;
+        }
+        $data->hascompetencies = count($data->competencies);
+        return $data;
+    }
+}
diff --git a/admin/tool/lp/classes/output/renderer.php b/admin/tool/lp/classes/output/renderer.php
index f2c68c0aeaf..ca45e2980f2 100644
--- a/admin/tool/lp/classes/output/renderer.php
+++ b/admin/tool/lp/classes/output/renderer.php
@@ -206,6 +206,17 @@ class renderer extends plugin_renderer_base {
         return parent::render_from_template('tool_lp/user_competency_course_navigation', $data);
     }
 
+    /**
+     * Defer to template.
+     *
+     * @param competency_plan_navigation $nav
+     * @return string
+     */
+    public function render_competency_plan_navigation(competency_plan_navigation $nav) {
+        $data = $nav->export_for_template($this);
+        return parent::render_from_template('tool_lp/competency_plan_navigation', $data);
+    }
+
     /**
      * Defer to template.
      *
diff --git a/admin/tool/lp/templates/competency_plan_navigation.mustache b/admin/tool/lp/templates/competency_plan_navigation.mustache
new file mode 100644
index 00000000000..53aa5d30351
--- /dev/null
+++ b/admin/tool/lp/templates/competency_plan_navigation.mustache
@@ -0,0 +1,22 @@
+<div class="pull-right well">
+{{#hascompetencies}}
+<span>
+<label for="competency-nav-{{uniqid}}" class="accesshide">{{#str}}jumptocompetency, tool_lp{{/str}}</label>
+<select id="competency-nav-{{uniqid}}">
+{{#competencies}}
+<option value="{{id}}" {{#selected}}selected="selected"{{/selected}}>{{shortname}} {{idnumber}}</option>
+{{/competencies}}
+</select>
+</span>
+{{/hascompetencies}}
+</form>
+</div>
+{{#js}}
+require(['core/form-autocomplete', 'tool_lp/competency_plan_navigation'], function(autocomplete, nav) {
+    (new nav('#competency-nav-{{uniqid}}', '{{baseurl}}', {{userid}}, {{competencyid}}, {{planid}}));
+{{#hascompetencies}}
+    autocomplete.enhance('#competency-nav-{{uniqid}}', false, false, '{{#str}}jumptocompetency, tool_lp{{/str}}');
+{{/hascompetencies}}
+
+});
+{{/js}}
diff --git a/admin/tool/lp/templates/plan_page.mustache b/admin/tool/lp/templates/plan_page.mustache
index 1b66ee3f022..2039a21bcf4 100644
--- a/admin/tool/lp/templates/plan_page.mustache
+++ b/admin/tool/lp/templates/plan_page.mustache
@@ -126,7 +126,7 @@
                         {{#plan.canbeedited}}
                         <span class="drag-handlecontainer pull-left"></span>
                         {{/plan.canbeedited}}
-                        <a href="{{pluginbaseurl}}/user_competency_in_plan.php?competencyid={{competency.id}}&amp;userid={{plan.userid}}&amp;planid={{plan.id}}">{{competency.shortname}}</a>
+                        <a data-usercompetency="true" href="#">{{competency.shortname}}</a>
                         <em>{{competency.idnumber}}</em>
                         {{#comppath}}
                             <br>
@@ -178,10 +178,11 @@
     </div>
 </div>
 {{#js}}
-require(['tool_lp/competencies', 'tool_lp/planactions', 'tool_lp/user_competency_workflow'], function(mod, actionsMod, UserCompWorkflow) {
+require(['tool_lp/competencies', 'tool_lp/planactions', 'tool_lp/user_competency_workflow', 'tool_lp/user_competency_plan_popup'], function(mod, actionsMod, UserCompWorkflow, Popup) {
     var planActions = new actionsMod('plan');
 
     (new mod({{plan.id}}, 'plan', {{contextid}}));
+    (new Popup('[data-region=plan-page]', '[data-usercompetency=true]', {{plan.id}}));
     planActions.registerEvents();
 
     var ucw = new UserCompWorkflow();
diff --git a/admin/tool/lp/user_competency_in_plan.php b/admin/tool/lp/user_competency_in_plan.php
index 1a1cd28de8a..3a48a475ffb 100644
--- a/admin/tool/lp/user_competency_in_plan.php
+++ b/admin/tool/lp/user_competency_in_plan.php
@@ -46,7 +46,11 @@ list($title, $subtitle) = \tool_lp\page_helper::setup_for_plan($userid, $url, $p
 $output = $PAGE->get_renderer('tool_lp');
 echo $output->header();
 echo $output->heading($title);
+// User competency plan navigation.
+$baseurl = new moodle_url('/admin/tool/lp/user_competency_in_plan.php');
+$nav = new \tool_lp\output\competency_plan_navigation($userid, $competencyid, $planid, $baseurl);
 
+echo $output->render($nav);
 $page = new \tool_lp\output\user_competency_summary_in_plan($competencyid, $planid);
 echo $output->render($page);
 // Trigger the viewed event.