0

my code....

public string ConstructButtonEvents(string buttonid, string gridID, string GridControlId, string ActionUrl)
    {
        StringBuilder sbButtonEvents = new StringBuilder();
        GridControlId = GridControlId.Trim();
        sbButtonEvents.Append(" $('#" + buttonid + "').die().live('click', function () { ");
        sbButtonEvents.Append("var SelectedArtifactDetails = new Array();");
        sbButtonEvents.Append(" var CurrentArtifactDetails = new Array();");
        sbButtonEvents.Append("for (var i = 0; i < $('#" + gridID + " tbody tr').length; i++) {");
        sbButtonEvents.Append(" var rowId = jQuery('#" + gridID + " tr:eq(' + i + ')').attr('id');");
        sbButtonEvents.Append("var row = $('#" + gridID + "').jqGrid('getRowData', rowId);");

        sbButtonEvents.Append(" if (($('#Status" + GridControlId + "'+rowId).attr('checked') == 'checked') && ($('#Status" + GridControlId + "'+rowId).attr('disabled') != 'disabled')) {");

        sbButtonEvents.Append("CurrentArtifactDetails = {");
        sbButtonEvents.Append(" Complete: 'Y',");
        sbButtonEvents.Append("StakeHolderEmail: $('#Stakeholder" + GridControlId + "'+rowId).attr('value'),");
        sbButtonEvents.Append("UploadFile: $('#uploadFile" + GridControlId + "'+rowId).attr('value'),");
        sbButtonEvents.Append("PhaseArtifactId: $(row).attr('ID'),");

        sbButtonEvents.Append("Status: $('#list" + GridControlId + "'+rowId+'  option:selected').text()");
        sbButtonEvents.Append("};");

        sbButtonEvents.Append("SelectedArtifactDetails.push(CurrentArtifactDetails);");
        sbButtonEvents.Append("}");
        sbButtonEvents.Append("}");

        sbButtonEvents.Append(" $.ajax({");
        sbButtonEvents.Append(" url: '" + ActionUrl + "',");
        sbButtonEvents.Append(" async: false,");
        sbButtonEvents.Append(" loadonce:false, type: 'POST', dataType: 'json', data: JSON.stringify(SelectedArtifactDetails), contentType: 'application/json; charset=utf-8',");
        sbButtonEvents.Append(" success: function () {");
        //sbButtonEvents.Append(" $('#" + gridID + "').jqGrid('GridUnload');");
        sbButtonEvents.Append(" $('#" + gridID + "').trigger('reloadGrid');");            
        sbButtonEvents.Append(" }, error: function () { alert('error'); }");
        sbButtonEvents.Append("});");
        sbButtonEvents.Append("});");

        return sbButtonEvents.ToString();
    }

i have mutliple tabs yet the grid id generation is perfect. I'm constructing the grid in the .cs itself. i need to update the data in the rows to the DB. so, i have an update button... on click of it i post (ajax) the data. The data is getting updated pretty much well. But the grid is not getting reloaded.

on click of update button i fetch the values and then the below ajax post is called

$.ajax({ url: '/SDLCMClassic/EditProject/BatchUpdate',
    type: 'POST',
    dataType: 'json',
    data: JSON.stringify(SelectedArtifactDetails),
    contentType: 'application/json; charset=utf-8',
    success: function () {
        $('#tblArtifact1').trigger('reloadGrid');
    }, error: function () { alert('error'); }
});

});

I'm able to fetch the row values in the grid and i'm able to post it successfully. It is getting updated in DB as well. But immediate reload is not happening. if i refresh the whole page then only i'm able to see the updated data.

Here is the code to construct jqgrid in js

$(function () {
    $('#tblArtifact1').jqGrid({
        url: '/SDLCMClassic/EditProject/FillArtifactGrid?ppmno=188035&phaseName=Project Startup',
        datatype: 'json',
        mtype: 'GET',
        colNames: ['Artifact', 'Complete', 'Status', 'Stakeholder', 'App Reference', 'Document', 'URL', 'ID'],
        colModel: [
        { name: 'Name', index: 'Name', editable: false, edittype: '', align: 'left', key: false, hidden: false, formatter: 'showlink', formatoptions: { target: '_blank', baseLinkUrl: '' }, width: $(window).width() * .1, sortable: false },
        { name: 'Complete', index: 'Complete', editable: false, edittype: '', align: 'center', key: false, hidden: false, formatter: '', formatoptions: { target: '', baseLinkUrl: '' }, width: $(window).width() * .06, sortable: false },
        { name: 'Status', index: 'Status', editable: false, edittype: '', align: 'center', key: false, hidden: false, formatter: '', formatoptions: { target: '', baseLinkUrl: '' }, width: $(window).width() * .10, sortable: false },
        { name: 'StakeHolderEmail', index: 'StakeHolderEmail', editable: false, edittype: '', align: 'center', key: false, hidden: false, formatter: '', formatoptions: { target: '', baseLinkUrl: '' }, width: $(window).width() * .15, sortable: false },
        { name: 'App Reference', index: 'App Reference', editable: false, edittype: '', align: 'center', key: false, hidden: false, formatter: '', formatoptions: { target: '', baseLinkUrl: '' }, width: $(window).width() * .15, sortable: false },
        { name: 'Document', index: 'Document', editable: false, edittype: '', align: 'center', key: false, hidden: false, formatter: '', formatoptions: { target: '', baseLinkUrl: '' }, width: $(window).width() * .18, sortable: false },
        { name: 'URL', index: 'URL', editable: false, edittype: '', align: 'center', key: false, hidden: false, formatter: '', formatoptions: { target: '', baseLinkUrl: '' }, width: $(window).width() * .15, sortable: false },
        { name: 'ID', index: 'ID', editable: false, edittype: '', align: 'center', key: false, hidden: true, formatter: '', formatoptions: { target: '', baseLinkUrl: '' }, width: $(window).width() * .01, sortable: false }
         ],
        viewrecords: true,
        sortname: 'Complete',
        sortorder: 'asc',
        width: 'auto',
        height: 'auto',
        subGrid: true,
        subGridRowExpanded: function (subgrid_id, row_id) {
            $('#' + subgrid_id).html(renderhtmlforSubgrid(this, subgrid_id, row_id));
        },
        gridComplete: function () {
            var dataIds = $('#tblArtifact1').jqGrid('getDataIDs');
            for (var i = 0; i < dataIds.length; i++) {
                $('#tblArtifact1').editRow(dataIds[i], false);
            }
        },
        loadComplete: function () {
            ModifyGridDefaultStyles('tblArtifact1');
        }
    });
});
suman
  • 333
  • 1
  • 10
  • 24
  • Dude why are you creating the event in CS all of this JavaScript could just be client side script. – Richard Forrest Jun 06 '12 at 10:41
  • i have created it for re-usable purpose. However, everything works fine. except $('#" + gridID + "').trigger('reloadGrid'); – suman Jun 06 '12 at 10:43
  • It's difficult to read JavaScript code which will be created inside of `StringBuilder`. Could you better post pure JavaScript code? You can just open the source of the page get the code and format it a little to be better read. Moreover I don't understand why you could need ever generate such strange code. Is it not easier to save the code in some JavaScript file which you includes on the page and use something like `return String.Format("myGlobalFunc({0},{1},{2},{3});", buttonid, gridID, GridControlId.Trim(), ActionUrl);` as one-line code of the function? – Oleg Jun 06 '12 at 10:45
  • Thanks Oleg. give me some time i will post it. I'm not able to post the code. some formatting issue... – suman Jun 06 '12 at 11:40

1 Answers1

2

You don't posted the most important part of the code: the code which defines jqGrid. So I have to guess.

Typical problem with not reloading of grid per .trigger('reloadGrid'); is because you use loadonce: true option in the jqGrid. It changes datatype from the initial "json" or "xml" value to datatype: "local". So reloading do work, but reload the local data. If you need to reload the data from the server you have to reset datatype to initial value "json" or "xml" before trigger reloadGrid. See the answer and the answer for more details.

Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • Thanks Oleg for your inputs. I have not set any property like "loadonce" when i construct the grid. However i will try to post my js code fo grid. – suman Jun 06 '12 at 12:25
  • @suman: By the way, [here](http://meta.stackexchange.com/a/22189/147495) you will find information how to format the code. – Oleg Jun 06 '12 at 12:45
  • @Oleg, Thank you for your explanation about `loadonce`. Now I was bit clear about `loadonce`. Thanks again. +1 – vissu Jun 06 '12 at 13:02