Forums

Home » Liferay Portal » English » 3. Development »

Combination View Flat View Tree View
Threads [ Previous | Next ]
toggle
Kamesh Sampath
Portlet Namespace and jQuery
July 15, 2011 2:11 PM
Answer

Kamesh Sampath

Rank: Regular Member

Posts: 105

Join Date: May 26, 2010

Recent Posts

Hi,

I am facing a peculiar issue with <portlet:namespace/> when used with jQuery, i followed the blog by Jonas, but quiet strangely my jQuery Javascript method is not picked up emoticon

<aui:button id="<portlet:namespace />cmdLookupTemplate" data="<%= data %>" value="select" />
<script type="text/javascript">
jQuery(document)
        .ready(
                function() {
                    jQuery('#<portlet:namespace />cmdLookupTemplate')
                            .click(
                                    function() {
                                        var popup = window
                                                .open(
                                                        'http://www.liferay.com',
                                                        'Select Template',
                                                        'directories=no,height=640,location=no,menubar=no,resizable=yes,scrollbars=yes,status=no,toolbar=no,width=680');

                                        popup.focus();
                                    });

                });
</script>

Can anyone let me know if I am missing anything ? and also is there anyway where we could use <portlet:namespace> in a Javascript file that will be included using <header-portlet-javascript/>

Thanks
Kamesh
Kamesh Sampath
RE: Portlet Namespace and jQuery
July 15, 2011 2:44 PM
Answer

Kamesh Sampath

Rank: Regular Member

Posts: 105

Join Date: May 26, 2010

Recent Posts

got it solved, there was some browser cache issue and after i refreshed i worked.

Also i observed couple of things which might be useful for the community,
  • for aui:input tags id vlaues are automatically prefiexed with <portlet:namespace/>
  • for <aui:buttons we need to prefix the id atribute with portlet:namespace


Some correct me if my understanding is wrong.

Here is that working piece of code


....
<aui:input cssClass="lfr-input-text-container"
                inlineField="<%= true %>" id="template-name"
                name="template-name" size="55" type="text" />
            <%
                long dlScopeGroupId = groupId;
                        
                        if (liveGroup.isStaged()
                            && !liveGroup.isStagedRemotely()
                            && !liveGroup
                                .isStagedPortlet(PortletKeys.DOCUMENT_LIBRARY)) {
                        dlScopeGroupId = liveGroup.getGroupId();
                        }
            %>

            <liferay-portlet:renderURL portletName="15"
                windowState="<%= LiferayWindowState.POP_UP.toString() %>"
                var="selectDLURL">
                <liferay-portlet:param name="struts_action"
                    value="/journal/select_document_library" />
                <liferay-portlet:param name="currentURL" value="<%= currentURL%>" />
                <liferay-portlet:param name="groupId"
                    value="<%= String.valueOf(dlScopeGroupId) %>" />
            </liferay-portlet:renderURL>       
            
            <%
                Map<String, Object> data = new HashMap<String, Object>();
                        data.put("DocumentlibraryUrl", selectDLURL);
            %>
            
            <aui:button id="<portlet:namespace />cmdLookupTemplate" name="cmdLookupTemplate" cssClass="journal-documentlibrary-button"
                data="<%= data %>" value="select" />
         
    </aui:fieldset>

    <aui:button-row>
        <aui:button name="setButton" type="submit" value="set-button" />
    </aui:button-row>
</aui:form>

<script type="text/javascript">
var <portlet:namespace/>popup;
var _15_selectDocumentLibrary;
jQuery(document)
        .ready(
                function() {
                   
                    jQuery('#<portlet:namespace/>cmdLookupTemplate')
                            .click(
                                    function() {
                                        <portlet:namespace/>popup = window
                                                .open(
                                                        jQuery("#<portlet:namespace/>cmdLookupTemplate").attr('data-documentlibraryurl'),
                                                        'Select Template',                                                        'directories=no,height=640,location=no,menubar=no,resizable=yes,scrollbars=yes,status=no,toolbar=no,width=680');

                                        <portlet:namespace/>popup.focus();
                                    });
                   
                    _15_selectDocumentLibrary=function(url){
                          <portlet:namespace/>popup.close();
                           //alert("Selected document"+url);
                           jQuery("#<portlet:namespace/>template-name").val(url);
                        };   
                });
               
            
</script>

Thanks.
Kamesh