Liferay >>> open Liferay popup in web content

This post is about the solution to the problem i faced in liferay where i need to open one or more Liferay styled modal popups from web content portlet or similarly from any other portlet. In my case the popup i need to open is that of feedback from user. The steps i took to get it working are:

1. 
   To start with add an anchor tag in the web content portlet on which you want to open up a feedback popup
   

   <a id="" class="feedback_popup"> Submit Feedback</a>

2. 
   Now you need to go to the theme/javascript folder and edit javascript.js file. Add to it the code
   
   

   jQuery(document).ready(
   function() {
   th_FeedbackPopup()
   }
   );
   
   function th_FeedbackPopup() {
   jQuery(document).find("a.feedback_popup").click(function() {
   var url = new Liferay.PortletURL.createRenderURL();
   url.setPortletId("FEEDBACK_1");
   url.setWindowState("exclusive");
   url.setPortletMode("view");
   url.setParameter("struts_action", "/ext/feedvack/view");
   var popup = Liferay.Popup({
   draggable:false,
   width:500,
   height:'auto',
   url:url.toString(),
   resizable:false,
   modal:true,
   title:'Submit Feedback',
   position:[250,20]
   });
   });
   }

   The idea behing javascript is to bind the click event of all anchor elements on page having class "feedback_popup" to open a modal popup. Make sure that you should bind the event based on class name and not on element id as a page can have multiple such elements.