jqueryのないTypeScript/JavaScriptからMVCコントローラメソッドを呼び出す

Question

Ajax呼び出しでMVCコントローラメソッドを呼び出すことは、JScriptを使用しないタイプスクリプト/ JavaScriptで可能ですか？どうすれば私はJavaScript /タイプスクリプトファイルからコントローラメソッドを呼び出すことができますか？

をソートし、それにソート列を送信するためにコントローラのメソッドを呼び出している方法を考えてみましょう：

これはTSファイル内の関数である：

function SortData() 
    { 
    .... call Controller method and send sortCriteria (FullName) to it 

    } 

と、これはコントローラのメソッドです：

[Route("sortbycolumn")] 
    public ActionResult SortByColumn(string sortCriteria) 
    { 
     .... Do the sort retun back json result 
    } 

Answer 1

私がGETの例とPOSTを含ま+提出/使用してデータを受信しましたバニラJS &以下のAJAX。

詳細については、thisをお読みください。

幸運。

function SortData() { 

    var data; 

    //Post Example 
    var xhttp = new XMLHttpRequest(); 

    xhttp.open("POST", "/Controller/Action", true); 
    xhttp.setRequestHeader("Content-Type", "application/json"); 

    //There are two options for using xhttp.send(): Only keep the ONE that applies to you 

    //Option 1: Submit data to the server 
    xhttp.send(JSON.stringify(params)); 

    //OR 

    //Option 2: Nothing to submit to the server 
    xhttp.send(); 

    xhttp.onload = function(response) { 

     if(response.target.status == 200) { 

      data = JSON.parse(response.target.response); 

     } 

    }; 

    //Get Example 
    var xhttp = new XMLHttpRequest(); 

    xhttp.open("GET", "/Controller/Action", true); 
    xhttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest'); 

    //There are two options for using xhttp.send(): Only keep the ONE that applies to you 

    //Option 1: Submit data to the server 
    xhttp.send(JSON.stringify(params)); 

    //OR 

    //Option 2: Nothing to submit to the server 
    xhttp.send(); 

    xhttp.onload = function(response) { 

     if(response.target.status == 200) { 

      data = JSON.parse(response.target.response); 

     } 

    }; 
} 

Answer 2

もちろん可能です。実際、jQueryはJavaScriptをベースにしたライブラリであり、独立した言語ではありません。ここであなたがしなければならないものです：

function SortData(){ 
    // Every ajax call is an XMLHttpRequest 
    var xhttp = new XMLHttpRequest(); 

    // It means that your request is processed asynchronously. 
    // So we need to define the method that has to be run once the response is received, 
    xhttp.onreadystatechange = function() { 

    // status 200 means that your request has been processed successfully. 

    if (this.readyState == 4 && this.status == 200) { 
     // Change your html here 
    } 
    }; 
    // Setting your request 
    xhttp.open("POST", "mycontroller/myaction", true); 

    // Send your request when everything is set. 
    xhttp.send(); 
} 

あなたは、このリンクをチェックアウト、知っているより多くを必要とする場合：https://www.w3schools.com/xml/ajax_intro.asp