Send Image using Ajax Call and transfer code behind web method asp.net c#

Question

I am trying to Send Image using Ajax Call and transfer code behind web method asp.net c#.

Below is my script.

<script type="text/javascript">
    function SubmitFunction() {
        alert(imgData_Based64String);
        imgData_Based64String = "test";
        $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "index.aspx/SaveImage",
            data: "{ 'Based64BinaryString' :'" + imgData_Based64String + "'}",
            dataType: "json",
            success: function (data) {
                alert("success");
            },
            error: function (result) {
                alert("Error");
            }
        });
    }

</script>

Below is my image and button code.

<img src="img.jpg" id="img" width="100px" height="100" />
<asp:Button ID="btnCapture" Text="Capture" runat="server" OnClientClick="SubmitFunction();"
        OnClick="btnCapture_Click" />

Code behind C#.

[System.Web.Services.WebMethod]
public static void SaveImage(string Based64BinaryString)
{
    string Value = Based64BinaryString;       
}

Actually I am new into to Ajax call, Image should convert to binary format and transfer to web method string value. Also Image ID is not declaring into the above script code to convert binary format. What I am trying one image is there and that Image to transfer to a SQL table.

It really isn't clear what exactly the problem is. What exactly doesn't work? — Dekel
– Dekel, Commented Oct 1, 2016 at 13:45
if you're trying to post an image the content type cannot json. — Daniel Manta
– Daniel Manta, Commented Oct 1, 2016 at 13:48
I want to transfer image to code behind web method to stored into sql table. @Dekel — Mr doubt
– Mr doubt, Commented Oct 1, 2016 at 13:50
Then how to transfer image using ajax call to web method. @derloopkat — Mr doubt
– Mr doubt, Commented Oct 1, 2016 at 13:54
Check this stackoverflow.com/questions/14575787/… You are probably using a webservice and this code is for MVC but the jQuery call can be useful. — Daniel Manta
– Daniel Manta, Commented Oct 1, 2016 at 13:54

Aleksey · Accepted Answer · 2019-10-25 18:48:08Z

function readURL(input) {
    if (input.files && input.files[0]) {
        var reader = new FileReader();
        reader.onload = function (e) {
            $('#falseinput').attr('src', e.target.result);
            var data = {};
            data.image = e.target.result;
            $.ajax({
                type: "POST",
                url: "someWebForm.aspx/SomeWebMethod",
                data: JSON.stringify(data),
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (r) {
                    //do something
                }
            });
            return false;
        };
        reader.readAsDataURL(input.files[0]);
    }
}

 [System.Web.Services.WebMethod]
        public static string SomeWebMethod(string image)
        {
            MemberImageData = image;

            return MemberImageData;
        }

Collectives™ on Stack Overflow

Send Image using Ajax Call and transfer code behind web method asp.net c#

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related