HelloIm usimg MS Visual Community 2017 SQL Express 2016I have the problem to run itI use HTML5 and master page web forms Here are the codes Master page fileltDOCTYPE htmlgtlthtml lang34en34gtlthead id34Head134 runat34server34gtltmeta charset34utf834 gtltmeta name34viewport34 content34widthdevicewidth initialscale1034 gtlttitlegt lt PageTitle gt My ASPNET ApplicationlttitlegtltaspPlaceH

Hi KatieNgocRefer below sampleHTMLMasterPageaspxlt Master Language34C34 AutoEventWireup34true34 CodeFile34MasterPagemastercs34 Inherits34MasterPage34 gtltDOCTYPE html PUBLIC 34W3CDTD XHTML 10 TransitionalEN34 34httpwwww3orgTRxhtml1DTDxhtml1transitionaldtd34gtlthtml xmlns34httpwwww3org1999xhtml34gtlthead runat34server34gt lttitlegtlttitlegt ltaspContentPlaceHolder ID34head34 runat34server34gt ltaspContentPlaceHoldergtltheadgtltbodygt ltform id34form134 runat34server34gt ltdivgt ltdiv class34navbar navbarinverse navbarfixedtop34gt ltdiv class34container34gt ltdiv class34navbarheader34gt ltbutton type34button34 class34navbartoggle34 datatoggle34collapse34 datatarget34navbarcollapse34

Insert and display Digital Signature in ASP.Net GridView using C# and VB.Net

KatieNgo...

SOLVED CLOSED ACTIVE ANSWERED
User: KatieNgoc
Posted: on May 29, 2019 02:03 AM
Forum: Data Controls
Answer: 1
Views: 8868
Sample Code: Download

Hello,

I'm usimg MS Visual Community 2017, SQL Express 2016.

I have the problem to run it.

I use HTML5 and master page + web forms. Here are the codes:

Master page file:

<!DOCTYPE html>
<html lang="en">
<head id="Head1" runat="server">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>
    <%: Page.Title %>
    - My ASP.NET Application</title>
<asp:PlaceHolder runat="server">
    <%: Scripts.Render("~/bundles/modernizr") %>
</asp:PlaceHolder>
<webopt:bundlereference runat="server" path="~/Content/css" />
<link href="~/favicon.ico" rel="shortcut icon" type="image/x-icon" />
</head>
<body>
<form id="Form2" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server">
    <Scripts>
        <%--To learn more about bundling scripts in ScriptManager see https://go.microsoft.com/fwlink/?LinkID=301884 --%>
        <%--Framework Scripts--%>
        <asp:ScriptReference Name="MsAjaxBundle" />
        <asp:ScriptReference Name="jquery" />
        <asp:ScriptReference Name="bootstrap" />
        <asp:ScriptReference Name="WebForms.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebForms.js" />
        <asp:ScriptReference Name="WebUIValidation.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebUIValidation.js" />
        <asp:ScriptReference Name="MenuStandards.js" Assembly="System.Web" Path="~/Scripts/WebForms/MenuStandards.js" />
        <asp:ScriptReference Name="GridView.js" Assembly="System.Web" Path="~/Scripts/WebForms/GridView.js" />
        <asp:ScriptReference Name="DetailsView.js" Assembly="System.Web" Path="~/Scripts/WebForms/DetailsView.js" />
        <asp:ScriptReference Name="TreeView.js" Assembly="System.Web" Path="~/Scripts/WebForms/TreeView.js" />
        <asp:ScriptReference Name="WebParts.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebParts.js" />
        <asp:ScriptReference Name="Focus.js" Assembly="System.Web" Path="~/Scripts/WebForms/Focus.js" />
        <asp:ScriptReference Name="WebFormsBundle" />
        <%--Site Scripts--%>
    </Scripts>
</asp:ScriptManager>
<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar">
                </span>
            </button>
            <a id="A5" class="navbar-brand" runat="server" href="~/">Application name</a>
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a id="A6" runat="server" href="~/">Home</a></li>
                <li><a id="A7" runat="server" href="~/About">About</a></li>
                <li><a id="A8" runat="server" href="~/Contact">Contact</a></li>
            </ul>
        </div>
    </div>
</div>
<div class="container body-content">
    <asp:ContentPlaceHolder ID="ContentPlaceHolder2" runat="server">
    </asp:ContentPlaceHolder>
    <hr />
    <footer><p>&copy; <%: DateTime.Now.Year %> - My ASP.NET Application</p></footer>
</div>
</form>

Defaut.aspx file:

<div class="tools">
        <a href="#colors_sketch" data-tool="marker">Marker</a> <a href="#colors_sketch" data-tool="eraser">
            Eraser</a>
    </div>
    <br />
    <canvas id="colors_sketch" width="300px" height="100pxs">   
    </canvas>
    <br />
    <br />
    <asp:textbox id="txtImageName" width="150px" height="30px" placeholder="Enter Your Image Name"
        runat="server" />
    <asp:button id="btnSave" text="Save Image" class="btnSuccess" onclick="OnUpload"
        runat="server" />
    <hr />
    <asp:hiddenfield id="ImageVal" runat="server" />
    <br />
    <asp:gridview id="GvImage" runat="server">  
    <Columns>           
     <asp:ImageField DataImageUrlField="FileName" HeaderText="Image" ControlStyle-Height="50" ControlStyle-Width="50" />
    </Columns>
    </asp:gridview>
    <asp:image id="myImagei" runat="server" />
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/mobomo/sketch.js/master/lib/sketch.min.js" type="text/javascript"></script>
<script type="text/javascript">
    $(function () {
        $('#colors_sketch').sketch(); $(".tools a").eq(0).attr("style", "color:#000");
        $(".tools a").click(function () {
            $(".tools a").removeAttr("style");
            $(this).attr("style", "color:#000");
        });
        $("#btnSave").bind("click", function () { var base64 = $('#colors_sketch')[0].toDataURL(); $('[Id*=ImageVal]').val(base64); });
    });   
</script>

Defauft aspx.cs file:

private string contring = ConfigurationManager.ConnectionStrings["CitiStaff"].ToString();
protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        GetData();
    }
}
protected void OnUpload(Object sender, EventArgs e)
{
    byte[] bytes = Convert.FromBase64String(ImageVal.Value.Split(',')[1]);
    using (FileStream stream = new FileStream(Server.MapPath("~/Images/" + txtImageName.Text.Trim() + ".png"), FileMode.Create))
    {
        stream.Write(bytes, 0, bytes.Length);
        stream.Flush();
    }

    using (SqlConnection con = new SqlConnection(contring))
    {
        using (SqlCommand cmd = new SqlCommand("INSERT INTO [File] VALUES(@ImageName)", con))
        {
            cmd.Parameters.AddWithValue("@ImageName", "Images/" + txtImageName.Text.Trim() + ".png");
            using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
            {
                DataTable dt = new DataTable();
                sda.Fill(dt);
            }
        }
    }
    txtImageName.Text = "";
    this.GetData();
}

private void GetData()
{
    using (SqlConnection con = new SqlConnection(contring))
    {
        con.Open();
        using (SqlCommand cmd = new SqlCommand("SELECT [FileName] FROM [File]", con))
        {
            using (SqlDataAdapter sda = new SqlDataAdapter(cmd))
            {
                DataTable dt = new DataTable();
                sda.Fill(dt);
                GvImage.DataSource = dt;
                GvImage.DataBind();
            }
        }
    }
}

Please help.

Thank you

Download FREE API for Word, Excel and PDF in ASP.Net

pandeyis...

0 2

Reply
ANSWER
User: pandeyism
Replied: on May 29, 2019 03:34 AM
Report

Hi KatieNgoc,

Refer below sample.

HTML

MasterPage.aspx

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <div class="navbar navbar-inverse navbar-fixed-top">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar">
                        </span>
                    </button>
                    <a id="A1" class="navbar-brand" runat="server" href="~/">Application name</a>
                </div>
                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li><a id="A2" runat="server" href="~/">Home</a></li>
                        <li><a id="A3" runat="server" href="~/About">About</a></li>
                        <li><a id="A4" runat="server" href="~/Contact">Contact</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="container body-content">
            <asp:ContentPlaceHolder ID="MainContent" runat="server">
            </asp:ContentPlaceHolder>
            <hr />
            <footer><p>&copy; <%: DateTime.Now.Year %> - My ASP.NET Application</p>            </footer>
        </div>
    </div>
    </form>
</body>
</html>

Default.aspx

<%@ Page Title="" Language="C#" MasterPageFile="~/MasterPage.master" AutoEventWireup="true"
    CodeFile="Default.aspx.cs" Inherits="_Default" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script src="https://cdn.rawgit.com/mobomo/sketch.js/master/lib/sketch.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function () {
            $('#colors_sketch').sketch(); $(".tools a").eq(0).attr("style", "color:#000");
            $(".tools a").click(function () {
                $(".tools a").removeAttr("style");
                $(this).attr("style", "color:#000");
            });
            $("[Id*=btnSave]").on("click", function () {
                var base64 = $('[id*=colors_sketch]')[0].toDataURL();
                $('[Id*=ImageVal]').val(base64);
            });
        });  
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="Server">
    <div class="tools">
        <a href="#colors_sketch" data-tool="marker">Marker</a> <a href="#colors_sketch" data-tool="eraser">
            Eraser</a>
    </div>
    <br />
    <canvas id="colors_sketch" width="300px" height="100pxs">  
    </canvas>
    <br />
    <br />
    <asp:TextBox ID="txtImageName" Width="150px" Height="30px" placeholder="Enter Your Image Name"
        runat="server" />
    <asp:Button ID="btnSave" Text="Save Image" class="btnSuccess" OnClick="OnUpload"
        runat="server" />
    <hr />
    <asp:HiddenField ID="ImageVal" runat="server" />
    <br />
    <asp:GridView ID="gvImages" runat="server" AutoGenerateColumns="false">
        <Columns>
            <asp:ImageField DataImageUrlField="Path" HeaderText="Image" ControlStyle-Height="50"
                ControlStyle-Width="50" />
        </Columns>
    </asp:GridView>
    <asp:Image ID="myImagei" runat="server" />
</asp:Content>

Namespaces

using System.Configuration;
using System.Data.SqlClient;
using System.Data;
using System.IO;

Code

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
        using (SqlConnection conn = new SqlConnection(constr))
        {
            using (SqlDataAdapter sda = new SqlDataAdapter("SELECT * FROM tblFilespath", conn))
            {
                DataTable dt = new DataTable();
                sda.Fill(dt);
                gvImages.DataSource = dt;
                gvImages.DataBind();
            }
        }
    }
}

protected void OnUpload(object sender, EventArgs e)
{
    string base64 = Request.Form[ImageVal.UniqueID].Split(',')[1];
    byte[] bytes = Convert.FromBase64String(base64);
    string filePath = string.Format("~/Uploads/{0}.png", txtImageName.Text);
    File.WriteAllBytes(Server.MapPath(filePath), bytes);
    string constr = ConfigurationManager.ConnectionStrings["constr"].ConnectionString;
    using (SqlConnection conn = new SqlConnection(constr))
    {
        string sql = "INSERT INTO tblFilespath VALUES(@Name, @Path)";
        using (SqlCommand cmd = new SqlCommand(sql, conn))
        {
            cmd.Parameters.AddWithValue("@Name", txtImageName.Text);
            cmd.Parameters.AddWithValue("@Path", filePath);
            conn.Open();
            cmd.ExecuteNonQuery();
            conn.Close();
        }
    }

    Response.Redirect(Request.Url.AbsoluteUri);
}

Screenshot

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

Insert and display Digital Signature in ASP.Net GridView using C# and VB.Net

Company

Explore

Follow us

Contact Us