Asp.net C＃でjQuery Ajaxを使用してデータを挿入する[データベースのデータベース]

Question

Asp.net C＃でjQuery Ajaxを使用してMySqlデータベースに新しいレコードを挿入する必要があります。

私は、Webサービスメソッドを使用する場合、このチュートリアルを試してみました： https://codepedia.info/insert-data-using-jquery-ajax-in-asp-net-csharp-database-ms-sql-server/

を私がエラーを持っていないが、データが挿入されていません。

私は単純なクエリのSQLを挿入しようとしましたが、成功しませんでした。

私を助けることができますか？

ありがとうございます。

マイコードは以下のとおりです。

WebService.cs

using System; 
using System.Configuration; 
using System.Data.Odbc; 
using System.Web; 
using System.Web.Services; 

[WebService(Namespace = "http://tempuri.org/")] 
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)] 

public class WebService : System.Web.Services.WebService 
{ 
    public WebService() 
    { 

    } 

    public class userDetails 
    { 
     public string firstName; 
    } 

    [WebMethod] 
    public void AddRecord(userDetails userDetails) 
    { 
     //SIMPLE SQL QUERY INSERT INTO 
     string query = String.Format(" INSERT INTO doTable "); 
     query += String.Format(" (name) "); 
     query += String.Format(" VALUES ('foo'); "); 

     using (OdbcConnection conn = 
      new OdbcConnection(ConfigurationManager.ConnectionStrings["ConnMySQL"].ConnectionString)) 
     { 
      using (OdbcCommand cmd = 
       new OdbcCommand(query, conn)) 
      { 
       try 
       { 
        cmd.Connection.Open(); 
        cmd.ExecuteNonQuery(); 
       } 
       catch (Exception ex) 
       { 
        throw new ApplicationException("operation failed!", ex); 
       } 
       finally 
       { 
        cmd.Connection.Close(); 
       } 
      } 
     } 
    } 
} 

HMTLページ：あなたはRESTサービスとSOAPサービスの.NET ASMX Webサービスとの違いを知っている必要

<script src="3.2.1/jquery.min.js" type="text/javascript"></script> 

<script type="text/javascript"> 

    $(document).ready(function() { 

     $("#activatedLink").on('click', function (e) { 

      e.preventDefault(); 
      var userDetails = {}; 

      userDetails.firstName = $("#randomdirectory").val(); 

      var jsonData = JSON.stringify({ 
       userDetails: userDetails 
      }); 

      $.ajax({ 
       type: "POST", 
       url: "WebService.asmx/AddRecord", 
       data: jsonData, 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       success: OnSuccess, 
       error: OnErrorCall 
      }); 

      function OnSuccess(response) { 
       var result = response.d; 
       if (result == "success") { 
        $("#msg").html("New record addded successfully :)").css("color", "green"); 
       } 
       $("#randomdirectory").val(""); 
      } 

      function OnErrorCall(response) { 
       $("#msg").html("Error occurs :(").css("color", "red"); 
      } 

     }); 

    }); 

</script> 



<form id="form1"> 
    <div id="Tree"> 
     <input type="hidden" id="randomdirectory" name="randomdirectory" value="CEF"> 
      <a id="activatedLink" data-id="CEF" 
      href="javascript:document.getElementById('loading').style.visibility = 'visible'; 
      location.href='http://...';" target="_top"> 
      <span>CEF</span></a> 
    </div> 
</form> 

Answer 1

you can also create a static web method at back end of aspx page and can call back end method and insert data 
use below code : 

write web method at back end in aspx.cs file: 
[WebMethod] 

public static void AddRecord(userDetails userDetails) 
{ 
    //SIMPLE SQL QUERY INSERT INTO 
    string query = String.Format(" INSERT INTO doTable "); 
    query += String.Format(" (name) "); 
    query += String.Format(" VALUES ('foo'); "); 

    using (OdbcConnection conn = 
     new OdbcConnection(ConfigurationManager.ConnectionStrings["ConnMySQL"].ConnectionString)) 
    { 
     using (OdbcCommand cmd = 
      new OdbcCommand(query, conn)) 
     { 
      try 
      { 
       cmd.Connection.Open(); 
       cmd.ExecuteNonQuery(); 
      } 
      catch (Exception ex) 
      { 
       throw new ApplicationException("operation failed!", ex); 
      } 
      finally 
      { 
       cmd.Connection.Close(); 
      } 
     } 
    } 
} 




    <script src="3.2.1/jquery.min.js" type="text/javascript"></script> 

    <script type="text/javascript"> 

     $(document).ready(function() { 

      $("#activatedLink").on('click', function (e) { 

       e.preventDefault(); 
       var userDetails = {}; 

       userDetails.firstName = $("#randomdirectory").val(); 

       var jsonData = JSON.stringify({ 
        userDetails: userDetails 
       }); 

       $.ajax({ 
        type: "POST", 
        url: "pagename.aspx/AddRecord",  //here specify the name of our page where the method is present 
        data: jsonData, 
        contentType: "application/json; charset=utf-8", 
        dataType: "json", 
        success: OnSuccess, 
        error: OnErrorCall 
       }); 

       function OnSuccess(response) { 
        var result = response.d; 
        if (result == "success") { 
         $("#msg").html("New record addded successfully :)").css("color", "green"); 
        } 
        $("#randomdirectory").val(""); 
       } 

       function OnErrorCall(response) { 
        $("#msg").html("Error occurs :(").css("color", "red"); 
       } 

      }); 

     }); 

    </script> 



    <form id="form1"> 
     <div id="Tree"> 
      <input type="hidden" id="randomdirectory" name="randomdirectory" value="CEF"> 
       <a id="activatedLink" data-id="CEF" 
       href="javascript:document.getElementById('loading').style.visibility = 'visible'; 
       location.href='http://...';" target="_top"> 
       <span>CEF</span></a> 
     </div> 
    </form> 

Answer 2

されます通常のAjax投稿が文字列化されたSOAPサービスjsonは動作しません。これは体でなければなりません

var data = '<?xml version="1.0" encoding="utf-8"?> 
<soap12:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope"> 
    <soap12:Body> 
    <CelsiusToFahrenheit xmlns="https://www.w3schools.com/xml/"> 
     <Celsius>{Your Value}</Celsius> 
    </CelsiusToFahrenheit> 
    </soap12:Body> 
</soap12:Envelope>'; 

：SOAPリクエストspesificationsはあなたが好きあなたの体を作成する必要があり、そのサービスを要求したい場合は、たとえば、ここにhttps://www.w3schools.com/xml/tempconvert.asmx?op=CelsiusToFahrenheit

のように作成されたページに書かれています要求ヘッダーのフィールドを次のように設定する必要があります。

$.ajax({ 
       type: "POST", 
       url: "https://www.w3schools.com/xml/tempconvert.asmx?op=CelsiusToFahrenheit", 
       data: data, 
       contentType: "application/soap+xml; charset=utf-8", 
       dataType: "text/xml", 
       success: function(data) { 
        console.log('success'); 
       }, 
       error: function(data) { 
        console.log('failure'); 
       }, 
      }); 

その後、SOAPリクエストを成功させることができます。