Jump to content

Page Select edit links


Macrura
 Share

Recommended Posts

I need to make a quick and easy way to access the edit page for page selects, usually with AsmSelect;

so far i have been able to use this jquery to turn the label for the AsmSelect into a link to the page editor for that selected page, but i can't figure any easy way to make it into a modal.. anyone else tried to do this yet?

$(function(){
   $('div.InputfieldPageAutocomplete ol li').each(function(){
   var id = $(this).find('span.itemValue').text();
   $(this).find('span.itemLabel').wrapInner(" <a class='edit-modal' href='"+config.urls.admin+"page/edit/?id="+id+"' target='_blank'></a>");
   });
});	

adding this with the AdminCustomFiles assigned to process page edit..

Link to comment
Share on other sites

On a CustomAdminPage i use this jquery to get the magnific popup working and add the needed ?modal=1 to the edit links of the pagelisttree....

so may it helps:

<style type="text/css" media="screen">
	/**
	 * larget magnific popup
	 */
	.mfp-iframe-holder .mfp-content {
		max-width: 1200px!important;
	}
</style>
<script type="text/javascript">
$(document).ajaxComplete(function() {

		//add trigger class and modal setup
		$('.PageListActionEdit a').each(function(){
		    $(this).addClass("lb-edit").attr("href",$(this).attr('href')+"&modal=1");
		});

		$('.PageListActionNew a').each(function(){
			$(this).addClass("lb-edit").attr("href",$(this).attr('href')+"&modal=1");
		});

		//setup lightbox
		$('.lb-edit').magnificPopup({
			type: 'iframe',
			disableOn: 0
		});
});

</script>
<?php

//get Magnific css and js
$this->modules->get('JqueryMagnific');

regards mr-fan

  • Like 2
Link to comment
Share on other sites

I thought magnific was the inbuilt modal?

On the CustomAdminPage i only have to load the scripts to get it work since they not loaded automatically with this kind of adminpage/process....but the jquery part should work in the "normal" adminpages....but i've not to much experience on this....

Link to comment
Share on other sites

MagnificPopup should be enabled when you want to do this. By default it's not. You could add the requirements with pure javascript. Something like the below might work. But the better way is like mr-fan mentioned to load the module with $this->modules->get('JqueryMagnific');

var head = document.getElementsByTagName('head')[0],
    first = document.getElementsByTagName('script')[0],
    script = document.createElement("script"),
    style = document.createElement("link");

script.src = '/wire/modules/Jquery/JqueryMagnific/JqueryMagnific.js';
style.href = '/wire/modules/Jquery/JqueryMagnific/JqueryMagnific.css';
style.type = 'text/css';
head.insertBefore(script, first);
head.insertBefore(style, script); 

As mr-fan points out you have to wait on ajaxComplete and attach the handlers to the popup links.

A custom module fits better here then the use of AdminCustomFiles IMHO.

Link to comment
Share on other sites

thanks everyone!

actually the original code was close, i was using the wrong magnific popup type (ajax).. (magnific popup is already loaded on page edit)

added the &modal=1 to the link.. so this is the final custom js file to accomplish this:

$(function(){
	$('div.InputfieldPageAutocomplete ol li').each(function(){
		var id = $(this).find('span.itemValue').text();
		$(this).find('span.itemLabel').wrapInner(" <a class='edit-modal' href='"+config.urls.admin+"page/edit/?id="+id+"&modal=1' target='_blank'></a>");
	});
});	

$(document).ready(function(){
   $('span.itemLabel a').magnificPopup({ type: 'iframe'});
});

As far as a module, yes i think it would be cleaner to have a configurable module where you could somehow set the behavior of the link (new window, lightbox etc.) and then that module could output the linked title for the page select... also I think this code only works on page Autocomplete fields since it targets that particular structure which is an ol > li > span.. 

it does seem like being able to optionally link the title of any page select item to an editor for that item would be a huge time saver in many instances.. right now this is saving me a ton of time!

  • Like 4
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...