jqGrid : xmlstring 동적 로딩 테스트

화면을 로딩한 후 데이터를 동적으로 추가하는 방법

HTML

<link rel="stylesheet" href="http://www.trirand.com/blog/jqgrid/themes/ui.jqgrid.css">
<script src="http://www.trirand.com/blog/jqgrid/js/i18n/grid.locale-en.js"></script>
<script src="http://www.trirand.com/blog/jqgrid/js/jquery.jqGrid.js"></script>
<button id="data1">MLB</button>
<button id="data2">Hanwha</button>
<table id="xmlTest"></table>

JavaScript

var data1 = "<root><users><user><name>박찬호</name></user><user><name>류현진</name></user><user><name>추신수</name></user></users></root>";
 var data2 = "<root><users><user><name>이태양</name></user><user><name>김태균</name></user><user><name>정민철</name></user><user><name>나나나</name></user></users></root>";

 jQuery("#xmlTest").jqGrid({
     height: 200,
     datatype: 'local',
     colNames: ['name'],
     colModel: [{
         name: 'name'
     }],
     rowNum: 10, // 표시 갯수
     rownumbers: true, // 숫자표시 여부
     xmlReader: {
         root: "users", // 목록
         row: "user",
         repeatitems: false
     },
     caption: 'Name List'
 });

 $('#data1').click(function () {
     // 데이터 추가 방법
     $("#xmlTest").setGridParam({
         datastr: data1,
         datatype: "xmlstring" // !!! reset datatype
     }).trigger("reloadGrid");
 });

 $('#data2').click(function () {
     // 데이터 추가 방법
     $("#xmlTest").setGridParam({
         datastr: data2,
         datatype: "xmlstring" // !!! reset datatype
     }).trigger("reloadGrid");
 });