title: Generate Barcode image from Textbox value
body: <p>I am using <a href="https://github.com/lindell/JsBarcode" rel="nofollow">JsBarcode</a> </p>
  
  <p>I am trying to display a barcode image which was generated from textbox's value.</p>
  
  <pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head runat="server"&gt;
      &lt;title&gt;&lt;/title&gt;
      &lt;script src="JsBarcode.all.js"&gt;&lt;/script&gt;
      &lt;script&gt;
          function textToBase64Barcode(text) {
              var canvas = document.createElement("canvas");
              JsBarcode(canvas, text, { format: "CODE39" });
              return canvas.toDataURL("image/png");
          }
          function getBarcode() {
              var input = document.getElementById('&lt;%= txtInput.ClientID %&gt;').value;
              document.getElementById("image").setAttribute("src", textToBase64Barcode(input));
          }
    &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;form id="form1" runat="server"&gt;
          &lt;img id="image" /&gt;
          &lt;br /&gt;
          &lt;asp:TextBox ID="txtInput" runat="server"&gt;&lt;/asp:TextBox&gt;
          &lt;br /&gt;
          &lt;asp:Button ID="btnSubmit" runat="server" Text="Show Barcode" OnClientClick="getBarcode()" /&gt;
          &lt;br /&gt;   
      &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Problem I have is that the Barcode appears and disappear right away. How do I:</p>
  
  <ul>
  <li>Keep the image barcode appearing on the page</li>
  <li>Retrieve the image Base64 value in the code behind (so I can save it to a database)</li>
  </ul>