title: How can I resize Jira gadgets' data?
body: <p>I am implementing a Jira gadget. I have an problem about retrieve data.
  I am retrieving data from DB to gadget. There are lots of columns so the gadget cannot show all columns.  I guess I have to resize data. There is one more thing; how can I stop the retrieving data to go end of pages?
  Here is my gadget.xml</p>
  
  <pre><code>        #requireResource("com.atlassian.gadgets.publisher:ajs-gadgets")
          #requireResource("sqlGadget:Web-resources")
          #requireResource("com.atlassian.jira.gadgets:common")   
          #requireResource("com.atlassian.jira.gadgets:autocomplete")
          #includeResources()
  
           &lt;script type="text/javascript"&gt;
             (function () {
               var gadget = AJS.Gadget({
                 baseUrl: "__ATLASSIAN_BASE_URL__", 
                 useOauth: "/rest/gadget/1.0/currentUser",
  
          config: {
                               descriptor: function(args) {
                                  var gadget = this;
                                  gadgets.window.setTitle("SQL Gadget Config");
                                  var projectPicker = AJS.gadget.fields.projectPicker(gadget, "projectId", args.projectOptions);
                                               return {
  
                                fields: [
                                    projectPicker,
                                    {
                              id: "configNumber-id",
                              userpref: "configNumber",
                              label: "Config number",
                              description: "",
                              type: "select",
                              selected: gadget.getPref("configNumber"),
                              options: [
                                          {
                                              label:"1",
                                              value:"1"
                                          },
                                          {
                                              label:"2",
                                              value:"2"
                                          },
                                          {
                                              label:"3",
                                              value:"3"
                                          }
                                       ]
                          },
                                    AJS.gadget.fields.nowConfigured()
                                ]
  
                            };
                        },
  
                         args: function()
                        {
                            return [
                                {
                                    key: "projectOptions",
                                    ajaxOptions:  "/rest/gadget/1.0/filtersAndProjects?showFilters=false"
                                }
                            ];
                        }()           
                  },
  
       view: {
                          /* HTML PART*/
  
                           onResizeAdjustHeight: true,
                           enableReload: true,
                           template: function (args)
                           {
  
                          var gadget = this;                            
                          var response = args.projects.value;
  
  
                          AJS.$.each(AJS.$.parseJSON(response), function(idx, obj) {
                              console.log(obj);
                          });
                          var myList=AJS.$.parseJSON(response);   
                          var test="&lt;body onLoad=buildHtmlTable()&gt;&lt;table id=excelDataTable border=1&gt; &lt;/table&gt;&lt;/body&gt;";
                          document.getElementById("myDiv").innerHTML = test;
  
                         var columns = addAllColumnHeaders(myList); 
                         for (var i = 0 ; i &lt; myList.length ; i++) {
                              var row$ = AJS.$('&lt;tr/&gt;');
                              for (var colIndex = 0 ; colIndex &lt; columns.length ; colIndex++) {
                               var cellValue = myList[i][columns[colIndex]];
  
                              if (cellValue == null) { cellValue = ""; }
  
                                   row$.append(AJS.$('&lt;td/&gt;').html(cellValue));
                              }
                           AJS.$("#excelDataTable").append(row$);
                        }
  
                        function addAllColumnHeaders(myList)
                       {
                           var columnSet = [];
                           var headerTr$ = AJS.$('&lt;tr/&gt;');
  
                           for (var i = 0 ; i &lt; myList.length ; i++) {
                              var rowHash = myList[i];
                              for (var key in rowHash) {
                                  if (AJS.$.inArray(key, columnSet) == -1){
                                      columnSet.push(key);
                                      headerTr$.append(AJS.$('&lt;th/&gt;').html(key));
                                  }
                              }   
                          }
               AJS.$("#excelDataTable").append(headerTr$);
               return columnSet;
  }
                           },
  
                  args: [
                               {
                                   key: "projects",
                                   ajaxOptions: function ()
                                   {
                              var projectName;
                              var confOrder;
                              var projectField = document.getElementById("projectId"); 
                              var confNumbElement = document.getElementById("configNumber-id");
  
                                  if(projectField != null){
                                      projectName = projectField.options[projectField.selectedIndex].text;
                                      console.log(projectName);
                                  }
                                  if(confNumbElement != null){
                                      confOrder = confNumbElement.options[confNumbElement.selectedIndex].text;
                                      console.log(confOrder);
                                      this.configNumber = confOrder;
                                  }
                               return {
                                           url: "/rest/sqlrestsource/latest/execute",
                                           data:  {
                                               projectId : gadgets.util.unescapeString(this.getPref("projectId")),
                                               configNumber : gadgets.util.unescapeString(this.getPref("configNumber")),
                                           }
                                       };
  
                                   }
                               }
                      ]    
            }
       });
  })();
  </code></pre>
  
  <p></p>