2013-08-24 2 views
3

jqGrid의 한면에 버튼이 하나 있습니다. 단추를 클릭하면 jqGrid 추가 단추 내부에 충돌합니다. 그것이 가능합니다.JQgrid custom 행 추가

<input type="button" id="btnCustomAdd" value="Add"/> 

위의 버튼을 클릭하면 jqGrid 버튼이 눌려집니다. 그것이 가능합니다.

있는 jqGrid : 당신이 읽을 수 추가 된 형태로 편집 예 : 방금 새로운 빈 행이

$(function(){ 
    $("#btnCustomAdd").on("click", function(event){ 
     $("#grid").jqGrid("addRowData", rowid, { Id: rowid}); 
     //OR 
     $("#grid").addRow(rowid, parameters); 
     //OR new API 
     $("#grid").jqGrid('addRow',parameters); 
     //FORM EDIT EXAMPLE 
     $("#grid").editGridRow("new", parameters); 
     //OR new API 
     $("#grid").jqGrid('editGridRow', "new", parameters); 
    }); 
}); 

parameters = 
{ 
    rowID : "new_row", 
    initdata : {}, 
    position :"first", 
    useDefValues : false, 
    useFormatter : false, 
    addRowParams : {extraparam:{}} 
} 

편집을 보여주고 있음을 의미하는 경우

$("#Datasourcegrid").jqGrid({ 
       postData: { CAId: function() { return $('#hdnchnAppId').val(); } }, 
       colNames: ['DataSourceId', 'Title','Sort Order'], 
       colModel: [ 
          { name: 'DataSourceId', index: 'DataSourceId', align: 'left', key: true, editable: false, hidden: true, search:false,width: '10'}, 
          { name: 'DataSourceTitle', index: 'DataSourceTitle', sortable: true, align: 'left', width: '400',editable: true, edittype: 'text', editrules: { required: true },stype:'text', search:true,searchoptions:{sopt:['eq']}}, 
          { name: 'SortOrder', index: 'SortOrder', sortable: true, align: 'left', width: '100',editable: true, hidden: true, edittype: 'text', editrules:{number:true, required:true}, search:false}, 

], 

답변

3

당신은, 이런 식으로 할 수있다 양식 편집에 대한 자세한 정보 here

+0

rowid가 정의되지 않았기 때문에 오류가 발생합니다. 여기 rowid 의미? – Ram

+0

행 ID는 고유 한 새 ID로 -1로 설정하거나 나중에 고유 한 행을 선택하거나 편집 할 수있는 사용자 정의 표시기를 증가시킵니다. – TheCodeDestroyer

+0

-1로 지정했습니다. 하지만 점점. jqGrid에 대한 코드를 추가했습니다. 해당 jqGrid를 통해 솔루션을 제공 할 수 있습니까? 여기에 title과 sortorder가있는 폼 추가 (팝업)가 필요합니다. – Ram