Currently I'm working on a project using Zend framework and the message notification dialog box (using Facebox jquery).
I wanted to make my message notification dialog box to be smarter rather having the user click onto the link, before the Notification Message box appear. I wanted to make it if there's inbox messages then the message box appear else it doesn't appear on the screen.
I have 2 questions,
How can I make the message notfication dialog box popup when the page load . (without requiring the user click onto the link)
Second question how can I control the dialog box to display or not to display in Zend framework Controller?
Thanks so much in advance!
Here is my current code
When a user click onto the link, the Notification Message box appear on the screen
Notification Messages
Here the javascript code to Initialise the Facebox Modal window:
$('a[rel*=modal]').facebox(); // Applies modal window to any link with attribute rel="modal"
How can I make the message notfication dialog box popup when the page load . (without requiring the user click onto the link)
There are several way to do this, depending on your use case. If you want to notify users in "real time" you may use javascript setTimeout() or setInterval() functions to start a timer and trigger an ajax request to check for new message.
If you just want to do that on page load, well, a simple flag like var hasMessages = true; would do the trick.
In both case, consider writing a View Helper (see my second answer below)
Second question how can I control the dialog box to display or not to display in Zend framework Controller?
Controllers are not intended to "display" or "not display".
What you are probably looking for is View Helper
$(document).ready(function(){
$("a[rel=modal]").trigger("click");
});
$(document).ready(function(){
$(#dialog).dialog{
autoOpen:true; //#Dialog is div id of dialog box
}
Related
This may sound vague, I apologise for that. But I can't seem to find anything or anyone that's trying to do the same as me.
Although, I've just seen How to trigger open a jQuery UI dialog from a separate page? but I'm not sure that would strictly work.
I have a single profile page for members with the data driven by an XML feed. On the profile page is a link that opens a jQuery dialog box. This is working fine.
Elsewhere on the site, is another page that generates a list of members depending on a filter, with a link to that users profile. Also on this other page, with the list of members, is a duplicate link to the jQuery dialog box.
How can I make this duplicate link go to the profile page and automatically fire the jQuery dialog box to open?
My way to do this is to use Hash part of URL
for example your URL to profile from other page should be like this
profile#showdlg
and in profile page
var hash = window.location.hash.substr(1);
if(hash == "showdlg"){
//Show dialog here
}
And this should do the trick
You cannot (should not) directly trigger some script action in a page "to be loaded in future". Instead the trigger should be part of the page itself.
So if that profile page is generated in a dynamical way an approach would be to implement a conditional feature that adds such trigger (like using jquery to fire the dialog when the dom tree is ready, there are millions of examples for that). The condition would be whether the profile page has been called via such a special reference or not. You could detect that by looking at the HTTP-REFERER. So it boils down to: if called in a specific way, then add a 2-lines-of-code trigger to the profile page that initially fires the dialog.
To answer your comment below here some more detailed description:
There is not much coding involved. The links reference the users profile pages. The profile pages are generated by php I assume. So all you need to add is one detail: inside php check if the request currently processed has a certain referer it was raised from:
<?php .... if ('other_page.php'==$_SERVER[HTTP_REFERER]) { ... } ... ?>
If so you know that the profile page was called from that other page instead of the normal situation, so you want the UI dialog to fire by itself. For this you add a tiny javascript to the generated page which does the trick as soon as the page has loaded:
<script>$(document).ready(function(){$('#mydialog').raise();})</script>
The details obviously depend on what type of dialog and how it is raised. But you should get the idea of what I suggest...
I'd like to create a custom field in Drupal 7. This field should have a textfield and a button, when the user click on the button, it open a popup which load an external page, this page generate a link. Then the user copy and past this link in the textfield.
My question is, how can I create this custom field which open a popup window ?
Any suggestions?
Have you tried using Colorbox for building modal ajax dialogs? You could put
the necessary fields inside the popup. It is working, and it is also easy to understand.
There are also other modules available like Modal Frame API, Chaos tool suite, Popups API, etc.You can find a lot of modules needed for your purpose.
The following links might help you:
https://drupal.org/project/colorbox
https://drupal.org/project/popups
https://drupal.org/project/modalframe
I don't think I asked the question very well, so let me elaborate what I'm doing.
I'm building a simple website for a project my niece is working on. She wants to implement a ticket ordering system for their class graduation (this is all just for the project, it won't actually be used for anything in a production setting). She wanted a "map" of seats available and a way to distinguish seats that have been sold and seats that are open.
My vision for implementing this is creating three tables, one for each section. I'm using PHP to build the sections, and at the moment they contain an image that indicates if the seat is taken or not that is wrapped in an anchor tag that points to the same page with the url:
<a href='index.php?section=$section&row=$i&seat=$j' class='order'><img src='open.png'></a>
So my grand plan was, when they click on the image for a particular seat to have a modal dialog pop up that does one of two things.
If the seat is already taken, it will simply display the buyer's information. If the seat is not taken, it will contain a form that will allow the user to input their information and submit it, which will then write to a MySQL database table that stores this data.
I was using the jQuery UI dialog for modal forms (http://jqueryui.com/dialog/#modal-form) to accomplish the modal dialog before I tried adding the index.php?section= etc to the anchors, and now that I've added that part it flashes up the dialog but then the page refreshes and the dialog disappears.
My question is, is there a way to store the section/row/seat information in the anchor in such a way so as not to refresh the page when it's clicked on? Could I add some code before the HTML tag on index.php to handle when the anchor has been clicked? The last time I worked with PHP was several years ago and I'm very rusty and not certain how to tackle this problem.
You need to cancel the click event. That is, tell the browser to do some Javascript work (like open a dialog), and then cancel the click so as not to load a new page. Most simply, you just return false in the onclick event.
<img src="...">
or better yet, you could invoke the dialog from the onclick event
<img src="...">
A better implementation would be to make each seat a "button" (you can change the UI accordingly) and use AJAX to 'submit' a button click.
I am building a page with a button which opens a popup and allows to create a new record in MySQL table. Now I would like to refresh part of the parent page with summary results after the popup window closed. Could you please let me know if there are any examples or sample code? I gooled but couldn't find any example. Thanks for your help.
Are you using any JS lib?
Assuming you are using jQuery + jQuery UI for popup, you can look at jQuery UI modal form example (one note - there is no ajax used, but it's fairly simple to do so).
Idea is simple, bind to onClose popup event, serialize form, submit, and insert recived data into page content.
I guess you will need to call javascript function of parent which will change a particular div based upon your requirement..
I want to open a popup window on client PC where I will show records. The user will click on the selected row, and the popup window will disappear, but the parent Form on my page must get filled with the DB values related to the clicked row on the popup.
This is what I want to do. What is the right approach?
You should be able to send back some response to your parent window from popup window.
There is a specific javascript methods to do this. See this.
You can also use a modal popup type container which will make communication simpler and give you more control of the data. It'll also work flawlessly even if the client has any sort of popup blocker (which most do by default).
It's easy to build from scratch and there are also many jquery plugins that make it even simpler.