Databases
StackOverflow2013
Postsdbo
POWant to add text field values to database using jQuery AJAX
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POWant to add text field values to database using jQuery AJAX
    text
    copied!<p>I want to insert text field values to database using javascript jQuery AJAX call to C# server method. Problem is that AJAX call run successfully but C# is not updating the database. What could be the reason? Please reply soon. ASP code is giving below:</p> <pre><code> &lt;%@ Page Language="C#" AutoEventWireup="true" CodeFile="dbTest.aspx.cs" Inherits="dbTest" %&gt; &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt; &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt; &lt;head runat="server"&gt; &lt;title&gt;&lt;/title&gt; &lt;script src="jquery.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script src="json2.js" type="text/javascript"&gt;&lt;/script&gt; &lt;script type="text/javascript"&gt; function SaveOnClick() { $.ajax({ type: "POST", url: "dbTest.aspx/SaveData", data: "{'CustomerName': '" + $('#txtCustomerName').val() + "', 'CustomerPhoneNumber': '" + $('#txtCustomerPhoneNumber').val() + "', 'ColorID': '" + $('#txtColorID').val() + "'}", contentType: "application/json; charset=utf-8", dataType: "json", success: function(result, txtstatus) { alert(txtstatus); }, error: function(result) { alert("jQuery Error:" + result.statusText); } }); } &lt;/script&gt; &lt;/head&gt; &lt;body&gt; &lt;form id="form1" runat="server"&gt; &lt;div&gt; &lt;asp:DropDownList ID="Customers" runat="server"&gt; &lt;/asp:DropDownList&gt; &lt;/div&gt; &lt;div id="CustomerDetails"&gt; &lt;/div&gt; &lt;table border="0"&gt; &lt;tr&gt; &lt;td align="right"&gt;&lt;strong&gt;Customer Name:&lt;/strong&gt;&lt;/td&gt; &lt;td align="left"&gt; &lt;asp:TextBox id="txtCustomerName" maxlength="50" runat="server" /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td align="right"&gt;&lt;strong&gt;Customer Phone Number:&lt;/strong&gt;&lt;/td&gt; &lt;td align="left"&gt; &lt;asp:TextBox id="txtCustomerPhoneNumber" runat="server" /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td align="right"&gt;&lt;strong&gt;Color ID:&lt;/strong&gt;&lt;/td&gt; &lt;td align="left"&gt; &lt;asp:TextBox id="txtColorId" runat="server" /&gt; &lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td&gt;&amp;nbsp;&lt;/td&gt; &lt;/tr&gt; &lt;/table&gt; &lt;input type="button" onclick="SaveOnClick()" value="click me"/&gt; &lt;asp:Panel id="pnlConfirm" runat="server"&gt; &lt;h2&gt;Thanks for submitting your information to us!&lt;/h2&gt; &lt;/asp:Panel&gt; &lt;/form&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p>Below is C# file:</p> <pre><code>using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.Services; using System.Web.UI.WebControls; using System.Data.SqlClient; public partial class dbTest : System.Web.UI.Page { protected void Page_Load(object sender, EventArgs e) { pnlConfirm.Visible = false; } [WebMethod] public static void SaveData(string CustomerName, string CustomerPhoneNumber, string ColorID) { string Server = "al2c06"; string Username = "app_Testing"; string Password = "jsjsdj"; string Database = "AmbreenTest"; string ConnectionString = "Data Source=" + Server + ";"; ConnectionString += "User ID=" + Username + ";"; ConnectionString += "Password=" + Password + ";"; ConnectionString += "Initial Catalog=" + Database; string query = "INSERT INTO Customer_Order(customerName, customerPhoneNumber, colorID)"; query += "VALUES ("; query += "'" + CustomerName+ "'"; query += ","; query += "'" + CustomerPhoneNumber + "'"; query += ","; query += "'" + ColorID+ "'"; query += ")"; using (SqlConnection conn = new SqlConnection(ConnectionString)) { using (SqlCommand cmd = new SqlCommand(query, conn)) { conn.Open(); } } //lblSQL.Text = query; //pnlConfirm.Visible = true; } } </code></pre>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload