jqgrid перенаправить на другую страницу при нажатии строки

Question

Я пытаюсь использовать список 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>

Answer 1

Чтобы заставить его работать, мне нужно было добавить идентификатор к элементу de:

id='"+cl+"_buttonEditTest' 

Мне также нужно было изменить Actions на act, чтобы элементы управления отображались в каждой строке:

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

Кроме того, вы, вероятно, хотите добавить идентификатор строки к вашей ссылке:

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}) ;