Question

I need to create something like this.
when I click on an image, it will fire the script below.

$("#txtHint").html("<form action='inline_spec.php' id = 'upLoadForm' method='post' enctype='multipart/form-data'><center><input type='text' id='file' name = 'file' style='visibility:show' ></center></form>");

the script will open an text file input form. Upon submit the form, I need to display the result in txtHint.
Is it possible?

Answer 1

You wont be able to put the result of the upLoadForm into #textHint unless you submit the form with AJAX. See the jQuery Form Plugin for how to do that. Add the jQuery Form Plugin to the page and then replace your line of JS with this.

var $hint = $("#txtHint");
var $form = $("<form action='inline_spec.php' id = 'upLoadForm' method='post' enctype='multipart/form-data'></form>")
                .appendTo($hint)
                .html("<center><input type='text' id='file' name = 'file' style='visibility:show' ></center>")
                .ajaxForm(function(response)
                {
                    $hint.html('Response from form post:<br/>' + response)
                });