0

ユーザーが入力した後にデータベースに保存するためにコードビハインドに渡す必要があるアドレス情報を収集する単純なモーダル jQuery ダイアログポップアップがあります。私は何百もの例を検索しましたが、以下の時点で最新ですが、何をしても、作成された JSON 文字列は、渡そうとするすべてのフィールドに対して「未定義」と表示されます。私の結論は、jQuery で JSON 文字列を作成するために使用している方法は間違っているということですが、これを行うためにさまざまな方法を試した後、どれも機能しません。IDでフィールドにアクセスしようとしましたが、クラスと、以下に示すように、さまざまな方法を使用してIDでアクセスしました。コードのスニペットを次に示します。誰が私がどこで間違っているかを見ることができますか?

<script type="text/javascript">
    $(function () {
        $('#dialog').dialog({
            draggable: true,
            resizeable: false,
            autoOpen: false,
            height: 700,
            width: 550,
            modal: true,
            top: 0,
            left: 0,
            title: 'Edit Information',
            buttons: {
                'Save': function () {                        
                    $('#ibSaveInfo').click();
                },
                'Cancel': function () {
                    $(this).dialog('close');
                }
            }
        }).parent().css('z-index', '1005');
    });

    $(document).on("click", "#ibSaveInfo", function () {
        var inputArray = new Array;
        var idx = 0;

        inputArray[idx] = 'Address1:' + $("#dialog").find("#txtAddress1").val();

        idx++;
        inputArray[idx] = 'Address2:' + $("#txtAddress2").val();

        idx++;
        inputArray[idx] = 'city:' + $("txtcity").val();

        etc, etc

        var inputArrayList = "{ inputArray: " + JSON.stringify(inputArray) + "}";
        $.ajax({
            type: "POST",
            dataType: "json",
            contentType: "application/json",
            url: "Address.aspx/SaveInfo",
            data: inputArrayList,
            success: function (data) {
                //debugger;

                if (data.d.indexOf("Error") != -1) {
                }
                else {
                    $("#ResultLabel").show();
                    $("#ResultLabel").text("Sum of all the contents is: " + data.d);
                }
            },
            error: function (e, ts, et) {
                //debugger;
                alert(ts);
            }
        }); //ajax func end
    });

    $(document).ready(function () {
        $("#ibEdit").click(function (e) {
            $('#dialog').dialog('option', 'position', [e.pageX + 10, e.pageY + 10]);
            $('#dialog').dialog('open');
        });
    });


<div id="dialog" style="padding-left: 10px; padding-bottom: 15px;">
    <asp:TextBox runat="server" ID="txtAddress1" ClientIDMode="Static" />
    <asp:TextBox runat="server" ID="txtAddress2" ClientIDMode="Static" />
    <asp:TextBox runat="server" ID="txtCity" ClientIDMode="Static" />
    etc, etc
</div>
4

2 に答える 2

0

正確なコードのjsFiddleを作成しました：

http://jsfiddle.net/PfgQy/

city# が欠落しており、大文字と小文字が正しくないため (大文字の C が必要です) 、フォーム フィールドを除いて動作しているようです。

$("#txtCity").val();

すべてのフィールドがまだ壊れている場合は、問題の原因となっているのは、提供していないページ上の何かです。

お役に立てれば。

デイブ

于 2013-03-19T21:38:21.810 に答える
0

編集: asp テキストボックスを使用していることに気付きました。asp を使用すると、要素の ID が変更されます。<input>サーバーからこれらの値にアクセスするつもりがない場合は、通常のテキスト ボックスを使用してみてください。

これの代わりに

idx++;
        inputArray[idx] = 'city:' + $("txtcity").val();

array.push 関数を使用するだけです。

var inputArray = [];
inputArray.push('Address1:' + $("#txtAddress1").val());
inputArray.push('Address2:' + $("#txtAddress2").val();)
inputArray.push('city:' + $("txtcity").val());

ここでも、コードでクリック関数を呼び出す代わりに、別の関数への参照を与えるだけです

$(function () {
        $('#dialog').dialog({
            draggable: true,
            resizeable: false,
            autoOpen: false,
            height: 700,
            width: 550,
            modal: true,
            top: 0,
            left: 0,
            title: 'Edit Information',
            buttons: {
                'Save': save(),
                'Cancel': function () {
                    $(this).dialog('close');
                }
            }
        }).parent().css('z-index', '1005');
    });

function save(){
  var inputArray = [];
  inputArray.push('Address1:' + $("#txtAddress1").val());
  inputArray.push('Address2:' + $("#txtAddress2").val());
  inputArray.push('city:' + $("#txtCity").val()); 
  var json = { "inputArray": inputArray};
        inputArrayList = JSON.stringify(json);
//ajax stuff
}

また、2 つのドキュメント対応関数があるため、それらを組み合わせることができます。これらはどちらも、ドキュメントの準備ができていることを宣言する方法です。

$(document).ready(function(){});
$(function () {});
于 2013-03-19T21:38:59.083 に答える