停止表單子？

Question

我有一個存儲數據到mysql.It工作正常，沒有錯誤。表單包含名稱，價格，類別和圖像字段，當我點擊提交按鈕數據插入到數據庫完美。但是當我錯過上傳一個圖像它不提交，但頁面刷新時，當我點擊提交按鈕，我失去了其他fileds.Finaly的所有數據提交按鈕，我的疑問是我需要停止刷新時，當我想念上傳圖像。 mycode的是

<form enctype="multipart/form-data" action="#" method="post"> 
<input type="hidden" name="MAX_FILE_SIZE" value="10000000" /> 
<label>Name:</label><input type="text" name="name" id="name" size="25"/><br /> 
<label >Price:</label><input type="text" name="price" id="price" size="25"/><br /> 
<label>category:</label> 
<?php 

     $con=mysql_connect("","",""); 

     if(!$con) 
     { 
      die('couldnot connect to database'.mysql_error()); 
     } 

     mysql_select_db("dbname",$con); 

     $dropdown=0; 
      $result=mysql_query("select DISTINCT(category) from category") or die("No such table"."<br/><br/>".mysql_error()); 
      while($row=mysql_fetch_array($result)) 
       { 
        $dropdown.="\r\n<option value='{$row['category']}'>{$row['category']}  </option>"; 
       } 


     ?> 
      <?php echo "<select name= 'category' id='category' style='width:14em;'>".$dropdown."</select>";?><br /> 

     <label style="color:#FFFFFF;font-weight:bold">Description:</label></td><td> <input type="text" name="description" id="des" 
     size="40"/><br /> 
     <label style="color:#FFFFFF;font-weight:bold">Upload Image:</label></td><td><input name="userfile" type="file" /><br /><br 
     > 

     <input type="submit" value="Submit" id="submit" style="color:#2594BA;font-size:18px;text-decoration:none;background:#FFF; 
     padding:3px;border-radius:5px;padding-left:8px;padding-right:8px;"/><br><div id="errormessage">insert data</div> 
    </form> 
</div> 
<?php 

    if(!isset($_FILES['userfile'])) 
    { 


    } 
    else 
    { 
     try { 
      $msg= upload(); //this will upload your image 
      echo $msg; //Message showing success or failure. 
     } 
     catch(Exception $e) { 
     echo $e->getMessage(); 
     echo 'Sorry, could not upload file'; 

     } 
    } 

    // the upload function 

    function upload() { 
     if(empty($_FILES['userfile'])) 
     { 
      die(); 
     } 

     /*database connection code;*/ 
     $maxsize = 10000000; //set to approx 10 MB 

     //check associated error code 

     if($_FILES['userfile']['error']==UPLOAD_ERR_OK) { 

      if(is_uploaded_file($_FILES['userfile']['tmp_name'])) {  

       if($_FILES['userfile']['size'] < $maxsize) { 

         $imgData =addslashes (file_get_contents($_FILES['userfile']['tmp_name'])); 
         mysql_connect($host, $user, $pass) OR DIE (mysql_error()); 

         mysql_select_db ($db) OR DIE ("Unable to select db".mysql_error()); 

         $sql = "INSERT INTO menu(name,description,price,picture,category) 
         VALUES 
         ('{$_POST['name']}','{$_POST['description']}','{$_POST['price']}','images/{$_FILES['userfile']['name']}','{$_POST['category']}');"; 

         // insert the image 
         mysql_query($sql) or die("Error in Query: " . mysql_error()); 

         $msg='<p>data successfully inserted into database with id ='. mysql_insert_id().' </p>'; 
       } 
       else { 
        $msg='<div>File exceeds the Maximum File limit</div> 
        <div>Maximum File limit is '.$maxsize.' bytes</div> 
        <div>File '.$_FILES['userfile']['name'].' is '.$_FILES['userfile']['size']. 
        ' bytes</div><hr />'; 
        } 
      } 
      else 
       $msg="File not uploaded successfully."; 

     } 
     else 
     { 
      $msg= file_upload_error_message($_FILES['userfile']['error']); 
      echo $msg; 
     } 
    } 

    // Function to return error message based on error code 

    function file_upload_error_message($error_code) { 
     switch ($error_code) { 
      case UPLOAD_ERR_INI_SIZE: 
       return 'The uploaded file exceeds the upload_max_filesize directive in php.ini'; 
      case UPLOAD_ERR_FORM_SIZE: 
       return 'The uploaded file exceeds the MAX_FILE_SIZE directive that was specified in the HTML form'; 
      case UPLOAD_ERR_PARTIAL: 
       return 'The uploaded file was only partially uploaded'; 
      case UPLOAD_ERR_NO_FILE: 
       return 'No file was uploaded'; 
       case UPLOAD_ERR_NO_TMP_DIR: 
       return 'Missing a temporary folder'; 
      case UPLOAD_ERR_CANT_WRITE: 
       return 'Failed to write file to disk'; 
      case UPLOAD_ERR_EXTENSION: 
       return 'File upload stopped by extension'; 
      default: 
       return 'Unknown upload error'; 

     } 

    } 
    ?> 

Answer 1

您可以使用JavaScript來驗證和限制表單提交如下圖所示。如果userfile字段爲空，它將返回false。

function validate_form(thisform) 
{ 
    with (thisform) 
    { 
     if (userfile.value==="") 
     { 
      return false; 
     } 
    } 
    return true; 
} 

在您的標籤

<form onsubmit="return validate_form(this)"> 

Answer 2

停止頁面刷新服務器端是不必要的複雜性。這是因爲，根據請求 - 響應模型，用戶已經提出了他們的請求。頁面刷新幾乎都發生了。但是你可以做的是使用一些客戶端腳本來防止請求發生。最常見的是，JavaScript是爲這個完美的：

function validate() 
{ 
    if($('nameTxt').text() != "" && $('otherTxt').text() != "" ...) 
    { 
     this.submit(); 
    } 
} 

注意：我認爲在我的例子使用jQuery。人們經常使用JavaScript的框架，但這不是必需的。請參閱JJPA針對免費框架選項的答案。

Answer 3

1. 您可以在客戶端添加html5 "required"屬性。
2. 您也可以通過檢查JS的值是否爲空來驗證。爲此，您可以使用javascript的document.getElementsByName方法，也可以使用Jquery的$('#id').val()方法。

PS：我會建議你驗證它的服務器端以及。

Answer 4

我已經解決了我的問題。我剛剛添加驗證文件類型。就是這樣。 並感謝您的寶貴意見。