照片上传无法通过Ajax调用

时间:2015-03-31 16:38:17

标签: javascript php ajax

我正在尝试使用Ajax上传照片,以便在点击提交按钮后发布照片。

流速: 用户上传图片 - > Ajax调用上传照片, 用户点击提交 - >帖子与照片一起显示给用户

这是我上传图片的php文件:

            <div class="box-footer">
                <div id='preview' style="max-width:50px;max-height:60px;padding:5px;></div>
                <div id="button_bar">
                    <!-- <div id="icons">
                    <div class="filebutton" title="Image Upload"> -->
                    <form id="imageform" method="post" enctype="multipart/form-data" action='WallPost1/ajax_image.php'>
                        <span><input type="file" name="photoimg" id="photoimg" onchange= PhotoUpload()></span>
                    </form>
                </div>
                <button type="submit" class="btn btn-primary"  id="tweet_submit" onclick=TweetSubmit()>Submit</button>
                </div>
            </div>

这是我的JS代码:

            function PhotoUpload(){
                    alert ('got photo');         
                    $("#preview").html('');
                    $("#preview").html('<small>Loading...</small>');
                    $("#imageform").ajaxForm({
                        target: '#preview'
                    }).submit();
            }

这是我的ajax_image.php代码

            <?php
            include('includes/dbconnection.php');
            include("session.php");
            $path = "uploads/";
            $valid_formats = array("jpg", "png", "gif","JPG","JPEG","jpeg","PNG");
            if(isset($_POST) and $_SERVER['REQUEST_METHOD'] == "POST")
            {
                $name = $_FILES['photoimg']['name'];
                $size = $_FILES['photoimg']['size'];
                if(strlen($name))
                {
                    list($txt, $ext) = explode(".", $name);
                    if(in_array($ext,$valid_formats))
                    {
                        if($size<(1024*1024))
                        {
                            $actual_image_name = time().substr(str_replace(" ", "_", $txt), 5).".".$ext;

                            $tmp = $_FILES['photoimg']['tmp_name'];
                            if(move_uploaded_file($tmp, $path.$actual_image_name))
                            {
                                $command="Insert into uploads(image_name) values('$actual_image_name')";
                                if (!mysqli_query($con,$command))
                                {
                                    die('Error: ' . mysqli_error($con));
                                }
                                else
                                {
                                    $msg ="<br> 1 record added";
                                }
                                //echo "-----Images here----".$msg;
                                $query=mysqli_query($con,"Select upload_id,image_name from uploads where image_name='$actual_image_name'"); 
                                $result=mysqli_fetch_array($query);
                                $id=$result['upload_id'];

                                echo "<img src='BootStrapProject/WallPost1/uploads/".$actual_image_name."' class='preview' id='$id'>";          
                            }
                            else
                            echo "failed";
                        }
                        else
                            echo "Image file size max 250k";                    
                    }
                    else
                        echo "Invalid file format..";    
                }

                else
                    echo "Please select image..!";
                exit;
            }
            ?>

每当我使用输入表格选择一个文件时,就会调用JS,我在UI上看到“loading ...”消息,但之后没有任何反应。

有人可以帮我理解为什么我的ajax_image.php文件没有被调用。

提前致谢!

1 个答案:

答案 0 :(得分:0)

我很乐意解决这个问题,我相信问题是JQuery库在某种程度上被旧版本覆盖了,它不支持ajaxForm。

感谢您提供的所有宝贵意见。