كيفية استخدام jqGrid مع C#/ASP.NET وJSON.NET (وليس عناصر AJAX.NET)؟

Question

حسنًا، لقد كنت أبحث في هذا الأمر منذ بضعة أيام ولست متأكدًا بشكل خاص من الخطأ الذي أفعله.إذا كان لدى أي شخص أمثلة عملية لاستخدام jqGrid مع C#/ASP.NET وأدوات مفتوحة المصدر، فيرجى إبلاغي بمكان العثور عليها.أي نصائح حول العثور على وثائق أو أدوات مناسبة يمكنني استخدامها لتصحيح هذا سيكون موضع تقدير كبير أيضًا (أنا جديد تمامًا على js/jQuery).في الأساس، أحتاج فقط إلى وظيفة التحرير الموضعي، لذا إذا كنت أتجاهل حلًا واضحًا آخر لذلك، فقد يكون من المفيد معرفة...أرغب في تجنب استخدام AJAX.NET إذا كان ذلك ممكنًا.

أشعر وكأنني أتجاهل شيئًا واضحًا حقًا هنا.

في المثال التالي، قمت بعرض jqGrid، لكنه لا يظهر أي بيانات.

إليك جافا سكريبت ذات الصلة:

jQuery(document).ready(function(){ 
    jQuery("#role_assignment_table").jqGrid({ 
        url:'http://localhost:4034/WebSite2/PageItemHandler.asmx/GetPageItemRolesJson?id=3',
        mtype: 'GET',
        contentType: "application/json; charset=utf-8",
        datatype: "jsonstring",
        colModel:[
            {name:'Id', label:'ID', jsonmap:'Id'},
            {name:'Title', jsonmap:'Title'},
            {name:'AssignedTo', label:'Assigned To', jsonmap:'AssignedTo'},
            {name:'Assigned', jsonmap:'Assigned'},
            {name:'Due', jsonmap:'Due'},
            {name:'Completed', jsonmap:'Completed'}
        ],
        jsonReader: {
            page: "Page",
            total: "Total",
            records: "Records",
            root: "Rows",
            repeatitems: false,
            id: "Id"
        },
        rowNum:10,
        rowList:[10,20,30],
        imgpath: 'js/themes/basic/images',
        viewrecords: false,
        caption: "Role Assignments" 
    });  
});

---

HTML:

<table id="role_assignment_table" class="scroll" cellpadding="0" cellspacing="0" />

---

JSON الذي تم إنشاؤه: لست متأكدًا مما إذا كان قد وصل إلى jqGrid، أو إذا كان jqGrid لا يحب JSON أو WebMethod الخاص بي، ولكن يمكنني الاتصال به بنفسي عندما أذهب إلى عنوان URL المناسب وأحصل على سلسلة نتائج JSON.

{"Page":"1","Total":1.0,"Records":"4",
"Rows":[
{"Id":1,"Item":null,"Title":"Story Manager","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":2,"Item":null,"Title":"Analysis","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":3,"Item":null,"Title":"Narrative","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"},
{"Id":4,"Item":null,"Title":"Graphic","AssignedTo":null,"Assigned":"\/Date(1245186733940-0500)\/","Due":"\/Date(1248383533940-0500)\/","Completed":"\/Date(1247087533940-0500)\/"}
]
}

هتافات ، وليام رايلي لاند

Answer 1

قبل القيام بأي شيء آخر، قم بتنزيل وتثبيت هذا:

http://www.fiddler2.com/fiddler2/

سيتيح لك رؤية ما يتم طلبه بالضبط وإرساله مرة أخرى بواسطة طلبات jqGrid للحصول على بيانات JSON.

لدي بعض التعليمات البرمجية لـ jqGrid العاملة، وإليك شيئًا مختلفًا:

datatype: "json"

بدلا من الخاص بك:

datatype: "jsonstring"

لدي أيضًا حقل يسمى colNames وهي عبارة عن مجموعة من السلاسل التي تحتوي على أسماء الأعمدة.

وأخيرا، لدي pager الحقل الذي يحدد العنصر الذي سيقوم بتخزين عناصر تحكم الترحيل، وهو DIV.

Answer 2

في ASP.NET، يتم إجراء تسلسل للتاريخ كـ JSON "/التاريخ(علامات التجزئة)/" والتي لا يمكن تفسيرها بواسطة jqGrid.الحلول الممكنة (بريد):

• كتابة منسق مخصص للشبكة
• تغيير البيانات التي نرسلها إلى الشبكة (عن طريق إرسال التاريخ المنسق كسلسلة)

من فضلك قل كيف قمت بتنفيذ عرض التاريخ مع jqGrid؟

شكرًا لك.

Answer 3

كن حذراً مع الخاصية الحساسة لحالة الأحرف نوع البيانات من المفترض أن تكون نوع البيانات بأحرف كبيرة ت.

Answer 4

كان لي بالضبط نفس المشكلة!الحل الذي توصلت إليه هو إنشاء منسق JavaScript مخصص:

$(this).jqGrid({  
   ...
   colModel: [
      {
      name: 'SomeDate', index: 'SomeDate', width: 100, formatter: ndateFormatter }
      }],
   ...
});


// Convert C# json Date.
function ndateFormatter(cellval, opts, rwdat, _act) {
    var time = cellval.replace(/\/Date\(([0-9]*)\)\//, '$1');
    var date = new Date();
    date.setTime(time);
    return date.toDateString();
}

Answer 5

إذا كانت لديك مشاكل في جعل jqGrid يعمل مع ASP.NET، فيرجى إلقاء نظرة هنا.هذا يجب أن يوفر لك الكثير من الوقت.