CakePHP + JQM + Popup Widget = Why the appended 'placeholder'and empty content? - cakephp

I'm about to kill someone and I'm thinking of the JQM team at the moment. Sigh!
So, clearly I'm doing something stupid.
I've populated a JQM popup div with some info from my database and on first page load, clicking the button with the popup's id as HREF works great!
When I submit the form and return to the same page, it doesn't work. Inspecting the element I see that the ID of the popup is appended with '-placeholder' and the div simply has a comment in it.
Problem: On page reload, I can't click on the HREF that links to the popup (or I can but nothing happens - obviously because the markup has vanished).
Here's the view code of 1. the link to the popup div and 2. the actual pop up div on first and second page load.
Linking to popup:
Browse Database
Original popup div element
<div id="reqform_search_sicnaic" data-role="popup">
<div data-role="header" data-theme="b">
Random Header
</div>
<div data-role="content">
Random content
</div>
</div>
Popup div after form submission / second page load
<div style="display: none;" id="reqform_search_sicnaic-placeholder"><!-- placeholder for reqform_search_sicnaic --></div>
Obviously, I can't open the dialog on page load. :(

Related

How to link to a specific section of a Bootstrap modal

I have a simple website made with react, I am trying to add some links at the top of a Boostrap modal, so that when clicked, it takes you to a specific section of the modal.
for example a link looks like this,
<h4>Infected Olecrenon Bursitis</h4>
and the div I want it to take us to looks like this,
<div className="text-left border border-info rounded" id="iob">
//some code
</div>
Before opening the Bootstrap modal, we are on this page link. www.page.com/primary/guide Then we click an img which then opens the modal.
If I try it with the above code, the modal disappears and the screen fades, and my url now says
www.page.com/primary/guide/#iob

How to keep AngularJS menu open when changing url

I need to keep a menu open when changing url. Right now if I click on View File or Diff the menu hides because the url will have a different path (/files , /diff).
Is there any way to prevent the menu from hiding when the url is changed?
This is my code:
Click to toggle menu
<div ng-show="collapsed">
<div class=container" ng-controller="MenuController" ng-show="show_menu()" ng-init="init_file_ids(number_of_files, selected_files)">
View File |
Diff |
Import |
Toggle chart
</div>
</div>
you want to make sure that collapsed variable is always set false when the pages are initiated. probably you can do that through controllers or from menu's directive controller.

Use angular material to make a popup

I have the following code that opens up a pop up and displays information returned by the function //showDetails(Data.path)// when we click on the icon.
<a ng-show="Data.path" ng-click="showDetails(Data.path)">
<ng-md-icon icon="info" style="fill: green" size="15"></ng-md-icon>
</a>
I want the data to appear in a md-dialog modal window. Is there an easy way to do that ?
You have to setup a controller which tells $mdDialog what it needs to do when the showDetails(...) function is triggered.
See: https://material.angularjs.org/latest/demo/dialog (Click "View Source" <> icon, and then switch to the "JS" tab to see an example of controller code to use; or just go straight to the Codepen).
If you are using ng-include for your modal, remember Angular creates a new child scope for it. You can acess the data in the modal using the following in your modal HTML:
{{$parent.Data.path}}

AngualrJS Left Navigation Menu Issue

I have the following sample code which provides the sample structure for the Left Nav Menu and the Middle Content section.
Here is the Plunker created for this example.
Plunker URL
When i click on Display Left Nav Menu Icon and select a menu item it updates the content of the view "content" as expected.
How ever as soon as i click on the LEft Nav Menu Icon the content from menu.html appear in the content view . Not sure why it is happening.
Left Nav Icon is in leftnav.html and it's handlers are in leftnav.controller.js why the main controller is getting invoked ??
Could you please let me know.
Thanks.
You have a location in the href of your a tag. Just getting rid of that should give you the correct functionality.
<a href="" class="btn btn-default" id="menu-toggle" ng-click='toggle()'>

How do I determine the page location immediately?

I have a main menu on my website for every page except the login page. In my html, I have:
<div ng-if="$root.location !== '/login'">
<mainmenu></mainmenu>
</div>
This works in general, except the main menu flashes when I load the login page. I suspect this is because the menu is shown, then the variable $root.location becomes /login, then the main menu disappears.
How do I do this so the main menu doesn't flash?

Resources