Arbeta med GridJs klientsida

Arbeta med GridJs klientsida

Vi utvecklade GridJs klient baserat påx-kalkylblad.

huvudstegen är:

  • skapa x_spreadsheet-instans
xs = x_spreadsheet(id, options)
  • ladda json-data
xs.loadData(jsondata.data)
  • ställ in aktivt ark
xs.setActiveSheetByName(jsondata.actname)
  • ställ in aktiv cell
xs.setActiveCell(jsondata.actrow,jsondata.actcol);

till exempel koden nedan init ett x_spreadsheet-objekt.

 xs = x_spreadsheet('#gridjs-demo', {
			updateMode:'server',
			updateUrl:'/GridJs2/UpdateCell',
			mode: 'edit',
			showToolbar: true,
                        local: 'en',
            showContextmenu: true
        }).loadData(sheets)

// parametrarna för alternativ: updateMode: för närvarande stöder vi bara ‘server’ updateUrl: ställ in webbadressen på serversidan för uppdateringsåtgärd baserat på json läge: läs betyder skrivskyddat kalkylblad/redigera betyder att vi kan redigera kalkylarket showToolbar: betyder om verktygsfältet ska visas showFileName: om filnamnet ska visas lokalt: stöder flera språk för menyer, språket kan vara: en, cn, es, pt, de, ru, nl för engelska, kinesiska, spanska, portugisiska, tyskland, ryska, holländska showContextmenu: betyder om man vill visa sammanhangsmenyn vid högerklick på en cell


andra användbara apis

  • Återge vyn
xs.reRender()
  • Hämta vald bild/form��om inget valt kommer att returnera null
xs.sheet.selector.getObj()
  • Hämta cellobjektet
xs.sheet.data.getCell(ri,ci)
    // the parameters are:
    ri:row index 
	ci:column index
  • Få cellstilen
xs.sheet.data.getCellStyle(ri,ci)
    // the parameters are:
    ri:row index 
	ci:column index
  • Ställ in cellvärdet
xs.sheet.data.setCellText(ri,ci,value,state)
    // the parameters are:
    ri:row index 
	ci:column index
	value:the cell value
	state: input | finished
  • Hämta/ställ in det valda cellintervallet
xs.sheet.data.selector.range
  • Ställ in cellvärdet för den markerade cellen eller cellområdet
xs.sheet.data.setSelectedCellText(value)
    // the parameters are:
	value:the  value for the cell
  • Ställ in stilen för den markerade cellen eller cellområdet
xs.sheet.data.setSelectedCellAttr(attributename,value)
    // the parameters are:
    attributename:font-name | font-bold | font-italic | font-size  | format|border|merge|formula |strike|textwrap |underline |align |valign |color|bgcolor|pattern
	value:the  value for the attribute
  • Slå samman det markerade cellområdet
xs.sheet.data.merge()
  • Ta bort det markerade cellområdet
xs.sheet.data.unmerge()
  • Ta bort den markerade cellen
xs.sheet.data.deleteCell(what)
    // the parameters are:
    what:all|format  all: means delete the cell and clear the style ;format means delete the cell value and keep the cell style
  • Ställ in frysrutan
xs.sheet.data.setFreeze(ri,ci)
    // the parameters are:
    ri:row index 
	ci:column index
  • Infoga rad eller kolumner vid den markerade cellen
xs.sheet.data.insert(type, n)
    // the parameters are:
    type: row | column
	n:the row or column number
  • Ta bort rad eller kolumner vid den markerade cellen
xs.sheet.data.delete(type)
    // the parameters are:
    type: row | column
  • Ställ in bredden för kolumnen
xs.sheet.data.setColWidth(ci,width)
    // the parameters are:
    ci:column index
	width:the width for the column
  • Hämta bredden för kolumnen
xs.sheet.data.cols.sumWidth(min,max)
    // the parameters are:
    min:the start column index
	max:the end column index,not include
  • Ställ in höjden för raden
xs.sheet.data.setRowHeight(ri,height)
    // the parameters are:
    ri:row index
	height:the height for the row
  • Få höjden för raden
xs.sheet.data.rows.sumHeight(min,max)
    // the parameters are:
    min:the start row index
	max:the end row index,not include
  • Hämta/ställ in visningsriktningen
xs.sheet.data.displayRight2Left

för detaljerad information, kan du kolla exemplet här https://github.com/aspose-cells/Aspose.Cells-for-.NET/tree/master/Examples_GridJs