سؤال

لدي مثال أساسي على عمل jqgrid في ASP.NET MVC، ويبدو جافا سكريبت كما يلي:

    $(document).ready(function() {

        $("#list").jqGrid({
            url: '../../Home/Example',
            datatype: 'json',
            myType: 'GET',
            colNames: ['Id', 'Action', 'Parameters'],
            colModel: [
                   { name: 'id', index: 'id', width: 55, resizable: true },
                   { name: 'action', index: 'action', width: 90, resizable: true },
                   { name: 'paramters', index: 'parameters', width: 120, resizable: true}],
            pager: $('#pager'),
            rowNum: 10,
            rowList: [10, 20, 30],
            sortname: 'id',
            sortorder: 'desc',
            viewrecords: true,
            multikey: "ctrlKey",
            imgpath: '../../themes/basic/images',
            caption: 'Messages'
        });

أحاول الآن تنفيذ زر البحث الموجود في ملف أمثلة جكغريد (انقر فوق معالجة/بيانات الشبكة).لكنني لا أرى كيف ينفذونها.أتوقع على سبيل المثال."البحث: صحيح" وطريقة تنفيذه.

هل قام أي شخص بتنفيذ البحث على jqgrid أو يعرف أمثلة توضح بوضوح كيفية القيام بذلك؟

هل كانت مفيدة؟

المحلول

وأنا في الآونة الأخيرة تنفيذ هذا بنفسي (أمس في الواقع) للمرة الأولى. أكبر عقبة بالنسبة لي هو معرفة كيفية كتابة وظيفة التحكم. التوقيع وظيفة هو ما أخذني أطول لمعرفة (لاحظ _search، المعلمات searchField، searchOper، وsearchString مثل تلك مفقودة من معظم الأمثلة MVC ASP.NET رأيت). وظائف جافا سكريبت إلى وحدة تحكم لكلا الحمل الأولي وللدعوة البحث. سترى في التعليمات البرمجية التي أنا التحقق ما إذا كان المعلمة _search صحيحة أم لا.

وفيما يلي وحدة تحكم وشفرة جافا سكريبت. اعتذاري عن أي قضايا التنسيق لأن هذا هو المرة الأولى التي نشرها على هنا.

public ActionResult GetAppGroups(string sidx, string sord, int page, int rows, bool _search, string searchField, string searchOper, string searchString)
{
    List<AppGroup> groups = service.GetAppGroups();
    List<AppGroup> results;
    if (_search)
       results = groups.Where(x => x.Name.Contains(searchString)).ToList();
    else
       results = groups.Skip(page * rows).Take(rows).ToList();

    int i = 1;

    var jsonData = new
    {
        total = groups.Count / 20,
        page = page,
        records = groups.Count,
        rows = (
            from appgroup in results
            select new
            {
                i = i++,
                cell = new string[] {
                         appgroup.Name,
                         appgroup.Description
                     }
            }).ToArray()
    };

    return Json(jsonData);
}

وهنا هي لغتي HTML / جافا سكريبت:

$(document).ready(function() {
  $("#listGroups").jqGrid({
    url: '<%= ResolveUrl("~/JSON/GetAppGroups/") %>',
    datatype: 'json',
    mtype: 'GET',
    caption: 'App Groups',
    colNames: ['Name', 'Description'],
    colModel: [
        { name: 'Name', index: 'Name', width: 250, resizable: true, editable: false},
        { name: 'Description', index: 'Description', width: 650, resizable: true, editable: false},
    ],
    loadtext: 'Loading Unix App Groups...',
    multiselect: true,
    pager: $("#pager"),
    rowNum: 10,
    rowList: [5,10,20,50],
    sortname: 'ID',
    sortorder: 'desc',
    viewrecords: true,
    imgpath: '../scripts/jqgrid/themes/basic/images'
//});
}).navGrid('#pager', {search:true, edit: false, add:false, del:false, searchtext:"Search"});

نصائح أخرى

راجع مقالتي عن codeproject، والتي تشرح كيف يمكننا إجراء بحث متعدد في jqgrid:

استخدام شريط أدوات البحث الخاص بـ jqGrid مع عوامل تصفية متعددة في ASP.NET MVC

أستخدم IModelBinder لربط إعدادات الشبكة وأشجار التعبير لفرز البيانات وتصفيتها.

في حال كنت لا يزال يتساءل حول التعامل مع المعلمات الاختيارية، فقط يعلن لهم كما nullables بإضافة ? بعد اسم النوع.

والآن عليك أن تكون قادرا على مقارنتها مع null للتحقق مما إذا كانت غائبة.

لاحظ أنك لا تحتاج للقيام بذلك مع سلاسل، لأنها قيم الفارغة بالفعل.

وAlan - حسنا، أنا استخدم طريقتك ومددت لي خدمة ويب توقع هؤلاء الثلاثة معلمات إضافية وتحقق ل "_search" هو صح / خطأ. ولكن، من أجل جعل هذا العمل، كان لي أن أضيف هذا إلى دعوتي اياكس في جافا سكريبت:

if (!postdata._search) {    
           jQuery("#mygrid").appendPostData( {searchField:'', searchOper:'', searchString:''});  
}

هذا الرابط . وأوضحت أن لديها كافة تطبيقات ...

ويمكنك إنشاء زر searchBtn ويمكن استدعاء نموذج بحث على فوق

$("#searchBtn").click(function(){
   jQuery("#list4").searchGrid(
   {options}
    )});
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top