Print Page - Troubelle loading an HTML in a pan

Title: Troubelle loading an HTML in a pan
Post by: yamilbracho on November 23, 2014, 04:13:55 PM

I have a layout and my main menu is an accordion in the west region.
Each option has a html (a crud code with .js and .php files associated).
To load the html code of each option i did this:

function showPage(strTitle, url) {
   if (currentUrl != url ) {
     currentUrl = url;
      $('#content')
         .empty()
         .panel('setTitle', strTitle)
         .panel('refresh', url);
   }
}

And the calling code is
<a href="javascript:void(0)"
onClick="showPage('Mantenimiento de Especialidades Medicas', './especialidad_medica/mant_especialidad_medica.php')">Especialidad Medica</a><br/>

Each HTML that i called is a table CRUD in a datagrid with its javascript code( addRec, editrec etc, functions)
When i select an option, the datagrid is shown fine but when i click, for example, (http://[img])[/img]the Add Rec button, i got this message in the javascript console (See Screen One).

And when i changed the panel('refresh',...) in the calling funcion, say

function showPage(strTitle, url) {
   if (currentUrl != url ) {
     currentUrl = url;
      $('#content')
         .empty()
         .panel('setTitle', strTitle)
         .load(url);
   }
}

With this change the addRec, Editrec and DeleteRec buttons works fine but the accordion become a mess!! (See Screen two)

TIA,
yamil

Title: Re: Troubelle loading an HTML in a pan
Post by: stworthy on November 23, 2014, 05:23:30 PM

By default the <body> elements will be extracted when calling 'refresh' method to load a content page.
Is your javascript code( addRec, editrec etc, functions) placed in the <head>? If so, please try to move it to the <body>.

Title: Re: Troubelle loading an HTML in a pan
Post by: yamilbracho on November 24, 2014, 08:45:49 PM

Thanks for your suggestion.
My code to load the page is :

Code:

 function showPage(strTitle, url) {
     $('#content')
	.empty()
	.panel('setTitle', strTitle)
	.panel('refresh', url);
 }

I also moved all my javascript code before the </body> tag in all my CRUD pages. and when i run my app. The accordion of the menu looks fine and when select any option (Screen One) the menu dissapear and the toolbar in the datagrid is shown twice (Screen two)
I checked the java script console and found some errors there. The "options" message is shown when i selected another option from the menu (or was left there!!)

Another hint, please...

Title: Re: Troubelle loading an HTML in a pan
Post by: yamilbracho on November 29, 2014, 07:18:52 PM

Hi,
I am still facing this issue..
When I use

Code:

var currentUrl = '';

function showPage(strTitle, url) {
	if (currentUrl != url ) {
	  currentUrl = url;

	  $('#content').panel('setTitle', strTitle);
	  $('#content').panel('refresh', currentUrl);
	}		
}

I got screen_one, the toolbar buttons appears twice and in the accordion menu some options disappear. Also when i click a button in the toolbar to show a dialog to edit information, it is shown a mess...

Then i change to load html code to :

Code:

var currentUrl = '';

function showPage(strTitle, url) {
	if (currentUrl != url ) {
	  currentUrl = url;

	  $('#content').panel('setTitle', strTitle);
	  $('#content').load(currentUrl);
	}		
}

In this case, it works fine except the accordion disappear...

In the html pages I moved the javascript code just before the </body> tag...

Anything i left out... ?

Title: Re: Troubelle loading an HTML in a pan
Post by: stworthy on November 30, 2014, 08:04:37 AM

What is the '#content' and what is the url? How do you design your page layout? Please provide an example or a link page to demonstrate your issue.

Title: Re: Troubelle loading an HTML in a pan
Post by: yamilbracho on November 30, 2014, 05:14:59 PM

Hi,
Enclosed my index.html

regards

Title: Re: Troubelle loading an HTML in a pan
Post by: stworthy on December 01, 2014, 03:10:04 AM

Please try the attached example 'test.zip'.

Title: Re: Troubelle loading an HTML in a pan
Post by: yamilbracho on December 02, 2014, 06:57:33 PM

Thanks a lot!!!
It looks like the problem as I created each option as a full html page (in my case .php). I mean i include jquery, jeasyuUi, their css and so on...
I cut off all og them in all my pages and works fine!!!

Again, thanls!!!

Title: Re: Troubelle loading an HTML in a pan
Post by: yamilbracho on December 03, 2014, 07:16:09 PM

Now I have this problem.
Each of my CRUD screens have a form with data fields needed for each screen:

In the index.html i wrote:

Code:

  
function showPage(strTitle, url) {
  if (currentUrl != url ) {
	 currentUrl = url;

       $('#content').panel('clear');
       $('#content').panel('setTitle', strTitle);
	$('#content').panel('refresh', currentUrl);
  }		
}

When i select, say, my first option "pais" (country) CRUD and click in the Add button in the toolbar i got the screen as shown in screen_one.
When i select another option, "clinica" (clinic) and when i click the Add button in the toolbar, the same screen as screen_one is shown!!!

Like an possible way to solve the problem i encapsulated my javascript code, this way :

Code:

ar paisController = {

	addRec: function() {
	  $('#dlg').dialog('open').dialog('setTitle','Agregar Pais');
	  $('#fm').form('clear');
		
	  setStatus('status_pais', constantes.STATUS_ACTIVO);
	  setAction(constantes.ACTION_CREATE);

	  url = './pais/crud_pais.php';
	},	
....
}

But it does not solve the problem... :-(

Any hint, please...

EasyUI Forum

General Category => EasyUI for jQuery => Topic started by: yamilbracho on November 23, 2014, 04:13:55 PM