单击行时,jqgrid重定向到另一个页面

时间:2010-02-24 22:20:43

标签: jquery jqgrid

我正在尝试将jqgrid列表用于特定项目。我阅读了发布的在线文档但我找不到解决问题的方法。我没有列出和查看项目的问题。但是我需要在每一行中按一个按钮,当点击该按钮时,浏览器应该被重定向到另一个页面(可以编辑该行。例如:?Section = news& Process = EditNews& NEWSID = 1)。

我认为我接近解决方案但仍坚持这一点......

    <script type="text/javascript">

    var lastsel;

$(function() {

    $("#list").jqGrid({
            url: '/FLPM/cp/news.cs.asp?Process=ViewNews',
            datatype: 'xml',
            mtype: 'Get',
            height: '100%',
            colNames: ['Actions','ID #','Page', 'Category Name', 'Active', 'Date Entered'],
            colModel: [
                {name:'Actions', index:'Actions', width:100, sortable:false, search:false},
                {name:'ID', index:'ID', width:30},
                {name:'Title', index:'Title', width:360},
                {name:'Category', index:'Category', width:115},
                {name:'Active', index:'Active', width:40, editable:true, edittype:"select", editoptions:{value:"1:Yes;0:No"}},
                {name:'Date', index:'Date', width:126}, 
            ],
            pager: jQuery('#pager'),
            rowNum: 10,
            rowList: [10,20,30],
            sortname: 'Date', 
            sortorder: 'desc',
            viewrecords: true,
            imgpath: 'js/jqGrid/themes/basic/images',
            onSelectRow: function(id) { 
                if(id && id!==lastsel) {
                    $('#list').restoreRow(lastsel); 
                    $('#list').editRow(id,true); 
                    lastsel=id; 
                    } 
                }, 
            loadComplete: function(){ 
                var ids = jQuery("#list").getDataIDs(); 
                for(var i=0;i<ids.length;i++){ 
                    var cl = ids[i]; 
                    de = "<input style='height:25px;width:25px;' type='button' value='DE' onclick=location.href='?Section=news&Process=EditNews&NEWSID='; />";              
                    be = "<input style='height:25px;width:25px;' type='button' value='E' onclick=jQuery('#list').editRow("+cl+"); ></ids>"; 
                    se = "<input style='height:25px;width:25px;' type='button' value='S' onclick=jQuery('#list').saveRow("+cl+"); />"; 
                    ce = "<input style='height:25px;width:25px;' type='button' value='C' onclick=jQuery('#list').restoreRow("+cl+"); />"; 
                    jQuery("#list").setRowData(ids[i],{Actions:de+be+se+ce}) 
                } 
            }, 
            editurl: "custompages.cs.asp?Process=EditPage",             
    }).navGrid("#pager",{edit:true,add:false,del:true});    

});
    </script>

1 个答案:

答案 0 :(得分:1)

要使其正常工作,我需要在de元素中添加ID:

id='"+cl+"_buttonEditTest' 

我还需要将Actions更改为act,以便让控件实际显示在每一行中:

jQuery("#list").setRowData(ids[i],{act:de+be+se+ce}) 

此外,您可能希望将行的ID附加到您的链接:

onclick=location.href='?Section=news&Process=EditNews&NEWSID="+cl+"';

所以最终的代码是:

de = "<input style='height:25px;width:25px;' type='button' value='DE' onclick=location.href='?Section=news&Process=EditNews&NEWSID="+cl+"'; id='"+cl+"_buttonEditTest' />";              
be = "<input style='height:25px;width:25px;' type='button' value='E' onclick=jQuery('#list').editRow("+cl+"); ></ids>"; 
se = "<input style='height:25px;width:25px;' type='button' value='S' onclick=jQuery('#list').saveRow("+cl+"); />"; 
ce = "<input style='height:25px;width:25px;' type='button' value='C' onclick=jQuery('#list').restoreRow("+cl+"); />"; 
jQuery("#list").setRowData(ids[i],{act:de+be+se+ce}) ;