0

目的是在一行中编辑文本区域并单击另一行后，应保存第一个并恢复该行。该代码在保存记录之前有效，但在保存后不能恢复编辑的行。请帮我纠正这个问题。

 <? 
if(isset($_GET)){
    $startDate = $_GET['start_date'];
    $endDate   = $_GET['end_date'];
    $type      = $_GET['type'];
}
?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" media="screen" href="../js/jqgrid/css/ui-lightness/jquery-ui-1.9.2.custom.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="../js/jqgrid/css/ui.jqgrid.css" />
    <link rel="stylesheet" type="text/css" href="../js/powertip/jquery.powertip.css" />

    <script type="text/javascript" src="../js/jqgrid/js/jquery1.8.3.js"></script>
    <script type="text/javascript" src="../js/jqgrid/js/i18n/grid.locale-en.js"></script>
    <script type="text/javascript" src="../js/powertip/jquery.powertip-1.1.0.min.js"></script>
    <script type="text/javascript">
        jQuery.jgrid.no_legacy_api = true;
    </script>
    <script src="../js/jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>
    <style>
        .ratingDetails{
            font-family:Arial;font-size:12px;color:#FFF;padding-left:2px;
        }
    </style>
</head>
<body>
    <table id="rowed2"></table>
    <div id="prowed2"></div>
    <script>
        jQuery(document).ready(function(){ 
            var lastSel;
            jQuery("#rowed2").jqGrid({ 
                url:'feedbacks_bookings_rated_pagination.php?start_date=<?=$startDate?>&end_date=<?=$endDate?>&type=<?=$type?>',

                datatype: "json",
                height:"auto",
                colNames:['Booking<br>Id','City','Customer name','Trip dates','Local Office','Rating','Action Taken','Status','Action'],

                colModel:[
                    {name:'booking_id',index:'booking_id', width:45,align:"center",hidden:false,key: true},// key: true - to get the id value in POST
                    {name:'pick_city',index:'pick_city', width:90,align:"left"},
                    {name:'actual_name',index:'add_driver_number', width:130,align:"left",sortable:true},
                    {name:'tripdates',index:'tripdates', width:80,align:"center",sortable:false},
                    {name:'office_name',index:'office_name', width:150,align:"left",sortable:true},     
                    {name:'rating_status',index:'rating_status', width:70,align:"center",sortable:true,title: false},
                    {name:'action_taken',index:'action_taken', width:220,align:"left",sortable:false,editable:true,edittype:'textarea',editoptions:{rows:"3",cols:"35"}},
                    {name:'img_action_status',index:'img_action_status', width:40,align:"center",sortable:true},    
                    {name:'act',index:'act',width:100,align:'center',sortable:false}        
                ],
                rowNum:15, 
                rowList:[15,25,50], 
                pager: '#prowed2', 
                sortname: 'driver_name', 
                viewrecords: true, 
                sortorder: "asc", 
                subGrid : true, 
                subGridUrl: 'feedbacks_bookings_rated_pagination.php?booking=424519', 
                subGridModel: [{
                        name:['Booked on','Trip Type/ Amount','Driver Details','Local Office Phone','Essential Feedbacks','Other Feedbacks'],
                        width: [90,90,130,100,160,200]}
                ],

                onSelectRow: 
                    function(id){ 
                        //alert(lastSel+"-hi-"+id);
                        if(id && id!==lastSel){ 
                            if (typeof lastSel !== "undefined") {
                                jQuery("#rowed2").jqGrid('saveRow',lastSel);
                                jQuery("#rowed2").jqGrid('restoreRow',lastSel);
                                //jQuery("#rowed2").trigger("reloadGrid"); 
                            }
                            lastSel = id;
                         } 
                        jQuery(this).jqGrid('resetSelection'); 
                        jQuery(this).editRow(id, true); 
                    },      
                editurl: "feedbacks_bookings_rated_pagination.php", 
                caption:"Edit Feedback Details",
            }); 

            // icons in pagination frame bottom
            jQuery("#rowed2").jqGrid('navGrid','#prowed2',{ add: false, edit: true,save: true, del: false, reload: true});


            jQuery.fn.editRow = function(param) {
                var rowid      = param;
                var booking_id = jQuery("#rowed2").jqGrid ('getCell', param, 'booking_id');

                jQuery("#rowed2").jqGrid('editRow',rowid, { 
                        keys : true, 
                        oneditfunc: function() {
                        }
                    });
            };

            jQuery.fn.saveRow = function(param) {
                var rowid = param;
                jQuery("#rowed2").jqGrid('saveRow',rowid, { 
                        successfunc: function(response) {
                                        //obj = eval('(' + response.responseText + ')');
                                        //$.jgrid.info_dialog('Status','<div class="ui-state-successr"><br>'+obj.responseText +'<br></div>', $.jgrid.edit.bClose,{buttonalign:'center'}); 
                                        return true; 
                                      },
                        url : "feedbacks_bookings_rated_pagination.php",
                        mtype : "POST",
                    });
            };

            jQuery.fn.restoreRow = function(param) {
                var rowid = param;
                alert("rstore-"+rowid);
                jQuery("#rowed2").jqGrid('restoreRow',rowid, { 
                    afterrestorefunc : function( response ) {
                        alert("aaaa");
                        obj = eval('(' + response.responseText + ')');
                        $.jgrid.info_dialog('Status','<div class="ui-state-successr"><br>'+obj.responseText +'<br></div>', $.jgrid.edit.bClose,{buttonalign:'center'}); 
                        return true; 
                    }
                });
            };

        })

            function closeAction(bkId){
                if(confirm("Are you sure to close the action?")){
                    //Ok button pressed...
                    $.post('feedbacks_bookings_rated_pagination.php?action=close',{booking_id: bkId},
                        function(response){
                            alert(response.responseText); 
                            $("#rowed2").trigger("reloadGrid"); 
                            return true;
                        },
                        "json"
                    );
                }
            }
            // Function to display rating crieteria values as a tooltip on mouseover of Rating caption
            function showRatingDetailsToolTip(id) {
                $('#rating'+id).data('powertiptarget', 'tooltip'+id);
                $('#rating'+id).powerTip({placement: 'e',smartPlacement: true,mouseOnToPopup: true});

            }


    </script>

</body>
</html>

再一次..在下面给出了一个更正的代码..这里也是，上一行在单击下一行时没有从编辑模式返回。你能告诉我问题吗？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" type="text/css" media="screen" href="../js/jqgrid/css/ui-lightness/jquery-ui-1.9.2.custom.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="../js/jqgrid/css/ui.jqgrid.css" />

    <script type="text/javascript" src="../js/jqgrid/js/jquery1.8.3.js"></script>
    <script type="text/javascript" src="../js/jqgrid/js/i18n/grid.locale-en.js"></script>
    <script type="text/javascript">
        jQuery.jgrid.no_legacy_api = true;
    </script>
    <script src="../js/jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>

</head>
<body>
    <table id="rowed2"></table>
    <div id="prowed2"></div>
    <script>
        jQuery(document).ready(function(){ 
            var lastSel;
            jQuery("#rowed2").jqGrid({ 
                url:'feedbacks_bookings_rated_pagination.php?start_date=<?=$startDate?>&end_date=<?=$endDate?>&type=<?=$type?>', 
                datatype: "json",
                height:"auto",
                colNames:['Booking<br>Id','City','Customer name','Trip dates','Local Office','Rating','Action Taken','Status','Action'],
                colModel:[
                    {name:'booking_id',index:'booking_id', width:45,align:"center",hidden:false,key: true},// key: true - to get the id value in POST
                    {name:'pick_city',index:'pick_city', width:90,align:"left"},
                    {name:'actual_name',index:'add_driver_number', width:130,align:"left",sortable:true,editable:true,edittype:'text'},
                    {name:'tripdates',index:'tripdates', width:80,align:"center",sortable:false},
                    {name:'office_name',index:'office_name', width:150,align:"left",sortable:true},     
                    {name:'rating_status',index:'rating_status', width:70,align:"center",sortable:true,title: false},
                    {name:'action_taken',index:'action_taken', width:220,align:"left",sortable:false,editable:true,edittype:'textarea',editoptions:{rows:"3",cols:"35"}},
                    {name:'img_action_status',index:'img_action_status', width:40,align:"center",sortable:true},    
                    {name:'act',index:'act',width:100,align:'center',sortable:false}        
                ],
                rowNum:15, 
                rowList:[15,25,50], 
                pager: '#prowed2', 
                sortname: 'booking_id', 
                viewrecords: true, 
                sortorder: "asc", 

                onSelectRow: 
                    function(id){ 
                        if(id && id!==lastSel){ 
                            if (typeof lastSel !== "undefined") {
                                jQuery("#rowed2").jqGrid('saveRow',lastSel,{url : "feedbacks_bookings_rated_pagination.php",mtype : "POST"});
                                jQuery(this).jqGrid('editRow',lastSel, false);
                            }
                            lastSel = id;
                         } 
                        jQuery(this).jqGrid('editRow',id, true);
                    }, 

                editurl: "feedbacks_bookings_rated_pagination.php", 
                caption:"Edit Feedback Details",
            }); 

            // icons in pagination frame bottom
            jQuery("#rowed2").jqGrid('navGrid','#prowed2',{ add: false, edit: false,save: false, del: false, reload: true});
        })
    </script>
</body>
</html>

======================

我终于找到了真正的问题。

它不是“action_taken”字段的内容，而是前一个字段。我在实际内容下的隐藏 DIV 中放置了一个表格，用于工具提示内容。

发生的情况是，在编辑下一列中的 action_taken 字段并收到服务器响应后，将“action_taken”字段的编辑内容设置为上一列中该表的第一个 TD 的内容和标题。此外，已编辑的列不会从编辑模式返回。如果我从上一列中删除表格，一切正常。我尝试为表格使用不同的 id/style 类，但没有改变。可能是什么问题呢？上一列中导致问题的表结构如下所示。

<table id='ratingdata32380' width='189' border='0' cellpadding='0' cellspacing='0' bordercolor='#000000' bgcolor='#4f9de2'>
<tr><td align='left' valign='middle' class='ratingDetails'>Was On Time?</td><td align='center' valign='middle' class='ratingDetails'>aaaa</td></tr>
</table>

“ratingDetails”类只是字体定义。.ratingDetails{font-family:Arial;font-size:12px;color:#FFF;padding-left:2px;}

任何想法 ？

4

1 回答 1

2

您应该决定哪种行为应该有您的网格。您想保存先前编辑行中的数据，那么您应该调用saveRow. 如果您想放弃当前的更改并恢复之前的更改，您应该调用restoreRow. 像你目前在回调内部那样调用restoreRow after 是没有意义的。saveRowonSelectRow

因此，如果我正确理解您想要实现的内容，您应该saveRow在调用restoreRow.

于 2013-02-07T11:53:03.687 回答