如何讓jQuery colorbox模塊在flexigrid中工作？

我使用flexigrid在CRM中顯示傳入的線索。在傳入的線索行中，我添加了「查看聯繫人」和「查看註釋」的鏈接。我試圖讓這些鏈接在單擊時在colorbox模塊中打開。他們目前在點擊時打開一個新窗口。如何讓jQuery colorbox模塊在flexigrid中工作？

HTML/Flexigrid代碼：

<div id="flex"></div> 

<script type="text/javascript"> 
$(document).ready(function(e){  
    $(".merchant_add_note").colorbox({width:"750px", overlayClose:false, height:"400px", transition:"none"}); 
    $(".merchant_add_contact").colorbox({width:"750px", overlayClose:false, height:"400px", transition:"none"}); 
    $(".merchant_view_notes").colorbox({width:"750px", overlayClose:false, height:"400px", transition:"none"}); 
    $(".merchant_view_contacts").colorbox({width:"750px", overlayClose:false, height:"400px", transition:"none"}); 

    $("#flex").flexigrid({ 
     url: '/rep/get_leads', 
     dataType: 'json', 
     method: 'GET', 
     colModel : [ 
      {display: 'Merchant', name : 'merchant_name', width : 220, sortable : true, align: 'left'}, 
      {display: 'Date Added', name : 'merchant_created', width : 150, sortable : true, align: 'left'}, 
      {display: 'Last Contacted', name : 'merchant_last_contacted', width : 150, sortable : false, align: 'left'}, 
      {display: 'Contact', name : 'merchant_contacts', width : 180, sortable : false, align: 'left'}, 
      {display: 'Notes', name : 'merchant_notes', width : 160, sortable : false, align: 'left'} 
      ],  
     sortname: "merchant_name", 
     sortorder: "asc", 
     usepager: false, 
     useRp: false, 
     rp: 50, 
     width: 950, 
     height: 500 
    }); 

}); 
</script>

/REP/get_leads JSON數組：

function get_leads(){ 
    $args = array(
     'id' => $this->session->userdata('rep_id'), 
     'sort' => $_REQUEST['sortname'], 
     'sortorder' => $_REQUEST['sortorder'] 
    ); 
    $leads = $this->reps->leads($args); 

    foreach($leads as $lead){ 
     $row['id'] = $lead['merchant_id']; 
     $row['cell'] = array(
      'merchant_name' => '<a href="/rep/merchant/'.$lead['merchant_id'].'">'.$lead['merchant_name'].'</a>', 
      'merchant_created' => $lead['merchant_created'], 
      'merchant_last_contacted' => $lead['merchant_last_contacted'], 
      'merchant_contacts' => '<a href="/rep/merchant_contacts/'.$lead['merchant_id'].'" class="small_blue merchant_view_contacts">View</a> - <a href="/rep/merchant_add_contact/'.$lead['merchant_id'].'" class="small_blue merchant_add_contact">Add</a>', 
      'merchant_notes' => '<a href="/rep/merchant_notes/'.$lead['merchant_id'].'" class="small_blue merchant_view_notes">View</a> - <a href="/rep/merchant_add_note/'.$lead['merchant_id'].'" class="small_blue merchant_add_note">Add</a>' 
     ); 
     $array[] = $row; 
    } 
    $data['rows'] = $array; 
    print json_encode($data); 
}

來源

2011-10-04 mike

我計算出來。我需要使用onSuccess：

<script type="text/javascript"> 
$(document).ready(function(e){  
    $("#flex").flexigrid({ 
     url: '/rep/get_leads', 
     dataType: 'json', 
     method: 'GET', 
     colModel : [ 
      {display: 'Merchant', name : 'merchant_name', width : 370, sortable : true, align: 'left'}, 
      {display: 'Date Added', name : 'merchant_created', width : 150, sortable : true, align: 'left'}, 
      {display: 'Last Contacted', name : 'merchant_last_contacted', width : 150, sortable : true, align: 'left'}, 
      {display: 'Contacts', name : 'merchant_contacts', width : 100, sortable : false, align: 'left'}, 
      {display: 'Notes', name : 'merchant_notes', width : 100, sortable : false, align: 'left'} 
      ], 
     searchitems : [ 
      {display: 'Merchant', name : 'merchant_name', isdefault: true} 
      ], 
     sortname: "merchant_name", 
     sortorder: "asc", 
     usepager: true, 
     useRp: false, 
     title: 'Your Leads', 
     rp: 500, 
     width: 950, 
     height: 650, 
     onSuccess: function() { 
      $(".merchant_add_note").colorbox({width:"750px", overlayClose:false, height:"400px", transition:"none"}); 
      $(".merchant_add_contact").colorbox({width:"750px", overlayClose:false, height:"400px", transition:"none"}); 
      $(".merchant_view_notes").colorbox({width:"750px", overlayClose:false, height:"400px", transition:"none"}); 
      $(".merchant_view_contacts").colorbox({width:"750px", overlayClose:false, height:"400px", transition:"none"}); 
     } 
    }); 
}); 
</script>

來源

2011-10-04 19:01:54 mike

如何讓jQuery colorbox模塊在flexigrid中工作？

回答

相關問題