Ganesh N
Tuesday, 17 September 2013
Single Image upload and fetching in form load
<div id="gridPlacementPhotos"></div>
$.ajax({//1
url: '@Url.Action("GetAccountInformation", "College")',
data: { "code": logincode },
type: 'POST',
dataType: 'json',
cache: false,
success: function (response) {//2
if (response.Placement != null) {//p1
var td=1;
placement=response.Placement;
$('#gridPlacementPhotos').find("table").remove();
var t2 = "<table id='datatable' class='t1'><thead>";
t2=t2+" <tr>";
$.each(placement,function(){//p2
if(td>4)
{//p3
t2=t2+"</tr><tr>"
td=1;
}//p3
if(this.photo!="photo")
{//p4
t2=t2+"<td style='width:210px; text-align: center;'><a class='PlacemenEdit' id="+this.id+">Add/Edit"+td+"</a> <br /><img alt='' src=../../Placement/"+this.photo+" style='width:200px;height:200px'/></td>";
}//p4
else{//p5
t2=t2+"<td style='width:210px; text-align: center;'><a class='PlacemenEdit' id="+this.id+">Add/Edit"+td+"</a> <br /> <img alt='' src='' style='width:200px;height:200px'/></td>";
}//p5
td=td+1;
});//p2
t2 = t2 + "</table>";
$('#gridPlacementPhotos').append(t2);
}//p1
} //2
}); //1
$('.PlacemenEdit').live("click",function(){
// alert("Pedit");
var photoId = $(this).attr("id");
$(".QTPopup").animate({ width: 'show' }, 'slow');
$('#hiddenPhotoId').val(photoId);
});
Displaying popup
<div class="QTPopup">
<div class="popupGrayBg"></div>
<div class="QTPopupCntnr">
<div class="gpBdrLeftTop"></div>
<div class="gpBdrRightTop"></div>
<div class="gpBdrTop"></div>
<div class="gpBdrLeft">
<div class="gpBdrRight">
<div class="caption">
Upload Photo
</div>
<a href="#" class="closeBtn" title="Close"></a>
<div class="content">
@using (Html.BeginForm("PlacementPhoto", "College", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<table style="width: 100%; font-family: Verdana; font-size: small; color: #000080; height: 70px;">
<tr>
<td class="style2" >
Select Photo</td>
<td style="height: 32px" >
<input id="placementPhoto" type="file" name="PlacementPhoto"/> <input type="text" id="hiddenPhotoId" name="hiddenPhotoId" /></td>
</tr>
<tr>
<td class="style2">
</td>
<td style="height: 32px">
<input type="submit" id="btnPlacementPhoto" value="Upload" style="width:88px;" />
</td>
</tr>
</table>
}
</div>
</div>
</div>
<div class="gpBdrLeftBottom"></div>
<div class="gpBdrRightBottom"></div>
<div class="gpBdrBottom"></div>
</div>
</div>
Controller
[HttpPost]
public ActionResult PlacementPhoto(HttpPostedFileBase PlacementPhoto)
{
string id= Request["hiddenPhotoId"];
string collegecode = Session["LoginCode"].ToString();
return RedirectToAction("AccountSettings", new { message = obj.placementPhoto(PlacementPhoto, id, collegecode) });
}
Model
public string placementPhoto(HttpPostedFileBase PlacementPhoto,string id,string collegecode)
{
List<MessageBox> messagebox = new List<MessageBox>();
string message = "";
try
{
string extn = Path.GetExtension(PlacementPhoto.FileName);
string photoName = Path.GetFileName(PlacementPhoto.FileName);
if (extn == ".JPEG" || extn == ".jpg" || extn == ".pdf" || extn == ".GIF" || extn == ".BMP" || extn == ".PNG")
{
//-----------------------------------------------Update into sql
conCheck();
SqlCommand cmd = new SqlCommand();
cmd.Connection = sqlcon;
cmd.CommandType = CommandType.StoredProcedure;
cmd.CommandText = "PlacementPhoto";
cmd.Parameters.AddWithValue("@id", id);
cmd.Parameters.AddWithValue("@photo", id+extn);
int n = cmd.ExecuteNonQuery();
sqlcon.Close();
//--------------------------------------------------------------
string XMLPlacement = HttpContext.Current.Server.MapPath("~/XMLFiles/PlacementPhoto.xml");
////------------------------------------------------------Add xml collegeDepartment
XDocument doc = XDocument.Load(XMLPlacement);
IEnumerable<XElement> rech =
from el in doc.Root.Elements("Table")
where (string)el.Element("id") == id
select el;
if (rech.Count() != 0)
{
foreach (XElement el in rech)
{
el.Element("photo").SetValue(id + extn);
}
}
doc.Save(XMLPlacement);
//--------------------------------------------------------------
//renaming the photo with the photo id from view
var path = Path.Combine(System.Web.HttpContext.Current.Server.MapPath("~/Placement/"), id + extn);
if (System.IO.File.Exists(path))
{
//---------------------
var fileName = Path.GetFileName(PlacementPhoto.FileName);
var fullpath = System.Web.HttpContext.Current.Server.MapPath("~/Placement/");
//deleting code starts here
string[] files = System.IO.Directory.GetFiles(fullpath, id + ".*");
foreach (string f in files)
{
System.IO.File.Delete(f);
}
//--------------------
}
// this is the string you have to save in your DB
string filepathToSave = "Placement/" + id;
PlacementPhoto.SaveAs(path);
// messagebox.Add(new MessageBox { Popup = "Imge Uploaded" });
message = "Image Uploaded";
//-------------------------getting max id
//--------------------------------------
}
else
{
messagebox.Add(new MessageBox { Popup="Incorrect file format"});
message = "Incorrect file format";
}
}
catch (Exception ex)
{
//Response.Write("Error: " + ex.Message);
//messagebox.Add(new MessageBox { Popup = "Incorrect file format" });
message = "Incorrect file format";
}
return message;
}
Multiple Image upload Dynamically(unchecked)
$('button.addPlacement').live('click',
function () {//1
$(this)
.closest('tr')
.clone()
.appendTo('#TblPlacement');
$(this)
.text('Remove')
.removeClass('addPlacement')
.addClass('removePlacement');
});//1
$('button.removePlacement').live('click',
function () {//1
$(this)
.closest('tr')
.remove();
});//1
@using (Html.BeginForm("PlacementPhoto", "College", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<table id="TblPlacement">
<tr>
<td><input name=" PlacementPhoto" id="placement" type="file" /></td>
<td><button class="addPlacement">Add</button></td>
</tr>
</table>
<input type="button" value="AddPlacementPhoto" id="AddPlacementPhoto"/>
</div>
}
In controller
[HttpPost]
public ActionResult PlacementPhoto(HttpPostedFileBase PlacementPhoto)
{
string id= Request["hiddenPhotoId"];
string collegecode = Session["LoginCode"].ToString();
return RedirectToAction("AccountSettings", new { message = obj.placementPhoto(PlacementPhoto, id, collegecode) });
}
In model you have to put foreach to upload multiple photo
Subscribe to:
Posts (Atom)
