The JSP Include directive explained

The include directive is used to include the content of other resource into the current JSP page.

The syntax of include directive is:

Include directive has only one attribute named file, that specifies the name of the file to include. The file attribute is interpreted as relative URL. If it starts with the forward slash, it is interpreted as relative to the context of the application [context specific path], otherwise it is interpreted as relative to the current JSP file. Include directive has access to all files within the application, even those file which are under WEB-INF folder and publically unavailable, so you can use include directive to include those files also which are under WEB-INF.

Suppose you have following directory structure in your web application.

The following include directives in main.jsp uses context specific path to include the header.jsp, content.jsp and footer.jsp into main.jsp.

The following include directives in main.jsp uses file specific path to include the header.jsp, content.jsp and footer.jsp into main.jsp.

You can see that files under WEB-INF folder can also be included using include directive, which are not directly available to user. (Remember web container doesn’t serve any files under WEB-INF folder to user !!)

Include directive can be used to include content of other JSP file, HTML, XML or any other text file. Yes included file need not to be JSP only, it can be any other text resource also.

Remember, whenever you include a file using include directive, the content of the included file is parsed by the JSP engine only at translation time, that is, when the main JSP page is compiled into the implementation servlet, and the generated servlet will have the content from original JSP file and all of its included files. Since the original JSP file and all of its included resources are compiled into one servlet, original JSP file will share its variables and declarations with the included files. Included file can rely and use scripting variables, methods and class imports of original JSP file. Therefore any duplication of variable name or method name in original JSP file and included JSP file will result in translation error. In other words you cannot declare variables or methods with the same name in both original JSP and included JSP.

Include directive is very useful for creating templates. Most of the web applications have consistent looking interface, main page is divided into different regions like header, footer, sidebars, navigation panel, and main content panel. Most of the time content of the header, footer and navigation panel remains same in all the pages throughout the application, if the code of these regions is duplicated in all the pages, the application becomes very hard to update and maintain since any change in one of the regions will require updating all the pages which use it.

For example, you have created an application which has the consistent interface, all the pages have same header and footer, the code for header and footer is duplicated in all the pages, now suppose you want to change the header slightly or you need to add a copyright notice in the footer. You will end up updating each of the pages in your application, you will need to open each of the pages, make the required changes, save and compile. The solution is to separate the commonly used parts such as header and footer and put them in individual files, and include them using include directive whenever required. So whenever you need to update those parts throughout the application, you can easily do it by updating them at one place (header.jsp and footer.jsp)

Now let’s consider a real-world example of the include directive, in this tutorial we will create a template using include directive which includes the header.jsp and footer.jsp to provide the consistent page layout throughout the application.

First look at the main.jsp file which includes header.jsp and footer.jsp.

Main.jsp defines a template, which is divided into three regions, header, content and footer. header.jsp is included at the top which displays the header of the page. Footer.jsp is included at the bottom which displays the footer of the page, the div in between displays the content of the page. Now look at the header.jsp and footer.jsp
header.jsp

 These files contain HTML div elements which displays the header and footer portion of the page.