Keyword

Frontend item edit dialog does not open modally.

  • Phil G
  • Phil G's Avatar Topic Author
  • Offline
  • New Member
More
12 years 3 weeks ago #103298 by Phil G
Hello,

I have a problem where the Frontend Item Edit form opens in the whole page, thus taking over the page. This happens on Firefox, Chrome & IE. THe behavior is different if I change my template, but it's till not correct. I want to get this working with my current template.

I use GCal and I've changed it to use jquery: gcal only.
I'm testing using the beez-20 and atomic templates. I don't have any others to use.

I've searched around on here for an answer, and see that people have had similar problems. Here follows my findings:


To reproduce the problem:

In the frontend, logged in with editing rights Click "edit item"

(with beez_20 template loaded)
Expected result:
Item should open in edit mode in squeezebox modal window.
Close button should close the modal view.

Actual result:
Item opens in edit mode in full page
Close button just reloads the item in edit mode, full page.

Second test:
(with atomic template loaded)

Actual result:
Item opens in edit mode in modal window ( cool :) )
Close button just reloads the original page in the squeezebox view. ( not cool)

So does anyone have any idea what might be causing this? What should I be looking for in my template files? I've looked for the word modal in all files of both templates' folders , but there's only
/* image upload modal */

#all #upload-flash ul li a:hover,
#all .item a:hover span {
	background:#095197;
	color:#fff;
}
#close a
{text-decoration:none}

and
a.modal-button,
.button2-left .blank a,
.button2-left a,
.button2-left div.readmore a
{background:#eee;
padding:4px !important;
margin:0 !important;
line-height:1.2em; border:solid 1px #ddd;
font-weight:bold; text-decoration:none;
margin-top:10px !important}

in the beez_20 template but nothing apart from that. Commenting those out did not fix the issue.

Finally hear's the header section of my page, maybe it will help to find the problem:
<head>
  <base href="http://caj78.fr/index.php/course/test" />
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <meta name="generator" content="Joomla! - Open Source Content Management" />
  <title>Root Category</title>
  <link href="/templates/beez_20/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon" />
  <link href="http://caj78.fr/index.php/component/search/?Itemid=509&amp;format=opensearch" rel="search" title="Valider Club Athlétisme Jeunesse" type="application/opensearchdescription+xml" />
  <link rel="stylesheet" href="/media/system/css/modal.css" type="text/css" />
  <link rel="stylesheet" href="/components/com_k2/css/k2.css" type="text/css" />
  <link rel="stylesheet" href="/plugins/content/jw_sigpro/jw_sigpro/includes/js/jquery_slimbox/css/slimbox2.css" type="text/css" />
  <link rel="stylesheet" href="/plugins/content/jw_sigpro/jw_sigpro/tmpl/Artistic/css/template.css" type="text/css" media="screen"  />
  <link rel="stylesheet" href="/plugins/content/jw_sigpro/jw_sigpro/includes/css/print.css" type="text/css" media="print"  />
  <link rel="stylesheet" href="/templates/system/css/system.css" type="text/css" />
  <link rel="stylesheet" href="/templates/beez_20/css/position.css" type="text/css" media="screen,projection"  />
  <link rel="stylesheet" href="/templates/beez_20/css/layout.css" type="text/css" media="screen,projection"  />
  <link rel="stylesheet" href="/templates/beez_20/css/print.css" type="text/css" media="print"  />
  <link rel="stylesheet" href="/templates/beez_20/css/general.css" type="text/css" />
  <link rel="stylesheet" href="/templates/beez_20/css/general_mozilla.css" type="text/css" />
  <link rel="stylesheet" href="/templates/beez_20/css/personal.css" type="text/css" />
  <script src="/media/system/js/mootools-core.js" type="text/javascript"></script>
  <script src="/media/system/js/core.js" type="text/javascript"></script>
  <script src="/media/system/js/mootools-more.js" type="text/javascript"></script>
  <script src="/media/system/js/modal.js" type="text/javascript"></script>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js" type="text/javascript"></script>
  <script src="/components/com_k2/js/k2.js" type="text/javascript"></script>
  <script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js" type="text/javascript"></script>
  <script src="/plugins/content/jw_sigpro/jw_sigpro/includes/js/jquery_slimbox/js/slimbox2.js" type="text/javascript"></script>
  <script src="/plugins/content/jw_sigpro/jw_sigpro/includes/js/behaviour.js" type="text/javascript"></script>
  <script src="/templates/beez_20/javascript/md_stylechanger.js" type="text/javascript"></script>
  <script src="/templates/beez_20/javascript/hide.js" type="text/javascript"></script>
  <script type="text/javascript">

		window.addEvent('domready', function() {

			SqueezeBox.initialize({});
			SqueezeBox.assign($$('a.modal'), {
				parse: 'rel'
			});
		});
var K2SitePath = '/';
function keepAlive() {	var myAjax = new Request({method: "get", url: "index.php"}).send();} window.addEvent("domready", function(){ keepAlive.periodical(840000); });
  </script>

  
<!--[if lte IE 6]>
<link href="/templates/beez_20/css/ieonly.css" rel="stylesheet" type="text/css" />
<style type="text/css">
#line {
  width:98% ;
}
.logoheader {
  height:200px;
}
#header ul.menu {
  display:block !important;
  width:98.2% ;
}
</style>
<![endif]-->

<!--[if IE 7]>
<link href="/templates/beez_20/css/ie7only.css" rel="stylesheet" type="text/css" />
<![endif]-->

<script type="text/javascript">
  var big ='72%';
  var small='53%';
  var altopen='est ouvert';
  var altclose='est fermé';
  var bildauf='/templates/beez_20/images/plus.png';
  var bildzu='/templates/beez_20/images/minus.png';
  var rightopen='Ouvrir les infos';
  var rightclose='Fermer les infos';
  var fontSizeTitle='Taille de la police';
  var bigger='Augmenter';
  var reset='Réinitialiser';
  var smaller='Diminuer';
  var biggerTitle='Augmenter la taille';
  var resetTitle='Revenir aux styles par défaut';
  var smallerTitle='Réduire la taille';
</script>
</head>

If anyone can point me in the right direction I will investigate further. But I'm not sure where to look. How do you know what's conflicting with what? I use FireFox with FireBug. I'm a developer (not web, not php) by day so I know call stacks and I understand js syntax.

Thanks in advance,
Phil

Please Log in or Create an account to join the conversation.

More
12 years 3 weeks ago #103299 by Lefteris
Hi. It seems that your page has some javascript errors. Try to see the errors at the browser console.

JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)

Please Log in or Create an account to join the conversation.

  • Phil G
  • Phil G's Avatar Topic Author
  • Offline
  • New Member
More
12 years 2 weeks ago #103300 by Phil G
OK, I found the javascript error in my beez_20 template. And I now have the edit form loading in the lightbox yeaaaah :)

But wait, it's not over, I also have a javascript error that occurs when loading the edit fom in the light box:
Timestamp: 2012-09-19 11:06:50
Error: TypeError: parent.$("sbox-overlay").removeEvents is not a function
Source File: http://caj78.fr/media/k2/assets/js/k2.js?v=2.5.7
Line: 401

why would it think that removeEvents is not a function?

Please Log in or Create an account to join the conversation.

  • Phil G
  • Phil G's Avatar Topic Author
  • Offline
  • New Member
More
12 years 2 weeks ago - 12 years 2 weeks ago #103301 by Phil G
I just noticed another javascript error
Timestamp: 2012-09-19 11:17:06
Error: Exposing chrome JS objects to content without __exposedProps__ is insecure and deprecated. See https://developer.mozilla.org/en/XPConnect_wrappers for more information.
Source File: chrome://crossriderapp519/content/crossriderapi.js
Line: 186

Anyone seen anything like this?

Thaknks in advance,
Phil

Please Log in or Create an account to join the conversation.

  • Phil G
  • Phil G's Avatar Topic Author
  • Offline
  • New Member
More
12 years 2 weeks ago #103302 by Phil G
Fixed it!!!!

<rantMode>OK, Seeing as K2 and Simple Image Gallery are made by the same people I assumed they'd intelligently manage who loads jquery. Not SO :angry: </rantMode>

I noticed in my page header that different versions of jquery were actually being loaded twice, but I didn't know by who.

I want through the settings and finally found that Simple Image Gallery Pro was set to load latest Jquery library, but in fact it was loading version 1. and of course K2 was loading the latest (1.7).

So I disabled SIG from loading jquery and all is good.

I used Firefox firebug, and the Firefox web developer plugin to track this down.

I hope this post helps someone.

I've not done any web development for about 8 years. It's all got a lot more complicated, and convoluted than before. But I've also learned a lot in the last week or so.

Phil

Please Log in or Create an account to join the conversation.

More
12 years 2 weeks ago #103303 by Lefteris
Thanks for sharing this.

JoomlaWorks Support Team
---
Please search the forum before posting a new topic :)

Please Log in or Create an account to join the conversation.


Powered by Kunena Forum