Dear Support Team,

I am working with HtmlDataGrid in West Wind Web Connection and need to add an image to a button inside a grid column. Currently, I am using the HtmlButton function to generate the button, but I have not been able to display an image instead of text.

Here is the code I am using:

pcgridhtml = ""
		IF lncount > 0 AND lnreccount > 0	&&Evalúa si la consulta a la base de datos fue exitosa y si el cursor devuelto contiene registros
			LOCAL logridconfig
			logridconfig = CREATEOBJECT("HtmlDataGridConfig")
			logridconfig.pagesize = 8  && Add paging
			logridconfig.tablestyle = "border-collapse: collapse; font-size: 15px; padding: 0px; line-height: 1; border-spacing: 0px; height: 5px;"
			logridconfig.pagebaselink = "listaemitidos.awa?page=lnpagina"	&&Se almacena link que servira para navegar por los botones de la grilla sin que se pierda los parámetros de la url

			LOCAL locolumn AS htmldatagridcolumn
			locolumn = CREATEOBJECT("HtmlDataGridColumn")
			locolumn.EXPRESSION = "ALLTRIM(TEmitidos.tipdoc_descrip)"
			locolumn.headertext = "Tipo Documento"
			logridconfig.ADDCOLUMN(locolumn)

			locolumn = CREATEOBJECT("HtmlDataGridColumn")
			locolumn.EXPRESSION = "TRANSFORM(TEmitidos.emi_fecha)"
			locolumn.headertext = "Fecha"
			logridconfig.ADDCOLUMN(locolumn)

			locolumn = CREATEOBJECT("HtmlDataGridColumn")
			locolumn.EXPRESSION = "TEmitidos.emi_tercero"
			locolumn.headertext = "Cliente"
			logridconfig.ADDCOLUMN(locolumn)

			locolumn = CREATEOBJECT("HtmlDataGridColumn")
			locolumn.EXPRESSION = "TEmitidos.emi_prefijo"
			locolumn.headertext = "Prefijo"
			logridconfig.ADDCOLUMN(locolumn)
			
			locolumn = CREATEOBJECT("HtmlDataGridColumn")
			locolumn.EXPRESSION = "TEmitidos.emi_numero"
			locolumn.headertext = "Numero"
			logridconfig.ADDCOLUMN(locolumn)

			locolumn = CREATEOBJECT("HtmlDataGridColumn")
			locolumn.EXPRESSION = 'HtmlButton("btnAccion" + TRANSFORM(ALLTRIM(TEmitidos.emi_numero)), "", [onclick="ejecutarAccion(this.id)" style="padding:0px; height:18px; width:25px;"])'
			locolumn.headertext = "Acción"
			logridconfig.ADDCOLUMN(locolumn)

			pcgridhtml = htmldatagrid(lclisemi,logridconfig)
		ENDIF

If you want to customize any of the 'controls' you need to create the HTML explicitly - ideally in a separate function/method - that you pass as the expression.

• Custom Row and Column Rendering

+++ Rick ---

Thank you for your response. I understand that I need to generate the HTML explicitly in a function/method and pass it as an expression in the HtmlDataGrid column.

My question is: in which file or class should I define this function in Web Connection? I'm not sure where the Process class is located in my application to add the custom function.

I would appreciate any guidance on how to identify the correct place to define it.

Best regards,

Well you have to put it somewhere where it's visible to the script. You can put it on your model and make sure the model is PRIVATE so it can be accessed in the Framework when it renders.

Process class is the easiest, but I agree - I don't like to put a bunch of little function on that as it gets bloated as it is with requests.

Another option:

Create a separate class like ProcessHelpers and add it as a Helpers property to the Process class. You add your render functions to that class, and so your expressions would be something like this:

loColumn = loConfig.AddColumn([Process.Helpers.LinkAlbum()],"Album")

+++ Rick ---

Thank you very much for your help. I implemented the solution, and it worked perfectly. I really appreciate your time and support.