How to hide users files and folders on your website?

Sometimes you want to hide some files or folders on your website, so that no one can access them directly.

If you have an upload feature in your website, and your website users upload their files or images to your website, It will not be nice to let other users see others files by guessing the URL.

For example: Your website uploaded files directory is “UsersUploads” and you put there all the users files, so one file url will be, another will be .

Now a user can guess the URL and access others files specially if your files names are easy to guess.

There are two solutions for doing that:

1- You can put your “UsersUploads” folder outside the website directory, so if your website exist on “c:\website\” you can put the “UsersUploads” there “c:\UsersUploads”, Like that IIS has no control over this folder and its files, And your website code will still have access to this directory as a normal physical path.

2- Stop IIS from serving this folder:

IIS by default doesn’t server some website folders and files such App_Data, App_Code, bin, App_GlobalResourses, App_LocalResources, Web.config,….

You can configure IIS to stop serving some more files or folder inside your website folders by Adding a new Hidden Segment.

– Select your website in IIS, and open Request Filtering.

– Go to Hidden Segments tab.

– In the right Actions panel click on “Add Hidden Segment…”.

– Write there the file or folder name you want to hide.

– This will edit your website web.config file and add the following:


Now users can’t access this folder directly by guessing the URL.

Note that you can do this manually without the IIS by editing your website web.config file and put there the same values.


I believe that there are more ways to accomplish the same thing, but these are 2 easy ways.

Submit form using javascript

Simply to submit a form using javascript you can write:

In the following code you will see a special case where the form is not appearing directly on the page but through an iFrame element.


This code tested on Chrome, FF, IE and Safari Windows.


Source Code

Call container page function from child iframe

The simplest way i got to call a function that exists in the iframe container page is using:


<html xmlns="">
<head runat="server">
    <form id="form1" runat="server">
        <script language="javascript" type="text/javascript">
            function AlertFromParent() {
                alert('I am parent');
        <iframe src="IFramePage.aspx" id="myIframe">





– This function is working just if the 2 pages ‘the parent and the child’ are in the same domain name, and if they are in 2 different domains you will get permission denied error.

– If you will run the javascript code inside the iframe on load ‘as in the previous example’, make sure that the parent script function exists before the iframe tag, because the iframe will break loading the page till it finish loading and everything after it will wait till it completely loads.

Flash Javascript communication first look


I did a fast research about how to make flash interact with the container website, and i collected some good information.


There are 2 main techniques to implement communications between flash and the container website:


1- Client API technique:


Using this technique, the flash will communicate with the website through JavaScript.

So in brief, the flash can send and receive variable from the website using Javascript, and for this first research I got 2 main ways to make flash interact with Javascript:

a- Using the ExternalInterface which exist in the action script classes,,,


b- Using normal Javascript calls as in this example: which describes the main functions to interact with the flash using Javascript.

2- Server API technique:


Using this technique, flash will call the server side APIs directly, and will post variables to the API URL, also there is another way is to send these variables using Querystrings, which will not be the right way all the time and may be not possible in some cases ‘put in mind for example the max number of query string characters’.


Most of game websites use the server side APIs, but big famous website give both options, server or client side APIs.

Server Side advantages from my point of view:

– More secure calls.

– Works whatever the user enabled javascript in the browser or not.

– No problems with different browsers compatibilities.

Client Side advantages:

– Middle layer, between the server side code and the flash, which encapsulates the server side methods and don’t let the flash call the server APIs directly but will be through this JS layer.

– Gives the ability to submit values to the server using Ajax style ‘without refreshing the whole page’.

– The flash will need less information from the website, as the Javascript code will handle most of the common variables ‘such as the current user, the current page URL, …’.

By the way in both cases we will need to implement the server side API first and then will let the Javascript and flash code interact with this APIs.



Its a common requirement in some websites specially which are dealing with many images and JavaScript, such as image galleries websites or websites that has images slide shows made using JavaScript.

In a project i just finished, i was making a slide show animation which start automatically when the page load and animate to a certain image based on a query string.

I was using JQuery to implement this simple slide show.

The Problem i faced is that the JQuery animation start to run before the images inside the slide show are loaded, and them make the animation seams as its animate on white screens not images, and will look worse on IE browsers which may give the ‘x’ sign on images which didn’t load yet.

So my mission was to find a way to don’t start the automatic animation until all images have loaded.

At first i just wrote my code in the document.ready JQuery function, but this made my code to run just after JUST the document html have loaded and will not wait till images load.

I found a good solution:

See $(document).ready vs. $(window).load


Also found a solution which will work with just an image, incase you want to wait just for an image to load:

Different ways to watermark html input text



There are many ways to add a watermark text to an input text, which will go when you focus the control or start writing inside.

I will list here some good ways to this behavior:

This is an easy and short way to it just using the onfocus and onblur events of the textbox or input field.

But lets make the code cleaner by geting this text from the server side, which will give us many options such as supporting localization.

 Also you can find online a lot of other ways which will fit in some cases such as the following:

jQuery Watermark

Watermark Input Plugin

TextBoxWatermark (AjaxToolKit)

In-Field Labels jQuery Plugin