ASP.NET & AJAX

Απ: jQuery Ajax με JSON από Dataset

koslyr — Sun, 08 Jan 2012 00:28:42 GMT

Τελικά όλα ΟΚ!!!!!
Ο τελικός κώδικας με τον οποίο έπαιξε είναι ο:

var Categories = jQuery.parseJSON(response.d);
 $.each(Categories.Table, function (index, Category) {
          ddlCategory.append('<option value="' + Category.CategoryID + '">' + Category.CategoryName + '</option>');
                     });

Υπήρχε το πρόβλημα που ανεφερες με το WebService που επεστρεφε ένα απλό string, ενω χρειαζότανε το Json αντικειμενο.

Επιπλέον στο WebService χρησιμοποίησα την βιβλιοθηκη JSON.Net για την μετατροπή του dataset σε string.

using Newtonsoft.Json;

......

[WebMethod]
        public string GetAllGategories()
        {
            string strCon = MasterDataJQuery.ClsWebConfig.GetConnectionString();
            string strSql = "SELECT CategoryID, CategoryName FROM Categories Where CategoryID<3 ORDER BY CategoryName";
            OleDbDataAdapter da = new OleDbDataAdapter(strSql, strCon);
            DataSet ds = new DataSet();
            da.Fill(ds);

            string json = JsonConvert.SerializeObject(ds, Formatting.Indented);
            return json;
        }

Τώρα πλέον το dropdown γεμιζει σωστά. Θα μπορούσα στην παραπάνω υλοποίηση να βελτιστοποιήσω κάτι;

Απ: jQuery Ajax με JSON από Dataset

tasos — Sat, 07 Jan 2012 23:38:58 GMT

Σχετικά με το response.d
Έτρεξα το εξής:

var Categories = {"Table":[{"CategoryID":1,"CategoryName":"Beverages"},{"CategoryID":2,"CategoryName":"Condiments"}]};

function handle_data() {
    var ddlCategory = $('#data');
    $.each(Categories.Table, function (index, Category) {
        ddlCategory.append('<option value="' + Category.CategoryID + '">' + Category.CategoryName + '</option>');
    });
}

το οποίο τρέχει σωστά. Το response.d που είναι στο κώδικα σου είναι ένα JSON element το οποίο περιέχει ένα Table. Είναι στην ουσία ένα datset (σε JSON) και περιέχει datatables. Οπότε στο javascript πρέπει να γράψεις σε ποιο datatable θέλεις κάνεις το iteration.

Σχετικά με τη μετατροπή string2json
Τώρα, αν αλλάξω το Categories να είναι ένα string όπως αυτό:

var Categories = '{"Table":[{"CategoryID":1,"CategoryName":"Beverages"},{"CategoryID":2,"CategoryName":"Condiments"}]}';

παίρνω ένα ddl με πάρα πολλά undefined elements. Τα undefined elements είναι τόσα όσα και οι χαρακτήρες του παραπάνω string.

Άρα με βάση το παραπάνω η web method σου επιστρέφει string και όχι κάποιο JSON αντικείμενο. Η συνάρτηση που χρησιμοποιείς είναι σωστά, αλλά όταν η web method απαντάει επιστρέφει string. πρέπει να κάνεις μία μετατροπή και στο client ώστε να πάρεις το JSON αντικείμενο.

Υπάρχει η σχετική συνάρτηση της jQuery.parseJSON(string)

Απ: jQuery Ajax με JSON από Dataset

koslyr — Sat, 07 Jan 2012 22:17:11 GMT

tasos:
Εφόσον το response.d είναι json δοκίμασε να γράψεις
var Categories = response.d.Table;
Μία ερώτηση: Τα undefined που δημιουργούνται πόσα είναι;
Edit: Τώρα είδα τη 2η απάντηση σου. Από αυτό που λες καταλαβαίνω πως το response.d δεν είναι json αντικείμενο αλλά ένα απλό string.

Τα undefined που δημιουργούνται είναι τόσα όσα τα iterations που κάνει το each.
Δεν κατάλαβα αυτό που αναφερεις για το response.d. Στο firebug το response.d που παιρνω πριν αρχισω το iternation ειναι το ακόλουθο:
{"Table":[{"CategoryID":1,"CategoryName":"Beverages"},{"CategoryID":2,"CategoryName":"Condiments"}]}
το οποίο έχει προκύψει από το παρακάτω webservice:

[WebMethod]
        public string GetAllGategories()
        {
            string strCon = MasterDataJQuery.ClsWebConfig.GetConnectionString();
            string strSql = "SELECT CategoryID, CategoryName FROM Categories Where CategoryID<3 ORDER BY CategoryName";
            OleDbDataAdapter da = new OleDbDataAdapter(strSql, strCon);
            DataSet ds = new DataSet();
            da.Fill(ds);

            JavaScriptSerializer serializer = new JavaScriptSerializer();
            string json = serializer.Serialize(JsonMethods.ToJson(ds));

            return json;
        }

Για την μετατροπή του DataSet σε Json format χρησιμοποίησα το JsonMethods που περιέχει μια έτοιμη public function (ToJson) για την αυτόματη μετατροπή του dataset σε Json
http://schotime.net/blog/index.php/2008/07/27/dataset-datatable-to-json/
Μήπως τελικά το Json που δημιουργειται δεν ειναι το σωστό;;;;;

Απ: jQuery Ajax με JSON από Dataset

tasos — Sat, 07 Jan 2012 21:59:48 GMT

Εφόσον το response.d είναι json δοκίμασε να γράψεις

var Categories = response.d.Table;

Μία ερώτηση: Τα undefined που δημιουργούνται πόσα είναι;

Edit: Τώρα είδα τη 2η απάντηση σου. Από αυτό που λες καταλαβαίνω πως το response.d δεν είναι json αντικείμενο αλλά ένα απλό string.

Απ: jQuery Ajax με JSON από Dataset

koslyr — Sat, 07 Jan 2012 21:52:38 GMT

Βαζοντας ένα έλεγχο εντός του each, διαπιστωσα ότι το Category σε κάθε επανάληψη εμφανίζει στο alert ενα χαρακτήρα κάθε φορα από το παρακάτω αλφαριθμητικό:
"{"Table":[{"CategoryID":1,"CategoryName":"Beverages"},{"CategoryID":2,"CategoryName":"Condiments"}]}"
Δηλαδή παίνω στο output (από το alert) κάθε φορά μέσα στο loop:
1 loop: "{"
2 loop: "T"
3 loop: "a"
4 loop: "b"
.......

$.each(Categories, function (index, Category) {
                         if (typeof (Category.CategoryID) === 'undefined') {
                             alert("" + Category);
                         }
                         ddlCategory.append('<option value="' + Category.CategoryID + '">' + Category.CategoryName + '</option>');
                     });
                 },

Απ: jQuery Ajax με JSON από Dataset

koslyr — Sat, 07 Jan 2012 20:38:30 GMT

Μέσα από το firebug βάζοντας breakpoint στο Categories (var Categories=response.d) πάιρνω το ακόλουθο output:
"{"Table":[{"CategoryID":1,"CategoryName":"Beverages"},{"CategoryID":2,"CategoryName":"Condiments"}]}"

Μετά ακολουθώντας το παράδειγμα
http://www.ezzylearning.com/tutorial.aspx?tid=5869127&q=using-jquery-ajax-json-and-asp-net-web-services

κάνω το iteration για να πάρω τις αντιστοιχες τιμες από τα CategoryIG & CategoryName και να τα κανω append στο dropdown.

1
2
3
4
 var Categories = response.d;  
 $.each(Categories, function (index, Category) {  
           ddlCategory.append('<option value="' + Category.CategoryID + '">' + Category.CategoryName + '</option>');  
            });

Όμως αυτο που δεν μπορω να καταλάβω είναι γιατι μου βγαζει τα undefined.

Στο παραπάνω Json string εαν το αποκωδικοποιώ σωστά, περιλαμβάνει ένα object (Table) που έχει ένα array από άλλα object {}. Εκει φοβάμαι μήπως τελικά γίνεται το μπερδεμα, αλλά ακόμη δεν το έχω εντοπίσει.

Απ: jQuery Ajax με JSON από Dataset

George J. Capnias — Sat, 07 Jan 2012 15:40:53 GMT

Αφού ο γεμίζεις το dropdownlist σου με undefined, σημαίνει ότι ο Category object που παιρνάει το .each δεν είναι αυτό που φαντάζεσαι - το καλύτερο που έχεις να κάνεις είναι να βάλεις ένα debugger statement πριν από το ddlCategory.append() και να δεις το αντικείμενο που έχεις σε εκείνο το σημείο, και να κάνεις διορθώσεις αντίστοιχα - είτε μέσα στο loop αν δεν έχεις τα ονόματα των ιδιοτήτων σωστά, είτε έξω από το loop αν δεν παίρνεις το σωστό αντικείμενο στο Categories.

Καταλαβαίνω τη χρησιμότητα να έχεις μια ρουτίνα να έχεις ένα service που σου γυρνάει JSON, αλλά γιατί δεν το κάνεις με πιο native τρόπους και απλούς τρόπους - δεν είναι ανάγκη είτε να φτιάχνεις μόνος σου το JSON είναι να έχεις DataTable σαν τύπο σε αυτό που περνάς:

Αν παίζεις με DataSet, τα Datatables σου είναι strongtyped και δεν χρειάζεται το παραπάνω κολπάκι για να τα λάβεις σαν JSON - απλά το web service θα γυρίζει το Datatable με τον τύπο τους και ο μηχανισμός του web service θα κάνει τα υπόλοιπα για σένα.
Αν θέλεις να μείνεις με την δύναμη να παράγεις μόνος σου το JSON, θα ήταν καλύτερα να πήγαινες σε πιο ζόρικες λύσεις όπως το Json.NET που θα κάνει το conevertion γρήγορα και σωστά, και ελέγχεις πως θα μετατρέπονται οι null τιμές των ιδιοτήτων

George J.

jQuery Ajax με JSON από Dataset

koslyr — Sat, 07 Jan 2012 05:34:36 GMT

Χρησιμοποιησα το code snippet από http://schotime.net/blog/index.php/2008/07/27/dataset-datatable-to-json/ για να μετατρεψω ένα dataset σε Json format.
Πράγματι μέσω του firebug το Json που παίρνω από το αντίστοιχο WebService που καλώ είναι το:
{"Table":[{"CategoryID":1,"CategoryName":"Beverages"},{"CategoryID":2,"CategoryName":"Condiments"}]}

Ακολουθως χρησιμοποιώ το παρακάτω script για να γεμίσω το αντιστοιχο dropdownlist μεσω jQuery Ajax Call.

function GetAllCategories() {
             var ddlCategory = $('#DdlCategories');
             $.ajax({
                 type: "POST",
                 contentType: "application/json; charset=utf-8",
                 url: "WSProducts.asmx/GetAllGategories",
                 data: "{}",
                 dataType: "json",
                 success: function (response) {
                     var Categories = response.d;
                     $.each(Categories, function (index, Category) {
                         ddlCategory.append('<option value="' + Category.CategoryID + '">' +     
                                                       Category.CategoryName + '</option>');
                     });
                 },
                 error: function (msg) {
                     alert("Error");
                 }
             });`

Παρόλα αυτά στην εντολή στην γραμμή 11 κατι δεν του αρεσει με αποτέλεσμα να μην γεμιζει σωστά το dropdownlist, όπου συγκεκριμένα 'εχουν γινει append το αλφαριθμητικό "undefined".
Eχω δοκιμάσει αρκετες παραλλαγές στον παραπάνω κώδικα χωρίς επιτυχία.