how to pop a dialog box on button click

Hello Friends I want to upload a image but according to requirement when click on button a pop window display and inner part of pop window display browse field using code something like

<form action="index.php" method="post" onsubmit="">
    <div><label>Name:</label> <input type="text" name="form[name]" /></div>
    <div><label>File:</label> <input type="file" name="form[file]" /></div>
    <开发者_运维知识库div><input type="submit" value="SUBMIT" /></div>
</form>

actually i want to show this browse field in pop-up window. Please reply me regard this Thanks

Just give a myform ID to your form hide it, using display:none; and try this code

<a href="#" onClick="document.getElementById('myform').style.display='';">Show Browse</a>

UPDATE

I have created a demo of what you wanted. Check it here http://jsfiddle.net/Starx/rVw9M/

Since you are unfamilier with jquery, you need jquery library for this to run put this in your head (HTML Pages' Head :D)

<script type='text/javascript' src='http://code.jquery.com/jquery-1.4.4.min.js'></script>

Basically, here is how you could achieve that (just off the top of my head):

a) Create a new separate page and move your code into this page

b) On the existing page create a DIV and add IFRAME into it which would be pointed to that new page, e.g.

<div class="uploader" style="display: none;">
  <iframe scrolling="no" style="width: 100%; height: 100%;" src="url"></iframe>
</div>

c) Download and add some modal popup plugin - personally, I prefer SimpleModal

d) Now you can show your popup by calling modal() method on the .uploader class, something like this..

<a href="#" onclick="$('.uploader').modal();">Show Uploader</a>