diff --git a/enrol/self/locallib.php b/enrol/self/locallib.php
index 07873592be9..2d744930396 100644
--- a/enrol/self/locallib.php
+++ b/enrol/self/locallib.php
@@ -31,6 +31,16 @@ require_once("$CFG->libdir/formslib.php");
 class enrol_self_enrol_form extends moodleform {
     protected $instance;
 
+    /**
+     * Overriding this function to get unique form id for multiple self enrolments
+     *
+     * @return string form identifier
+     */
+    protected function get_form_identifier() {
+        $formid = $this->_customdata->id.'_'.get_class($this);
+        return $formid;
+    }
+
     public function definition() {
         $mform = $this->_form;
         $instance = $this->_customdata;
@@ -40,7 +50,9 @@ class enrol_self_enrol_form extends moodleform {
         if ($instance->password) {
             $heading = $plugin->get_instance_name($instance);
             $mform->addElement('header', 'selfheader', $heading);
-            $mform->addElement('passwordunmask', 'enrolpassword', get_string('password', 'enrol_self'));
+            //change the id of self enrolment key input as there can be multiple self enrolment methods
+            $mform->addElement('passwordunmask', 'enrolpassword', get_string('password', 'enrol_self'),
+                    array('id' => $instance->id."_enrolpassword"));
         } else {
             // nothing?
         }
diff --git a/lib/form/passwordunmask.js b/lib/form/passwordunmask.js
deleted file mode 100644
index cb2582d7112..00000000000
--- a/lib/form/passwordunmask.js
+++ /dev/null
@@ -1,26 +0,0 @@
-var is_ie = (navigator.userAgent.toLowerCase().indexOf("msie") != -1);
-
-document.getElementById(punmask.id).setAttribute("autocomplete", "off");
-
-var unmaskdiv = document.getElementById(punmask.id+"unmaskdiv");
-
-var unmaskchb = document.createElement("input");
-unmaskchb.setAttribute("type", "checkbox");
-unmaskchb.setAttribute("id", punmask.id+"unmask");
-unmaskchb.onchange = function() {unmaskPassword(punmask.id);};
-unmaskdiv.appendChild(unmaskchb);
-
-var unmasklbl = document.createElement("label");
-unmasklbl.innerHTML = punmask.unmaskstr;
-if (is_ie) {
-  unmasklbl.setAttribute("htmlFor", punmask.id+"unmask");
-} else {
-  unmasklbl.setAttribute("for", punmask.id+"unmask");
-}
-unmaskdiv.appendChild(unmasklbl);
-
-if (is_ie) {
-  // ugly hack to work around the famous onchange IE bug
-  unmaskchb.onclick = function() {this.blur();};
-  unmaskdiv.onclick = function() {this.blur();};
-}
\ No newline at end of file
diff --git a/lib/form/passwordunmask.php b/lib/form/passwordunmask.php
index b70f0d51f39..c0e517d2ca9 100644
--- a/lib/form/passwordunmask.php
+++ b/lib/form/passwordunmask.php
@@ -19,15 +19,17 @@ class MoodleQuickForm_passwordunmask extends MoodleQuickForm_password {
     }
 
     function toHtml() {
-        global $CFG;
+        global $PAGE;
+
         if ($this->_flagFrozen) {
             return $this->getFrozenHtml();
         } else {
-            $id = $this->getAttribute('id');
             $unmask = get_string('unmaskpassword', 'form');
-            $unmaskjs = html_writer::script(js_writer::set_variable('punmask', array('id'=>$id, 'unmaskstr'=>$unmask)));
-            $unmaskjs .= html_writer::script('', $CFG->httpswwwroot.'/lib/form/passwordunmask.js');
-            return $this->_getTabs() . '<input' . $this->_getAttrString($this->_attributes) . ' /><div class="unmask" id="'.$id.'unmaskdiv"></div>'.$unmaskjs;
+            $this->updateAttributes(array('autocomplete' => 'off'));
+            //Pass id of the element, so that unmask checkbox can be attached.
+            $PAGE->requires->yui_module('moodle-form-passwordunmask', 'M.form.passwordunmask',
+                    array(array('formid' => $this->getAttribute('id'), 'checkboxname' => $unmask)));
+            return $this->_getTabs() . '<input' . $this->_getAttrString($this->_attributes) . ' />';
         }
     } //end func toHtml
 
diff --git a/lib/form/yui/passwordunmask/passwordunmask.js b/lib/form/yui/passwordunmask/passwordunmask.js
new file mode 100644
index 00000000000..2b98922d47c
--- /dev/null
+++ b/lib/form/yui/passwordunmask/passwordunmask.js
@@ -0,0 +1,39 @@
+YUI.add('moodle-form-passwordunmask', function(Y) {
+    var PASSWORDUNMASK = function() {
+        PASSWORDUNMASK.superclass.constructor.apply(this, arguments);
+    }
+
+    Y.extend(PASSWORDUNMASK, Y.Base, {
+        //Initialize checkbox if id is passed
+        initializer : function(params) {
+            if (params && params.formid) {
+               this.add_checkbox(params.formid, params.checkboxname);
+            }
+        },
+        //Create checkbox for unmasking password
+        add_checkbox : function(elementid, checkboxlabel) {
+            var node = Y.one('#'+elementid);
+
+            //retaining unmask div from previous implementation.
+            var unmaskdiv = Y.Node.create('<div id="'+elementid+'unmaskdiv" class="unmask"></div>');
+
+            //Add checkbox for unmasking to unmaskdiv
+            var unmaskchb = Y.Node.create('<input id="'+elementid+'unmask" type="checkbox">');
+            unmaskdiv.appendChild(unmaskchb);
+            //Attach event using static javascript function for unmasking password.
+            unmaskchb.on('click', function() {unmaskPassword(elementid);});
+
+            //Add label for checkbox to unmaskdiv
+            var unmasklabel = Y.Node.create('<label for="'+elementid+'unmask">'+checkboxlabel+'</label>');
+            unmaskdiv.appendChild(unmasklabel);
+
+            //Insert unmask div in the same div as password input.
+            node.get('parentNode').insert(unmaskdiv, node.get('lastNode'));
+        }
+    });
+
+    M.form = M.form || {};
+    M.form.passwordunmask = function(params) {
+        return new PASSWORDUNMASK(params);
+    }
+}, '@VERSION@', {requires:['base', 'node']});
\ No newline at end of file
diff --git a/lib/formslib.php b/lib/formslib.php
index 91e49bd1f7a..f6b4cee6ece 100644
--- a/lib/formslib.php
+++ b/lib/formslib.php
@@ -141,9 +141,10 @@ abstract class moodleform {
         if (empty($action)){
             $action = strip_querystring(qualified_me());
         }
-
-        $this->_formname = get_class($this); // '_form' suffix kept in order to prevent collisions of form id and other element
+        // Assign custom data first, so that get_form_identifier can use it.
         $this->_customdata = $customdata;
+        $this->_formname = $this->get_form_identifier();
+
         $this->_form = new MoodleQuickForm($this->_formname, $method, $action, $target, $attributes);
         if (!$editable){
             $this->_form->hardFreeze();
@@ -163,6 +164,18 @@ abstract class moodleform {
         $this->_process_submission($method);
     }
 
+    /**
+     * It should returns unique identifier for the form.
+     * Currently it will return class name, but in case two same forms have to be
+     * rendered on same page then override function to get unique form identifier.
+     * e.g This is used on multiple self enrollments page.
+     *
+     * @return string form identifier.
+     */
+    protected function get_form_identifier() {
+        return get_class($this);
+    }
+
     /**
      * To autofocus on first form element or first element with error.
      *