CODEWITHSUNDEEP
javascriptjqueryjqgrid
Neha
Neha

Reputation: 18

Replicate data into JQGrid

I am creating a jqgrid i m creating a row with 2 columns with dropdown box. The dropdowns are getting populated using ajax call. My requirement is I want to replicate this row on click on ADD button in UI. For example for now one row is coming into jqgrid, after clicking ADD button a new row with same content with out refreshing the changed value in first row should be displayed. Is there any way to do that? My jqgrid code is

$("#tbl").jqGrid('GridUnload');
$("#tbl").jqGrid(
        {
            url : "/searchCriteria.do",
            datatype : 'json',
            colModel : 
            [   
                {name : "test1",label : "TEST1", search : false,cellEdit:true, editable: true,edittype:"select",width:150  ,formatter: createDropDown,title:false},
                {name : "test2",label : "TEST2", search : false,cellEdit:true, editable: true,edittype:"select",width:150  ,formatter: createDropDown,title:false}
            ],
            viewrecords: true, 
            loadonce:true,
            width: 1000,
            multiselect : true
        });
});

Upvotes: 0

Views: 48

Answers (1)

keithxm23
keithxm23

Reputation: 1280

You can use a combination of the getLocalRow and addRowData methods to achieve your functionality. Docs for these methods.

Let's say in your HTML you have a button:

<button id="add" type="button">ADD</button>

In your javascript you could have:

<script>
$("#add").click(function(){
    var id_of_new_row = something; //you haven't specified which are the exact rows you'd like selected. 
    //you could use the getDataIDs method to get the row-IDs you're looking for
    var new_row_data = $("#gridId").jqGrid('getLocalRow', id_of_new_row));
    $("#gridId").jqGrid('addRowData',id_of_new_row+1, new_row_data, "last");
  });
</script>

Upvotes: 1

Related Questions