how to use image editor in asp.net

[savitasagar]

i used the image editor control of ajax but it is not able to edit the image or upload the image. i want to use image editor with upload the image

[rickyenjohns]

You should use Tables or DIV to make the triangle for the login controls.
If you are Newbie to Web development I will prefer you to use Table. Example HTML for your triangle can be
<table style="width: 100%; background-color: Grey;">
<tr>
<td>
<!-- Your Login controls here -->
</td>
</tr>
</table>
You can place above code at the place where you want to use login controls. You can adjust color, width and height as per your need.

[umamahesh2020]

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">    
    <script type="text/javascript">
        function updateImage() {
            var req = '/ImageWorkshop/GetImage?';
            var query = '';
 
            if ($('#HorizontalFlip').is(':checked'))
                query += '&HorizontalFlip=1';
            if ($('#VerticalFlip').is(':checked'))
                query += '&VerticalFlip=1';
            if ($('#RotateLeft').is(':checked'))
                query += '&RotateLeft=1';
            if ($('#RotateRight').is(':checked'))
                query += '&RotateRight=1';
 
            req += query.substr(1);
            $('#image').attr("src", req);
        }
    </script>
 
    <h2>Image Workshop</h2>
 
    <% using(Html.BeginForm()) { %>
        <table border="0" cellpadding="0" cellspacing="5">
        <tr>
        <td valign="top" rowspan="10">
            <img src="/ImageWorkshop/GetImage"  id="image" alt="" />
        </td>
        <td valign="middle"><input type="checkbox" id="HorizontalFlip" value="1" />
            Flip horizontally</td>
        </tr>
        <tr>
        <td valign="middle"><input type="checkbox" id="VerticalFlip" value="true" />
            Flip vertically</td>
        </tr>
        <tr>
        <td valign="middle"><input type="checkbox" id="RotateLeft" value="true" />
            Rotate left</td>
        </tr>
        <tr>
        <td valign="middle"><input type="checkbox" id="RotateRight" value="true" />
            Rotate right</td>
        </tr>
        <tr>
        <td><input type="button" value="Preview" onclick="updateImage()" /></td>
        </tr>
        </table>
    <% } %>
</asp:Content>

public class ImageWorkshopController : Controller

{

    [HttpGet]

    public ActionResult Index()

    {

        return View();

    }

 

    public void GetImage(string horizontalFlip="", string verticalFlip="",

                        string rotateLeft="", string rotateRight="")

    {

        var imagePath = Server.MapPath("~/images/bunny-peanuts.jpg");

        var image = new WebImage(imagePath);

 

        if (!string.IsNullOrWhiteSpace(verticalFlip))

            image = image.FlipVertical();

        if (!string.IsNullOrWhiteSpace(horizontalFlip))

            image = image.FlipHorizontal();

        if (!string.IsNullOrWhiteSpace(rotateLeft))

            image = image.RotateLeft();

        if (!string.IsNullOrWhiteSpace(rotateRight))

            image = image.RotateRight();

 

        image.Write();

    }

}

[umamahesh2020]

For the referal Link is URL