Question

Here is the function part , I put it in the main page, which is the page has accordation, it does not work unfortunately.

<script type="text/javascript">

$('.easyui-accordion').css('height', '240px') <====this is 

function addTab(title, url){  
    if ($('#tt').tabs('exists', title)){  
        $('#tt').tabs('select', title);  
    } else {  
        var content = '<iframe scrolling="auto" frameborder="0"  src="'+url+'" style="width:100%;height:100%;"></iframe>';  
        $('#tt').tabs('add',{  
            title:title,  
            content:content,  
            closable:true  
        });  
    }  
}  

$(document).ready(function(){
    $("#closeMe").click(function() {
        $(this)
            .parent()
            .slideUp();
    });
});

</script>
</head>

Part 2 and optional: Also, i have some other page also can not call the jquery function properly, would you mind have a look at it?
This is for calling a popup box using jquery.

<script>

$(function() { $("#openDialog").on('click', loadDialogBox); });

function loadDialogBox() {'
    $("#myEmptyDiv").load("popup.php", function() {

      $("#myEmptyDiv").dialog({
         title: "Permission Setting",
         autoOpen: false,
         buttons: { "Submit" : submitDialogForm() }
      });
      $("#myEmptyDiv").dialog("open");
    });
}

$(document).ready(function(){
$("#addlist").validate();
});
</script>

This is the link which suppose to generate a popup box of popup.php..

<a id="openDialog" href="#"> Permission Settings</a>

That is the last thing , Thank you very much for your help.

Answer 1

The text isn’t displayed properly because the accordion uses a fixed height, and it then calculates the panel-body and the header heights. So when you expand a panel, the text will not be displayed anymore (or partially) because it uses up all space.

A simple workaround for this is to add some height after pageload to the easyui-accordion container to compensate for your text.

see fiddle