Print Page - div.html(), div.load() and JeasyUI styles

Title: div.html(), div.load() and JeasyUI styles
Post by: fguibert on October 04, 2018, 03:28:10 AM

Hi all

I'm trying to fill a div with JeasyUI widgets, by using JQuery's .html() and load() method.
but when I put Jeasyui content in the div, it didn't render correctly.

for example, a simple button in my page renders correctly, but when I try to load a Jeasyui button in a div content, it render only a link, not a button, like Jeasyui CSS was not found :

Code:

<!DOCTYPE html>
<html>
    <head>
        <title>Basic Form - jQuery EasyUI Demo</title>
        <link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/default/easyui.css">
        <link rel="stylesheet" type="text/css" href="https://www.jeasyui.com/easyui/themes/icon.css">
        <script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.min.js"></script>
        <script type="text/javascript" src="https://www.jeasyui.com/easyui/jquery.easyui.min.js"></script>
    </head>
    <body>
        <a id="btn" href="#" onclick="load()" class="easyui-linkbutton">click to load, this not work</a>

<div id="mydiv">
</div>
        
        
        <script>
        function load() {
        $('#mydiv').html(' <a id="btn2" href="#" class="easyui-linkbutton">not a jeasyui button</a>');
        }
        </script>
    </body>
</html>

any idea ? thanks a lot

Title: Re: div.html(), div.load() and JeasyUI styles
Post by: Coder on October 12, 2018, 03:27:30 AM

Code:

<script>
        function load() {
        $('#mydiv').html(' <a id="btn2" href="#" class="easyui-linkbutton">not a jeasyui button</a>');
        $('#btn2').linkbutton();
        }
        </script>

Title: Re: div.html(), div.load() and JeasyUI styles
Post by: Coder on October 12, 2018, 03:48:06 AM

or try "defer"

Code:

		<script type="text/javascript" defer="defer">

        function load() {
        $('#mydiv').html(' <a id="btn2" href="#" class="easyui-linkbutton">not a jeasyui button</a>');
        }
        </script>

or try my hook for bottompage <script src="https://code.jquery.com/jquery-2.2.4.min.js"> tag :

Code:

		<script type="text/javascript" defer="defer">
			function doDialogInit(){
				if ( window.jQuery && ($('#pageLoader').css('display') == 'none')){
          dlgABC_Init();
    dlgABCD_Init();
				}else{
					window.setTimeout("doDialogInit()",100);
				}
			};
			doDialogInit();
		</script>

Title: Re: div.html(), div.load() and JeasyUI styles
Post by: fguibert on March 01, 2019, 04:11:58 AM

thanks a lot coder, it works like a charm

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: fguibert on October 04, 2018, 03:28:10 AM