$( #divid ).load(pagename.jsp) not working in liferay 6.1

Question

<script type='text/javascript' src='js/jquery.js'></script>

<script type="text/javascript">
    $(document).ready(function() {
        $("#gt").click(function() {

            $("#internal").load('second.jsp');   //not working....
            alert("loaded");

        });
    });
</script>


    Happy new year...................
    <a href="#" id="gt"> Click me </a>

    <p id="para"></p>

    <div id="internal"> a</div>

I am working in eclipse with Liferay 6.1. JQuery is working properly...i am able to change innerHTML of divisions and alert box also coming.. But not able to load page inside the div. The same code is working properly in simple Dynamic web project. Can any body help me pls...

Answer 1

Make sure your second.jsp is available to your webbrowser: You are in a portlet environment, thus you cannot assume that ./second.jsp is referring to the same directory as the jsp is in that is serving the content you pasted in your question. Most likely you'll need a different path - if your jsp is in /WEB-INF, you'll even need to move it somewhere else, so that it can be dynamically requested.

Further, if second.jsp needs access to the portal session, you'd better use a resource-request to your portlet. <portlet:resourceURL/> will be your friend for this.

As charlietfl suggests in the comment to your question, the best way is to use an HTTP-level output in your browser (e.g. firebug) and see what kind of request is actually sent.

Also, as you're in a portal environment, you may want to append/prepend <portlet:namespace/> to the id you're giving - otherwise you'll have duplicate ids when your portlet is added to the page twice (or someone else chooses to use the same id)

Answer 2

u have not specified any callback function to be called after load.

$('#reinternalult').load('second.jsp', function() {
  alert('Load was performed.');
});

make sure the path of second.jsp is correct and it properly outputs the html

also try to call second.jsp directly from browser and see what you get

Answer 3

Also use the .on() method instead of .click() method. This will save you from DOM bloat

$(document).ready(function() { $('body').on('click','#gt',function() {

        $("#internal").load('second.jsp', function(){
              alert("loaded");
        });
     });

});