Different ways to opening new windows using JavaScript
If you notice on most of the websites on the internet and inside most of web applications, you will find that opening a new window is a popular way of letting users/readers see additional information without navigating away from the current page. With JavaScript you can specify the dimensions, position and visible toolbars of this newly created window, as well as writing code directly into it and having the two windows operating together. To this aspect of modern web engineering, I will show you multiple ways to open a new window without interfering the current page.
Using <a href link tag
This tag will let user open a page without closing the current page:
<a href=”popup.html” target=”_blank”>Click here</a> to open new page
Using JavaScript OnClick() function
This function will let users open a brand new window with a defined size, then users can re-size the window when needed.
<a href=”javascript:void(0)” OnClick=”window.open(‘popup.html’, ‘pagename’, ‘height=400, width=400, location=no, resizable=yes, scrollbars=yes’);”>Click here</a> to open new page.
This method has some parameters below when you call the window.open function:
| height | Defines the height of the window in pixels. Percentage values don’t work. |
| width | Defines the width. Again, you’ll have no joy with percentages. |
| left | Supported by version 4 browsers and above, this sets how far removed the window appears from the left of the screen. In pixels. |
| top | Partner to left, this pushes the window off the top of the screen. |
| resizable | Set to true or false, this may allow the user to resize the window. |
| scrollbars | Another Boolean value, this adds scrollbars to the new window. If your content may be longer then the dimensions you’ve specified, make sure this is set to yes. |
| toolbar | Specifies whether the basic back/forward toolbar should be visible. If there are links to follow in your new page, set this to yes. |
| menubar | Specifies whether the main toolbar (File, Edit, …) is shown. |
| location | Specifies whether the location toolbar (address bar) is shown. |
| status | Specifies whether the new window can have a status bar. Best set to yes. For security reasons, Mozilla-based browsers always show the status bar. |
| directories | Specifies whether the directories toolbar is shown (Links toolbar in IE). |
| fullscreen | This parameter is optional. Works only in Internet Explorer-only Boolean attribute which may open the window in fullscreen. It’s not a good idea to use it. |
Using <div> tag for a popup window
This method you will have to download jquery.min.js and fancyzoom.js files from jquery. Then you can add a <div> tag on the same page that includes these 2 JavaScript files. You will have to remember to download all images that are decorating the jQuery box, so it looks more professional. This method won’t be described here since you can get more details on jQuery website.
Get the last id from a table
If you need an ID before you can get the data from user’s inputs, you can use the query below to get the last id from a table in your database, and then you can increment 1 to that id. For example, a brand new ID can be assigned to an online order using the last id from the table and add 1 to it. Here’s what you can do:
Send a query that return the last id of a table using either query below:
select max(id) from software_order.user limit 1;
select max(id) from software_order.user;The result is:
3355
Then add 1 to this id, now you’ve got 3356 which will be assign to the new order. This way will ensure that you always have the ID in hand before user enters data into an order form.
If your application just completed an insert statement into software_order.user table, you can use a function called mysql_insert_id() to get the ID generated in the last query. It’s simple to use.
Here’s the example:
$last_id = mysql_insert_id();
Project 1 with AW
Integration of Credit Card Payment Gateway by Authorize.Net with AppraisalWorld System.
- Develop CIM and SIM interface for Sales department, using Authorize.Net API
Purpose of this integration:
- Sales team can charge software customers through an internal Admin interface and storing customers’ credit card information securely on Authorize.Net CIM server
Method:
- SOAP call or REST to get a return of XML string
Target date:
- April 5th, 2010
Detect user’s browser type
Some of you may wonder how a website can be able to detect my browser type. Today I will show you a way to detect what type of browser a user is using, so you can collect this data for your statistic purposes.
The codes below is only applied for php on *nux server
Then you can use this variable $browser_type to store in your database or use it to count how many browser type has been used to read your website.
Display Source Code of a page
Sometimes, you may want to show just the source code of a file rather than having it translated in a web browser. For example, if you want to show your visitors how to write a certain php/asp or even an html source codes as tutorial scripts, you can instruct your server to display just the contents of the file rather than executing them by using your htaccess file to block the execution. This method will ensure the security of your blog website.
In order to do this, you must create a folder for your website to place these files, and create an .htaccess file within the folder with the following code:
RemoveHandler cgi-script .pl .py .cgi .php .html .shtml