CODEWITHSUNDEEP
jqueryhtmlajaxasp.net-mvc
Imran Noor
Imran Noor

Reputation: 531

Asp.net - WHY Page is reloading after Ajax call?

I am picking the image from canvas which is in Form. But Button is outside the form. My Images saves exactly as expected but remaining problem is PAGE RELOAD.

Ajax call upon clicking BUTTON to save the image from canvas:

$("#upload").click(function () {
    var image = document.getElementById("ModelStudedntImageDP").toDataURL("image/png");
    image = image.replace('data:image/png;base64,', '');
    $.ajax({
        type: 'POST',
        url: "../../Admin/UploadImage",
        data: '{ "imageData" : "' + image + '" }',
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function (msg) {
            alert(msg);
        }
    });
});

Button calling: 

<button type="button" class="btn btn-primary" id="upload">Test</button>

Controller Method for saving image:

public void UploadImage(string imageData)
{
    string filePath = Server.MapPath(Url.Content("~/Content/Images/Teacher/"));

    string fileNameWitPath = filePath + DateTime.Now.ToString().Replace("/", "-").Replace(" ", "- ").Replace(":", "") + ".png";
    using (FileStream fs = new FileStream(fileNameWitPath, FileMode.Create))
    {
        using (BinaryWriter bw = new BinaryWriter(fs))
        {
            byte[] data = Convert.FromBase64String(imageData);
            bw.Write(data);
            bw.Close();
        }
    }
}

Upvotes: 1

Views: 235

Answers (1)

Iftikhar Ahmad
Iftikhar Ahmad

Reputation: 26

public JsonResult UploadImage(string imageData)
{
    string filePath = Server.MapPath(Url.Content("~/Content/Images/Teacher/"));

    string fileNameWitPath = filePath + DateTime.Now.ToString().Replace("/", "-").Replace(" ", "- ").Replace(":", "") + ".png";
    using (FileStream fs = new FileStream(fileNameWitPath, FileMode.Create))
    {
        using (BinaryWriter bw = new BinaryWriter(fs))
        {
            byte[] data = Convert.FromBase64String(imageData);
            bw.Write(data);
            bw.Close();
        }
    }
    return Json(new { success = true, message = "Success" });
}

Upvotes: 1

Related Questions