2014-01-30 57 views
1

我想添加jqgrid,在我從下拉列表中選擇一個值後(例如狀態:打開,inProgress,關閉,重新啓動....) 但是如何綁定選擇列表,過濾器的jqGrid我又立刻陷入與邏輯如何實現它使用下拉列表值向jqgrid添加過濾器

<script type="text/javascript"> 
$('document').ready(function() { 
// 
    jQuery('#list').jqGrid({ 
     url: '../api/[email protected]', 
     datatype: 'json', 
     mtype: 'Get', 
     jsonReader: { repeatitems: false }, 
     colNames: ['UserName', 'TaskId', 'TaskName', 'TaskStatus'], 
     colModel: [ 
      { name: 'UserName', index: 'UserName', width: 75 }, 
      { name: 'TaskId', index: 'TaskId', width: 90 }, 
      { name: 'TaskName', index: 'TaskName', width: 100, formatter: showLink }, 
     { name:'TaskStatus',index:'TaskStatus',width:100} 
     ], 
     pager: jQuery('#pager'), 
     rowNum: 10, 
     rowList: [5, 10, 20, 50], 
     sortname: 'Id', 
     sortorder: "desc", 
     viewrecords: true, 
     imgpath: '/scripts/themes/coffee/images', 
     caption: 'My first grid' 
    }).navGrid('#pager', { edit: false, add: false, del: false }); 
}); 
function showLink(cellvalue, options, rowObject) { 
    return '<a href = "/User/EditTask?TaskId=' + rowObject.TaskId + '">' + rowObject.TaskName + '</a>'; 
} 

[C:\用戶\ shekhar.pankaj \桌面\ Capture.png

和我的控制器代碼是 。 .................................

public class JqGridTaskController : ApiController 
{ 
    public jsontext GetAllGridData(int UserId,string sidx, string sord, int page = 1,   int rows = 1) 
    { 
     var jsonType = new jsontext(); 
     using (var model = new TaskManagerEntities()) 
     { 

      jsonType.rows = (from dtUser in model.UserTasks 
          where dtUser.UserId==UserId 
//here i want to use my conditions that will get returned from dropdown 
          select new TaskUserGrid 
          { 
           UserName = dtUser.User.FirstName + dtUser.User.LastName, 
           TaskId=dtUser.Task.TaskId, 
           TaskName=dtUser.Task.Title, 
           TaskStatus=dtUser.Task.TaskStatu.StatusType 
          }).ToList(); 
      return jsonType; 
     } 
    } 
    /// <summary> 
    /// 
    /// </summary> 
    public class jsontext 
    { 
     public int total { get; set; } 
     public int page { get; set; } 
     public int records { get; set; } 
     public List<TaskUserGrid> rows { get; set; } 
    } 

回答

0

對不起Guyz如果u來到這裏..after很多研究......我能解決我的問題.. 你的人可能刪除這個問題,但對於我這樣的初學者..this將有助於(我認爲)

$('document').ready(function() { 
//this Will Call function on every selected values from Drop Down 
     $("#statusList").change(function() { 
      var selectedValue = $(this).val(); 
      $("#list").GridUnload(); 
      $("#list").trigger('reloadGrid'); 
      $.ajax(gridBind(selectedValue)) 
     }); 

    }); 

//this function will get called ..and here i will request data for The Grid 
    function gridBind(selectedValue) { 
     jQuery('#list').jqGrid({ 
      url: '../api/JqGridTask?UserId=' + @ViewBag.UserId +'&selectedValue=' + selectedValue, 
      datatype: 'json', 
      mtype: 'Get', 
      jsonReader: { repeatitems: false }, 
      colNames: ['UserName', 'TaskId', 'TaskName', 'TaskStatus'], 
      colModel: [ 
       { name: 'UserName', index: 'UserName', width: 75 }, 
       { name: 'TaskId', index: 'TaskId', width: 90 }, 
       { name: 'TaskName', index: 'TaskName', width: 100, formatter: showLink }, 
      { name: 'TaskStatus', index: 'TaskStatus', width: 100 } 
      ], 
      pager: jQuery('#pager'), 
      rowNum: 10, 
      rowList: [5, 10, 20, 50], 
      sortname: 'Id', 
      sortorder: "desc", 
      viewrecords: true, 
      imgpath: '/scripts/themes/coffee/images', 
      caption: 'My first grid' 
     }).navGrid('#pager', { edit: false, add: false, del: false }); 
    } 

    function showLink(cellvalue, options, rowObject) { 
     return '<a href = "/User/EditTask?TaskId=' + rowObject.TaskId + '">' + rowObject.TaskName + '</a>'; 
    } 

</script> 

任何方式人們感謝....感謝StackOverFlow ...