Question

In my static web method I populate a dictionary with the Bankid and Bankname that I select from a database. The Id goes to the Key and the Value goes to the value part. SO there’re approximately 20 key-value-pairs in my dictionary. Then I return this dictionary to my ajax call:

      $.ajax({
            type: 'POST',
            url: 'AJAX.aspx/Banks',
            data: '',
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data)
            {
                $.each(data.d, function ()
                {
                    $("#testDiv").append(this.Key + " " +this.Value + "<br/>");
                });
            },
            error: function (x, e)
            {
                alert("The call to the server side failed. " + x.responseText);
            }
        });

In the above case I get 20 rows of undefined undefined. But if I remove both .Key and .Value from this I just get the value, so bank names. I need both the key and the value because I’m going to populate a select element with them-key for value and the value for inner html.
In case you want to see my webmethod, here it is:

    [WebMethod]
public static Dictionary<string, string> Banks()
{
    Dictionary<string, string> dict = new Dictionary<string, string>();
    DatabaseProvider provider = GetDatabaseProvider();
    provider.AddOutParameter("V_CUR", OracleType.RefCursor);
    DataTable dt=provider.SelectDataTable("AGAPUS.PAYMENT.SP_BANKS", CommandType.StoredProcedure);
    foreach (DataRow row in dt.Rows)
    {
        dict.Add(row["PAYMENTTYPE"].ToString(), row["PAYMENTTYPEID"].ToString());
    }
    return dict;
}

Answer 1

Looks more like a question about jQuery to me. That said, try changing your success function to:

success: function (data)
{
    $.each(data.d, function ( key, value )
    {
        $("#testDiv").append(key + " " + value + "<br/>");
    });
}

The key and value are passed as parameters to the function when evaluating a map.