dont work correct my javascript code for file size validation?

Question

I've designed a form for uploading member photos with php and javascript.

I have a PHP code for validating the upload form on the server side and also a code for validating the upload form on the client side. The PHP code works fine, but the javascript code displays an alert when it checks the file size and error representation. If the file is bigger than 100 KB, it will alert but will not stop uploading the file.

javascript validation code is:

   <script language="javascript">
       function findSize()
       {
            var fileInput =  document.getElementById("fileup");
            try{
                var fsize=fileInput.files[0].size;
                var fsizekb1=fsize/1024;
                if(fsizekb1>100)
                {
                    //alert(fileInput.files[0].size+"vv"); // Size returned in bytes.
                    alert("your file is bigger than 100 KB and size of your file is "+fsizekb1.toFixed(2)+" KB");
                    return false;
                }
            }catch(e){

                var objFSO = new ActiveXObject("Scripting.FileSystemObject");
                var e = objFSO.getFile( fileInput.value);
                var fileSize = e.size;

                var fsizekb=filesize/1024;
                if(fsizekb>100)
                {
                    //alert(fileSize);
                    alert("your file is bigger than 100 KB and size of your file is "+fsizekb1.toFixed(2)+" KB");
                    return false;
                }
            }
            return true;
        }

    function up_control()
      {

            if(document.forms["frm_up"]["up"].value=='')
            {
            alert ("please select your photo by Browse");
            return false;  
            }
        if(document.forms["frm_up"]["cptch"].value=='')
            {
            alert ("please write the picture code");
            return false;
            }

            findsize();

      return true;
      }
    </script>

and upload form is this:

<form method="post" enctype="multipart/form-data" name="frm_up" onSubmit="return up_control()">
<input id="fileup" style=" margin-right:3%;" type="file" name="up" accept="image/jpeg,image/x-png,.jpg"  ><br> <br>


<!--===========start Area==Captcha====================================================================================
=====================================================================================================================
=====================================================================================================================
-->


    <img style="" HEIGHT="55px" src="cptch.php?cpf=<?php echo rand(1111,999999999); ?>" id='captchaimg' border="2" >&nbsp;&nbsp;&nbsp;&nbsp;<br>
    <label  for="message" style="margin-right:1%">write number in above picture:</label><br>
    <input style="width: 8em" id="cptch" name="cptch" type="text" autocomplete="off" ><br>
    <Label  style="margin-right:1%;" id="captex_chng_lbl">Can't Read the picture?  <br id="br_cap_chng"><a href='javascript: refreshCaptcha();' style="color:#909;" id="rmz2" class="captex_chng">Change</a></label><br><br>
    <script language='JavaScript' type='text/javascript'>
        function refreshCaptcha()
        {
            var img = document.images['captchaimg'];
            img.src = img.src.substring(0,img.src.lastIndexOf("?"))+"?cpf="+Math.random()*1000;
        }

    </script>

<!--===========END Area==Capcha======================================================================================
=====================================================================================================================
=====================================================================================================================
-->
<input type="hidden" name="upl" value="1">

<input style=" margin-right:3% !important;" type="submit" value="  Send to see " >&nbsp;<input type="button" style="background-color:#FF8080; margin-right:5%;"  value="&nbsp;&nbsp;&nbsp;cancel  &nbsp;&nbsp;&nbsp;" onClick="document.location='index.php?c=regm'" ><br><br>
</form>

Why does the javascript code not work properly in validate the size of image function, and does not prevent file uploading after show error(alert)?

From the code you've posted, your function findSize() should never be executed at all since it doesn't seem to be called anywhere. Your function up_control() is also checking chk_fsize==2, but I can't see the variable chk_fsize being defined. Is this really all the code related to the issue, or have you removed parts? — M. Eriksson
– M. Eriksson, Commented Jan 20, 2019 at 14:56
Also, why are you setting the document.location in an onClick on the submit-button? This code is confusing. — M. Eriksson
– M. Eriksson, Commented Jan 20, 2019 at 15:00
Now you've changed the code. The issue is that you're calling the function findSize(); but ignore the response. In your up_control()-funciton, change the last return true; to return findsize();. — M. Eriksson
– M. Eriksson, Commented Jan 20, 2019 at 15:02
@MagnusEriksson this onclick is for return to previous page because of php code and isnt important here — harix
– harix, Commented Jan 20, 2019 at 15:06

harix · Accepted Answer · 2019-01-20 15:15:35Z

1

First of all I thank MagnusEriksson for the good guidance he has. But the last line is for the time when everything is correct and the true value must be returned, but by adding the return before the findsize() function in the up_control() problem is resolved.

answered Jan 20, 2019 at 15:15

harix

2773 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

dont work correct my javascript code for file size validation?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related