JavascriptからWebサービスを呼び出す（パラメータを渡してデータセットを返す）

Question

私はC＃でWebサービスを作成しましたが、今はそれをモバイルアプリケーションから呼び出す必要があります。私はWindows 7のモバイルアプリケーションを作成しようとしていますが、HTML5とJavascriptをネイティブコードではなく使用しています。 Webサービスは2つのパラメータ、EmailとPasswordを取り、データセットを返します。私は実際にはjavascriptの経験（またはこのプロジェクトで学ぶことを試みることについては、その問題についてはWebサービスの経験）を持っていない、と私はちょうどあまりにも多くの情報を見つけたと知らなかったjavascriptを使用してWebサービスを呼び出す方法を研究しようとするとき多くの他の技術も言及されたので、どこから始めるのか。

だから私は物事を試してみることにしました、これは私がこれまでに思い付いたものです：

<script type="text/javascript"> 

     document.addEventListener("deviceready", onDeviceReady, false); 

     // once the device ready event fires, you can safely do your thing! -jm 
     function onDeviceReady() { 

     } 

     function LoginButton_onclick() { 
     UpdateChildrenApp.PhoneWebServices.GetMyChildren(document.getElementById('EmailBox').value,document.getElementById('PasswordBox').value, OnComplete, OnError) 
    } 

    function OnComplete(result) { 
     for (var i = 0; i < result.tables[0].rows.length; i++) 
      document.getElementById('Test').innerHTML += ''+(result.tables[0].rows[i].col_name); 
    } 

    function OnError(result) { 
    document.getElementById('Test').innerHTML ='Error :'+result.get_message(); 
    } 

    </script> 

私は、送信ボタンを押したときにこのコードは何もしません。誰かが問題の内容を指摘して、問題を解決する方法や問題を解決するために何を研究すべきかを示唆し、正しい軌道に乗せてくれますか？どんな助けでも大歓迎です。

Answer 1

JavaScriptを使用する場合は、まず、WebサービスがJSONオブジェクトを返す必要があります。 もちろん、任意のXML /文字列を返すことができますが、JSONを使用するとJavaScriptのデータを使いやすくなります。

jqueryはあなたに多くの仕事をするため、jqueryを使用してWebサービスを呼び出すことをお勧めします。

読むthis article、それはあなたが正しくさまざまなコンポーネントを設定するに役立つはず：

Answer 2

私はこの種のことを行うためにjQueryを使用します。 それが提供するajax機能は本当に使いやすいです。 私はRevealing Module Pattern（RMP）と2つのjavascriptファイルを使用します。

http://weblogs.asp.net/dwahlin/archive/2011/08/02/techniques-strategies-and-patterns-for-structuring-javascript-code-revealing-module-pattern.aspx

は私がRMPを使用して、私のjsのコードに構造のいくつかの種類を採用していけない場合、私はちょうど終わることを見つける：あなたはRMPに慣れていない方は、ここでそれをカバーする素晴らしい投稿があり1つのファイルに関数の混乱があります。

IdがStartup.jsとDataservice.js持っており、彼らはこのようなものになります。

Startup.js

var Startup = function() { 
    var isValid, 
     dataObject = {}, 

    populateDataObject = function() { 
     dataObject.dealer = $("[id$='_txtUser']").val(); 
     dataObject.password = $("[id$='_txtPassword']").val(); 

    }, 

    init = function() { 
     var dealerId = 0; 

     $("[id$='_SubmitButton']").bind('click', function (evt) { 
      evt.preventDefault(); 
      populateDataObject(); 


      if (isValid) { 
       Dataservice.processLoginRequest(dataObject, processLoginRequestResult); 
      } 
     }); 
    }; 

    return { 
     init: init, 
     processLoginRequestResult: processLoginRequestResult 
    }; 

}(); 

Dataservice.js（想定して古い学校の.asmx、必要に応じて変更）

var Dataservice = function() { 

    $.ajaxSetup({ 
     type: "POST", 
     contentType: "application/json; charset=utf-8", 
     dataType: "json" 
    }); 

    var serviceBase = '../services/LoginService.asmx/', 

    processScreenRequest = function (valObject, callback) { 
     $.ajax({ 
      url: serviceBase + "ProcessLoginRequest", 
      data: JSON.stringify(valObject), 
      success: function (json) { 
       callback(json); 
      } 
     }); 
    }; 

    return { 
     processScreenRequest: processScreenRequest 
    }; 

}(); 

これらの2つのjsファイルとjqueryについては、私のHTMLページに賛同します。 私はこれが役立つことを願っています。

Answer 3

私はあなたがxhrgetやxhrpost要求を行うことができ、そのは非常に簡単、一度このために道場を使用しました。これには、ページ内のHTMLコンポーネントの内容を変更できるコールバックであるloadという関数があります。

は、これらのリンクを使用してください：http://dojotoolkit.org/reference-guide/1.7/dojo/xhrGet.html