上传特定图片而不是提交完整表格

问题描述 投票:-1回答:1

我有一个表单名称editdata.php。大约10个html控件(文本框,文件,选择)使用。我有一个文件控制他们的用户图片正在显示和下面这个文件控件附加到更改图片。我希望当用户浏览然后更改图片图片时会自动更改,但表单不会提交。这样就可以在不提交完整表格的情况下上传图片。

 <html>
 <head>
    <meta charset="UTF-8">
    <html lang="en">
     <meta name="viewport" content="width=device-width, initial-scale=1">           <!--requuired for bootstrap -->
      <link rel="stylesheet" href="Bootstrap/bootstrap.min.css" />               <!--bootstrap files -->
     <script src="Bootstrap/jquery.min.js"></script>
     <script src="Bootstrap/bootstrap.min.js"></script>
     <style>
         .error
         {
             color: red;

         }
     </style>
    <title></title>
</head>
<body>

    <div class="container">
        <h1>Login Form</h1> 
        <h2><?php if(isset($_REQUEST['msg'])) echo $_REQUEST['msg'] ?></h2>            <!--  Successful messgaeg if chnaged password -->
    <form action="index.php" method="post" onsubmit="return checkData()"  role="">

         <div class="form-group">
                <label>Username*</label>
                <div><input type="text" class="form-control" id="uname" value="<?php if(isset($un)) echo $un;  ?>" name="uname" onblur="setTimeout(function abc(){check_login_data('uname erruname blur', 'Username Must Be Entered')},130)" onfocus="check_login_data('uname erruname focus')" placeholder="Enter Username" />     <!-- textbox for username and checking value for cookie  -->   
                </div>
        </div>
         <span class="error" id="erruname"> <?php if (isset($errorforusrnam)) echo $errorforusrnam; ?> </span>         <!-- set a span for displaying error on emplty textbox -->

        <div class="form-group">
                <label>Password*</label>
                <div><input type="password" class="form-control" id="password_id" name="upass" value="<?php if(isset($up)) echo ($up);  ?>" placeholder="Enter Password" onblur="setTimeout(function abc(){check_login_data('password_id errpassword blur','Password Should Entered')},130)" onfocus="check_login_data('password_id errpassword focus')" />            <!-- textbox for Password and checking value for cookie  -->
                </div>
        </div>
        <span class="error" id="errpassword"> <?php if(isset($errorforpwd)) echo $errorforpwd ?> </span>         <!-- set a span for displaying error on emplty textbox -->

        <?php
        if(isset($_SESSION['counter']) && $_SESSION['counter']>3)           //captcha will show if user attempts more then 3
        {
        echo "<div class=form-group >";                 //div for captcha
        echo "<label for=captcha >Captcha*</label>";
                  echo "<div id=captcha_id>";
                      echo "<img id=imgCaptcha class=img-responsive src=captcha/create_image.php >";
                      echo '</div>';
                      echo '<div>';
                         echo "<div>";
                              echo "<input id=txtCaptcha class=form-control type=text name=txtCaptcha value='' placeholder='Enter Verification Code' />";
                                   echo "<div><input class=btn btn-default type=button onclick=change_captcha() value=Reload /></div>";
                         echo "</div>";
                  echo "</div>";
        echo "</div>";          //end of div
        echo "<span class =error id=errco>";        //this will show error of div
        if(isset($error))
        {
            echo $error;
        }
        echo '</span>';
        }
    ?>
    <div class="checkbox">
    <label><input type="checkbox" name="chq" value="">Remember Me</label>
 </div>

<div> 
    <input type="submit" name="sub" value="Login"class="btn btn-default" />
      <a href="signup.php" />Signup</a> &nbsp;&nbsp;&nbsp;
   <a href="forget_password.php" >Forgot Password</a>
  </div>

  <!--            <span id="span" ></span>                   span for showing output -->

              </form>
     </div>
 </body>
</html>

是的,所有的工作都必须以单一的形式存在......不是两种形式。在这里我使用了两种形式,但我希望有一种形式

javascript php html
1个回答
0
投票

通过这个li,这可能会帮助你,Ajax upload image on form showing thumbnail

© www.soinside.com 2019 - 2024. All rights reserved.