0

ユーザーがサプライヤー名を入力するテキスト ボックスがあります。ブラーでは、Web サービスをチェックしてサプライヤーが存在するかどうかを確認したいと考えています。存在する場合は、Web サービスからサプライヤー ID を返し、それを使用して別のテキスト ボックスに入力したいと考えています。

他の場所でうまく使用しているため、Webサービスは正常に機能しています（オートコンプリートを行うための同様のコードを使用）。JSONでデータを返し、次のようになります。

<?xml version="1.0" encoding="UTF-8"?>
-<ArrayOfSuppliers xmlns="http://tempuri.org/" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"> 
  -<Suppliers> 
       <SupplierID>1</SupplierID> 
       <SupplierName>Supplier 1</SupplierName> 
   </Suppliers> 
 </ArrayOfSuppliers>

この次のコードはめちゃくちゃで、そのままでは機能しません。私が何をしようとしているのかを説明するのに役立つことを願っています.

開始点として、「応答」が未定義であるというエラーが表示されます。理由はわかりますが、それを修正するために何をする必要があるかを知るには十分ではありません。

   $(document).ready(function () {
    $("[id$=txtSupplier]").blur(function () {

        $.ajax({
             type: "POST",
             url: "http://localhost:52350/FabRouting/Webservice/SupplierList.asmx/GetSuppliers",
             data: "{ 'SupplierSearch': '" + $("[id$=txtSupplier]").val() + "' }",
             contentType: "application/json; charset=utf-8",
             dataType: "json",
             dataFilter: function (data) { return data; },
             success: function (data) {
                response($.map(data.d, function (item) {
                   return {
                   value: item.SupplierName,
                   id: item.SupplierID
                 }
                 }))
                 },
             error: function(e){
                 $("[id$=lblSupplier]").html("Unavailable");              
             }
         });
        }
        );
    });

これが機能するようになった後も、返されたものを取得してテキスト ボックスを設定する方法を知る必要がありますが、このコードをある程度機能させることができれば、おそらくそれを解決することができます。

編集

このコードでオートコンプリートが機能しています：

$(document).ready(function () {
$(".cRejectedOnSDRR").autocomplete({
    source: function (request, response) {
        $.ajax({
            url: "http://localhost:52350/FabRouting/Webservice/ReportList.asmx/GetReports",
            data: "{ 'ReportNumberSearch': '" + request.term + "' }",
            dataType: "json",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            dataFilter: function (data) { return data; },
            success: function (data) {
                response($.map(data.d, function (item) {
                    return {
                        value: item.ReportNumber,
                        id: item.SDRRID
                    }
                }))
            },
            error: function (XMLHttpRequest, textStatus, errorThrown) {
                alert(textStatus);
            }
        });
    },
    minLength: 1,
    select: function (event, ui) {
        $("[id$=lblRejectedOnSDRRID]").html(ui.item.id);
    },
});

});

そして、それをベースとして、私が上で述べたぼかしを行うための基礎として使用しようとしていました. Web サービスから返されたデータを単純に取得して使用する方法を十分に理解していないため、オートコンプリート コードをリバース エンジニアリングして、理解できるようにしようとしていました。

4

4 に答える 4

2

[ScriptService]手始めに、JSONではなくXMLを返すため、属性で装飾してWebサービスでJSONをアクティブ化する必要があります。

[WebService(Namespace = "http://tempuri.org/")]
[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
[ScriptService]
public class SupplierList: System.Web.Services.WebService
{
    public Suppliers[] GetSuppliers(string supplierSearch)
    {
        ...
    }
}

次に、クライアントでパラメーターをJSON.stringify作成するときに行った文字列連結の代わりにメソッドを使用する必要dataがあります。これにより、リクエストパラメーターの適切なJSONエンコードが保証されます。

data: JSON.stringify({ supplierSearch: $("[id$=txtSupplier]").val() },

次に、successコールバック内で使用しています。data.dこれは、プロパティを使用するため、JSON対応のWebサービスで問題ありませんが、コンテキスト内にあるため、コンテキスト内に明らかに存在しないjavascript関数を.d呼び出しているようです。 AJAXリクエストの成功コールバック。これは、この関数を使用するjQuery UIオートコンプリートプラグインの例からの、コードの意味を理解せずにコピーアンドペーストするという非常に貧弱なアクションだと思いますが、シナリオではまったく意味がありません。response$.map

だから、ええ、あなたが今受け取っているエラーメッセージは完全に理にかなっています。関数を定義してresponseいませんが、それを呼び出そうとしています。

jQueryオートコンプリートプラグインを使用する場合、それは正しい使用方法ではありません。ぼかしイベントを購読しないでください。例については、ドキュメントをお読みください。しかし、私はあなたが何を達成しようとしているのかさえわかりません。

したがって、このプラグインをWebサービスに接続する場合は、次のことを試してみてください。

$(document).ready(function () {
    $('[id$=txtSupplier]').autocomplete({
        source: function(request, response) {
            $.ajax({
                url: 'http://localhost:52350/FabRouting/Webservice/SupplierList.asmx/GetSuppliers',
                data: JSON.stringify({ supplierSearch: request.term },
                contentType: 'application/json; charset=utf-8',
                success: function(data) {
                    response($.map(data.d, function(item) {
                        return {
                            label: item.SupplierID,
                            value: item.SupplierName
                        }
                    }));
                }
            });
        },
        minLength: 2
    });
});
于 2012-07-02T21:59:56.627 に答える
0

ここで行われているように：

var SupplierID = $(data).find("SupplierID").text();
于 2012-07-02T21:58:22.580 に答える
0

XMLをJSONにシリアル化しない限り、Majidは正しいですが、これは機能しませんが、これが原因でエラーが発生したとは思いません。GenericHandlersを調べましたか？

于 2012-07-02T21:58:28.033 に答える
0

さて、私はついにそれを理解しました。私は自分が間違った道を進んでいると確信していましたが、何を間違っていたのか、Web サービスから返されたデータにアクセスする方法がわかりませんでした。Darin のおかげで、コードを使ってあきらめずに戦うことができました。彼は私がやりたいことを完全に理解していたとは思いませんが、私が理解していないコードを使用しようとしていることは理解していました:)最終結果で彼の文字列化の提案を使用しましたが、それなしで機能していましたええと...彼は、私が想定している目的のために使用していたコードよりも優れたオプションとしてこれを言及していました。

私は最終的に正しい構文を理解し始めました-別名: data.d.SupplierID しかし、それはウェブ上の他の人のために働いているように見えましたが、それでも私が探していたものは返されませんでした. 私はついにインデックスを使用していた人に出会いました-別名: data.d[0].SupplierID そしてついに私のために働き始めました。インデックスについてしばらく疑問に思っていましたが、それを処理する方法がわかりませんでした。

最終的な作業コードは次のとおりです。

    $(document).ready(function () {
    $("[id$=txtSupplier]").blur(function () {

        $.ajax({
            type: "POST",
            url: "http://localhost:52350/FabRouting/Webservice/SupplierList.asmx/CheckSupplier",
            data: JSON.stringify({ SupplierSearch: $("[id$=txtSupplier]").val() }),
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function(data){
                if (data.d.length == 0) {
                    $("[id$=lblSupplierID]").html("0");
                }
                else {
                    $("[id$=lblSupplierID]").html(data.d[0].SupplierID);
                }
            },
             error: function(e){
                 $("[id$=lblSupplierID]").html("0");
             }
         });
        }
        );
    });

null をチェックする if ステートメントを追加しました。これは、結果が見つからないときにエラーが発生しなかったため、エラー関数で処理できなかったためです。null を返す SQL クエリは必ずしもエラーではなく、対処する必要があるため、これは設計によるものと想定しています。誰かがこれを処理するより良い (または正しい) 方法を持っている場合は、私に知らせてください。

于 2012-07-03T01:42:33.850 に答える