LinuxQuestions.org - HTML, form input onclick does not work

- Programming (https://www.linuxquestions.org/questions/programming-9/)

- - HTML, form input onclick does not work (https://www.linuxquestions.org/questions/programming-9/html-form-input-onclick-does-not-work-4175537174/)

HTML, form input onclick does not work

I've been googling for the last 4 days to figure this problem out. It seems so simple yet nothing I've tried has worked. Let me explain:

I started running apache so that my friend from across the water can upload his projects to me for evaluation. Occasionally these uploads are quite large (200-700MB). My upload page works, everything is good.

Not quite... When the submit button is pressed, nothing seems to happen. The page just sits there while browser chews on the 200MB file for some time, then the upload begins. After the file is fully sent, finally the cgi script that handles it is called, and everything is done. Fine.

The problem is twofold:

1. Not only would I like to time the upload so I know what kind of throughput I'm getting, but I would also like the user to get some immediate feedback when pressing the submit button. The original idea was just to put a timestamp in the apache access_log and blank the page the instant the user clicks the submit button.

2. The onclick cgi script never gets executed. As a matter of fact, I cannot get <INPUT onclick= ... > to work at all.

Here's the upload page:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">



<HTML>

<HEAD>

  <TITLE>UPLOAD</TITLE>

</HEAD>



<BODY>

  <FORM action="/cgi-bin/upload.pl" method="post" enctype=

  "multipart/form-data" name="productForm" id="productForm"

  onsubmit="/cgi-bin/test.sh">

  <SCRIPT language="javascript" type="text/javascript">

      function test_script () {

          var img=new Image();

          img.src="/cgi-bin/test.sh";

      }

      </SCRIPT>



    <TABLE width="400px" align="center" border="0" style=

    "background-color:40ff40;">



      <TR>

        <TD>&nbsp;File:</TD>

        <TD><INPUT style="width:400px" type="file" name="File"></TD>

        <TD>&nbsp;</TD>

      </TR>



      <TR>

        <TD></TD>

        <TD>

          <INPUT 

          onclick="test_script();" 

          type="submit" name="Submit" value="Press here">

          &nbsp;to upload your file.

        </TD>

      </TR>



      <TR>

        <TD colspan="2" align="right" style="font-size:8pt"><A href=

        "/cgi-bin/test.sh">Test</A></TD>

      </TR>



    </TABLE>

  </FORM>

</BODY>

</HTML>

As you see there is remnants of some different approaches: INPUT onclick as well as FORM onsubmit. I've tried the javascript and calling it straight in the onsubmit. BTW that img.src="/cgi-bin/test.sh" in the script was something I found when googling to dupe js into calling a cgi script. Someone said it worked for them. Not for me.

and here's the test.sh:

Code:

#!/bin/bash



echo "Content-type: text/html"

echo ''



ofile="/tmp/count"

date=$(date +%Y%m%d%H%M%S)

declare -i count

count=$(cat $ofile)

let count+=1

echo -n $count > $ofile



echo "$(basename $0) $date : $count"

This is just for testing. It just increments a counter now.

One of the issues, if you load the html page, is that even if you click the test link that calls this script straight up, it just loads from cache, and the script doesn't actually execute unless you hit refresh.

The idea is that it gets called when the user presses the submit button, not 10 minutes later after the upload is done.

It does work if I put the script in the action field, but then not until upload is finished, which is exactly what I'm trying to get around.

Any ideas?

It doesn't work like that.

I have not fully digested your code, but first...

Code:

  <FORM action="/cgi-bin/upload.pl" method="post" enctype=

  "multipart/form-data" name="productForm" id="productForm"

  onsubmit="/cgi-bin/test.sh">

... will only ever produce a javascript error. You cannot call a server side target from the onsubmit handler, and javascript will not know what to do with "/cgi-bin/test.sh" so it will produce an error.

Next, when you submit to the upload target, it can do nothing until it receives your full request, which includes the uploaded data... hence it cannot respond until AFTER the file is fully uploaded.

What you can do is alert the user that the upload is going to take a few minutes, maybe something like this (untested)...

Code:

  <FORM action="/cgi-bin/upload.pl" method="post" enctype=

  "multipart/form-data" name="productForm" id="productForm"

  onsubmit="alert('The upload may take a few minutes for a large file.

 The page will update when the upload is complete. 

 Close this message to continue...');">

Otherwise, you might look for a javascript ajax uploader (and target) with progress indicator, but those will not work on older browsers.

There is a separated protocol for this purpose: FTP. Use 'hash' command to get visual feedback.

Thanks for the replies, and thank you very much for clarifying those issues, astrogeek. That is basically what I was beginning to suspect. I like your idea about the alert box, I'll try that.

As for FTP, I agree. That's where I started, and that's what I prefer: simple, elegant, and it works. Everything in 1 logfile, easy to configure. But, unfortunately, my friend is not very well versed in the ancient arts. FTP seems to scare him or something, I have no idea why. He's one of those artsy-fartsy types :) So I fired up Apache to be more user-friendly. *shrug*