www.webdeveloper.com
Results 1 to 3 of 3

Thread: popup form

Hybrid View

  1. #1
    Join Date
    Feb 2014
    Posts
    16

    popup form

    Hi,

    I am new to javascript and web design. I want to develop a popup form, which can upload file to the server. I need javascript in the html instead of using php only. I tried several methods but no one works. The attempts are below.

    1.Form is:
    <form id="upload" action="upload.php" method="post" enctype="multipart/form-data">
    <input type="text" id="name" value=<?php if (!empty($name)) echo $name;?>" />
    <input type="file" id="fileselect"/>
    <button type="submit">Upload file</button>

    I want another element, when an event is triggered, to display the form.

    <body>
    <div id="table"></div>
    </body>

    If an event happens,
    function eventhandler() {
    var h = document.getElementById("upload");
    table.innerHTML = h;
    }
    When I run the script, the h is "null". This method fails.

    2. I used another php file.
    <?php
    <html>
    <form id="upload" method="post" enctype="multipart/form-data">
    <input type="text" id="name" value=<?php if (!empty($name)) echo $name;?>" />
    <input type="file" id="fileselect"/>
    <button type="submit">Upload file</button>
    </form>
    ...
    </html>
    When I call this php file from javascript, the form can not open. I considered to use window.open() instead. But I assume that window.open() can not get parameters from the calling html. In that case, I can not transfer data to that php file. This method doesn't work either.

    I am thinking use jQuery to handle that. Does form has the attribute like form.open()? Do I need jQueryUI?

    Any suggestion is very welcome!

    Best,
    Jian
    .....

  2. #2
    Join Date
    Oct 2013
    Posts
    610
    To begin with, try this for your form:

    Code:
    <form id="upload" method="post" enctype="multipart/form-data" action="upload.php">
    <input type="text" id="name" value="<?php if (!empty($name)) echo $name;?>" />
    <input type="file" id="fileselect"/>
    <input type="submit" value="Upload file"/>
    </form>
    My changes in red.

    From http://www.w3schools.com/tags/tag_button.asp:
    If you use the <button> element in an HTML form, different browsers may submit different values. Use <input> to create buttons in an HTML form.

  3. #3
    Join Date
    Feb 2014
    Posts
    16
    Hi Kevin2,

    Thank you for your help.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles