使用ajax上传图像

我有以下html表单。这里的图片上传工作正常。但是我想在ajax中上传图片，以便在提交其他细节的表单之前。图像的预览可以显示在旁边。使用ajax上传图像

<form action="<?=base_url();?>index.php/insert/insertdata" method="post" enctype="multipart/form-data"> 

     <tr><td><b>Title: </b></td><td><input type="text" name="title"/></td></tr> 
     <tr><td><b>Url: </b></td><td><input type="text" name="url"/></td></tr> 

     <tr><td><b>Image: </b></td><td><input type="file" name="image"></td></tr> 

     <tr><td><b>Status: </b></td><td><select name="status"><option value="visible">Visible</option><option value="invisible">Invisible</option></select></td></tr> 

     <tr><td><input type="submit" value="submit"/></td><td><input type="reset" value="reset"/></td></tr> 
    </form>

jQuery是也欢迎。但我想避免再次使用表单标签。

来源

2012-10-23 Sahil Jariwala

一旦你上传一个图像，然后使用URL抓取图像的名称，并添加到

$.ajax(url,{data},function(res){ 

     //check status if it is 200 then assign the res to the img 
     $('#img').attr('src',res); 

})

// HTML，如果jQuery是欢迎的图像文件

<img src="" id="img">

来源

2012-10-23 05:12:21 naveen

当我上传图像我的网页正在刷新...我想上传没有页面刷新。 –

你能展示图片上传代码吗？ – naveen

'$ target_path =“uploads /”; $ target_path = $ target_path。 basename（$ _FILES ['image'] ['name']）; if（move_uploaded_file（$ _ FILES ['image'] ['tmp_name']，$ target_path）） { echo“The file”。 basename（$ _FILES ['image'] ['name']）。“已上传”; } else echo“上传文件时出现错误，请重试！”; }' –

后写这则存在没有比uploadify更好的解决方案。使用它，你会爱上它。请检查demo。

来源

2012-10-23 06:47:18

uplodify使用表单标签，正如我在我的问题中所描述的“但我想避免再次使用表单标签。”我的表单中有图像输入标签。所以我不能在表单标签中使用另一个表单标签。 –

谁说你需要使用另一种形式？你可以使用相同的表单，即所有:-) –

uploadify不起作用。我不想使用Flash或HTML5。进一步上传不会显示预览。这不仅仅是上传文件。我希望文件的名称也存储在数据库中。 –

使用ajax上传图像

回答

相关问题