jQuery Grid Plugin - jqGrid - Topic: Example for CouchDB and jqgrid with inline editing, some advice needed http://www.trirand.com/blog/?page_id=393/help/example-for-couchdb-and-jqgrid-with-inline-editing-some-advice-needed Simple:Press Version 5.7.5.3 catshout on Example for CouchDB and jqgrid with inline editing, some advice needed http://www.trirand.com/blog/?page_id=393/help/example-for-couchdb-and-jqgrid-with-inline-editing-some-advice-needed#p28482 Help http://www.trirand.com/blog/?page_id=393/help/example-for-couchdb-and-jqgrid-with-inline-editing-some-advice-needed#p28482 I'm currently looking for an example that allows inline editing on a CouchDB with jqgrid. The code below is working but it doesn't update the CouchDB data when pressed the 'S' button. I did some reseach but couldn't find anything helpful with regard to jqgrid and CouchDB.

Any hints are really appreciated.

Database documents:

http://localhost/couchdb/examp....._docs=true

{"total_rows":2,"offset":0,"rows":[
{"id":"43bce16e1dc49f9317b8921ff80013bf","key":"43bce16e1dc49f9317b8921ff80013bf","value":{"rev":"1-e95711a1b37a7b4dbf6d3661e9eec530"},"doc":{"_id":"43bce16e1dc49f9317b8921ff80013bf","_rev":"1-e95711a1b37a7b4dbf6d3661e9eec530","name":"Gerald","message":"Hello World!"}},
{"id":"43bce16e1dc49f9317b8921ff8001510","key":"43bce16e1dc49f9317b8921ff8001510","value":{"rev":"1-c7f45d42a23c4a93523dff9d2fc8ebfd"},"doc":{"_id":"43bce16e1dc49f9317b8921ff8001510","_rev":"1-c7f45d42a23c4a93523dff9d2fc8ebfd","name":"Sandra","message":"Hello World too!"}}
]}

HTML for testing purposes:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Demo</title>
</head>
<body>
<link rel="Stylesheet" type="text/css" href="css/smoothness/jquery-ui.custom.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/smoothness/ui.jqgrid.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery-ui.custom.min.js"></script>
<script type="text/javascript" src="js/grid.locale-en.js"></script>
<script type="text/javascript" src="js/jquery.jqGrid.min.js"></script>
<script>
$( document ).ready(function() {
    //setup the grid
    var lastsel;
    $("#myGrid").empty().jqGrid({
        datatype: 'json',
        ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
        ajaxRowOptions: { contentType: 'application/json; charset=utf-8', type: "PUT" },
        url:'/couchdb/example/_all_docs?&limit=100&include_docs=true',
        mtype: 'GET',
        colNames: ['', 'Id', 'Name', 'Message'],
        colModel: [{name:'act',index:'act', width:75,sortable:false},
                   { name: 'id', index: 'id', hidden: true, classes: 'id' },
                   { name: 'doc.name', index: 'name', width: 500, editable:true },
                   { name: 'doc.message', index: 'message', width: 200, editable:true }],
        pager: jQuery('#pager'),
        jsonReader: {
            repeatitems: false
        },
        width: 832,
        height: "100%",
        scrollOffset: 20,
        rowNum: 10,
        rowList: [10, 15, 20, 25],
        sortname: 'name',
        sortorder: "asc",
        viewrecords: true,
        hoverrows: false,
        caption: "",
        /*
        onSelectRow: function(id){
            if(id && id!==lastsel){
                jQuery('#myGrid').jqGrid('restoreRow',lastsel);
                jQuery('#myGrid').jqGrid('editRow',id,true); lastsel=id;
            }
        },
        */
        gridComplete: function(){
            var ids = jQuery("#myGrid").jqGrid('getDataIDs');
            for(var i=0;i < ids.length;i++){
                var cl = ids[i];
                be = "<input style='height:22px;width:20px;' type='button' value='E' onclick="jQuery('#myGrid').editRow('"+cl+"');" />";
                se = "<input style='height:22px;width:20px;' type='button' value='S' onclick="jQuery('#myGrid').jqGrid('saveRow', '"+cl+"', false, 'clientArray');" />";
                ce = "<input style='height:22px;width:20px;' type='button' value='C' onclick="jQuery('#myGrid').restoreRow('"+cl+"');" />";
                jQuery("#myGrid").jqGrid('setRowData',ids[i],{act:be+se+ce});
            }
        },
        editurl: '/couchdb/example',
        //beforeSelectRow: function (rowid, e) { return false; } //this disables row being highlighted when clicked
    });
});
</script>
<table id="myGrid"><tr><td/></tr></table>
<div id="pager"></div>
</body>
</html>
]]> Tue, 19 Mar 2013 17:52:53 +0200