views:

313

answers:

2

I am using a JQGrid witha json service to list all the database users membership information, so the url of the grid points to my json service and method. Everything is working fine so far, I can add and edit the users and amend data and it saves fine. However the delete of a DB user is another story as the Membership.DeleteUser takes the username as its parameter. The JQGrid only seems to pass editable params back when in add or edit mode. But when you're trying to delete it doesn't seem to allow any params to be returned which I find very odd. I have only just started using JQGrids so I could just be being thick :-). Please can anyone tell me how to accomplish this? I have the username as a column in the JQGrid itself. I have tried various things to date:

url: 'misc/myservice.svc/AddEditDeleteGridRow?UserName=' + $('#MyGridTbl').getCell('selrow', 'UserName')

in the delete section of the navGrid. I have also tried setting the URL in the select row event too but I found it required a reload to insert it into the grid and when this happens the selected row is lost and so defeats the object. I just need to be able to access/get the username inside the json service in order to pass it to Membership.DeleteUser. I have been searching the internet and can't seem to find anything.

Here is the JQGrid I am using. There json service basically just has the GetData which returns JQGridJSONData (json object dataset) and AddEditDeleteGridRow methods in it, both are public. All the column data is being sent to the json service for the add and edit but nothing is being sent for the delete operation.

Just to clarify I need the UserName on the server side in the json service.

   $('#MyGrid').jqGrid({
    url: 'Misc/MyjsonService.svc/GetData',
    editurl: 'Misc/MyjsonService.svc/AddEditDeleteGridRow',
    datatype: 'json',
    colNames: ['UserId', 'UserName', 'Email Address', 'Password Last Changed', 'Locked'],
    colModel: [
                { name: 'UserId', index: 'UserId', hidden:true, editable: true, editrules:{edithidden: true}},
                { name: 'UserName', index: 'UserName', editable: true, width: 200, sortable: false, editrules: { required: true} },
                { name: 'Email Address', index: 'Email', editable: true, width: 500, sortable: false, editrules: { email: true, required: true} },
                { name: 'Password Last Changed', index: 'LastPasswordChangedDate', editable: false, width: 200, sortable: false, align: 'center' },
                { name: 'Locked', index: 'IsLockedOut', sortable: false, editable: true, edittype: "checkbox", formatter: 'checkbox', align: 'center' }
            ],
    rowNum: 20,
    hidegrid: false,
    rowList: [20, 40, 60],
    pager: $('#MyGridPager'),
    sortname: 'UserName',
    viewrecords: true,
    multiselect: false,
    sortorder: 'asc',
    height: '400',
    caption: 'Database Users',
    shrinkToFit: false,
    onPaging: function(pgButton) {
        this.DBUserId = null;
    },
    onSelectRow: function(Id) {
        if (Id && Id !== this.DBUserId) {
            this.DBUserSelect(Id);
        }
    },
    loadComplete: function() {
        if (this.DBUserId)
            this.DBUserSelect(this.DBUserId, true);
    },
    gridComplete: function() {
        var grid = $('#MyGrid');
        var body = $('#AvailableDBUsersArea');
        if ((grid) && (body)) {
            grid.setGridWidth(body.width() - 10);

            //keep the grid at 100% width of it's parent container
            body.bind('resize', function() {
                var grid = $('#MyGrid');
                var body = $('#AvailableDBUsersArea');
                if ((grid) && (body)) {
                    grid.setGridWidth(body.width() - 2);
                }
            });
        }
    }
}).navGrid('#MyGridPager',
        { add: true, edit: true, del: true, refresh: false, search: false }, //general options
        {
        //Options for the Edit Dialog
        editCaption: 'Edit User',
        height: 250,
        width: 520,
        modal: true,
        closeAfterEdit: true,
        beforeShowForm: function(frm) { $('#UserName').attr('readonly', 'readonly'); },
        beforeShowForm: function(frm) { $('#UserId').removeAttr('readonly'); },
        beforeShowForm: function(frm) { $('#UserId').attr('readonly', 'readonly'); }
    },
        {
            //Options for the Add Dialog
            addCaption: 'Add User',
            height: 250,
            width: 520,
            modal: true,
            closeAfterAdd: true,
            beforeShowForm: function(frm) { $('#UserName').removeAttr('readonly'); },
            beforeShowForm: function(frm) { $('#UserId').removeAttr('readonly'); },
            beforeShowForm: function(frm) { $('#UserId').attr('readonly', 'readonly'); }
        },
        {
            //Delete options
            width: 350,
            caption: 'Delete User',
            msg: 'Are you sure you want to delete this User?\nThis action is irreversable.'
        },
        {} //Search options
    );
A: 

There are some ways to add additional parameters to the Delete URL. It would be helpful to have the definition of the jqGrid, especially colModel.

If you have a hidden column for example use can use

hidden: true, editable: true, editrules: { edithidden: false }, hidedlg: true

parameters. Then the hidden column would be not seen in the edit dialog, but the value of the column will be send.

Another way can you choose if you need modify URL befor sending Delete request. You can define parameter of navGrid (see prmDel paremeter on http://www.trirand.com/jqgridwiki/doku.php?id=wiki:navigator#how_to_use) which can be like following

{ onclickSubmit: function(rp_ge, postdata) {
      rp_ge.url = 'misc/myservice.svc/AddEditDeleteGridRow?UserName=' +
                  $('#MyGridTbl').getCell (postdata, 'UserName');
  }
}
Oleg
A: 

I used the onclickSumbit way above and got the username as a request querystring in the json service but it always has a value of "false" rather than the users actual name. Any ideas? I used selrow instead of postdata too and that returns the same thing.

EnterpriseMonkey
Do you used "#MyGrid" or "#MyGridTbl" (wrong for your table id)? Do you try to debug `onclickSubmit` function or insert `alert(postdata)` and `alert($('#MyGrid').getCell (postdata, 'UserName'))`? Could you see correct data? Could you see in Firebug or Fiddler which data you really send to the server?
Oleg
Usage of 'selrow' string is wrong. `postdata` must be already set to the id of the selected row. The first parameter of `getCell` must be row id (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:methods).
Oleg