Showing a hidden form, or Opening a modal dialog

Question

What is the best method to show a simple form in a HTML page, which includes a save button that calls a web method? I'm considering one of these options:

1. Toggle a hidden <div> which includes a form with the same behaviour of the shown .aspx
2. Display a modal dialog using JavaScript that loads a separate .aspx to show the form.

Which is better, and under which circumstances?

Answer 1

If the popup content is relatively small, then it will be best to just include it right in your main page in a hidden div. This will give you instant performance when you want to display it. The reasons not to do it this way are:

1. The popup content is large and thus would slow down the loading of the main page measurably.
2. There are lots of different popups that you may use so preloading them all with the main page would slow down the loading of the main page measurably.
3. You use the same popup in lots of different pages and it's not actually popped up very often so it's easier to share common code and reduce overall bandwidth consumption by loading it only upon demand.