Clickable icon in script report

Hi Team,

I am trying to make below editable icon clickable to respective doctype.

My code for report →

frappe.query_reports[“customer_script_report”] = {
“filters”: [

],
// formatter: function (value, row, column, data, default_formatter) {
// 	value = default_formatter(value, row, column, data);

// 	if (column.fieldname=="disabled") {
// 		if (data[column.fieldname] == 0) {
// 			value = "<span style='color:red'>" + value + "</span>";
// 		} else  {
// 			value = "<span style='color:green'>" + value + "</span>";
// 		}
// 	}

// 	return value;
// },
formatter: function (value, row, column, data, default_formatter) {
	value = default_formatter(value, row, column, data);

	if (column.fieldname=="disabled") {
		if (data[column.fieldname] == 0) {
			value = "<center><p>&#9989;<br> yes</p></center>";
		} else  {
			value = "<center><p>&#10060;</p></center>";
		}
	}
	if (column.fieldname=="name") {
			value = "<center><p style='font-size:24px'>&#9997;</p></center>";
		}
	return value;
},

};

frappe.query_reports[“customer_script_report”] = {
“filters”: [

],
// formatter: function (value, row, column, data, default_formatter) {
// 	value = default_formatter(value, row, column, data);

// 	if (column.fieldname=="disabled") {
// 		if (data[column.fieldname] == 0) {
// 			value = "<span style='color:red'>" + value + "</span>";
// 		} else  {
// 			value = "<span style='color:green'>" + value + "</span>";
// 		}
// 	}

// 	return value;
// },
formatter: function (value, row, column, data, default_formatter) {
	value = default_formatter(value, row, column, data);

	if (column.fieldname=="disabled") {
		if (data[column.fieldname] == 0) {
			value = "<center><p>&#9989;<br> yes</p></center>";
		} else  {
			value = "<center><p>&#10060;</p></center>";
		}
	}
	if (column.fieldname=="name") {
			value = "<center><p style='font-size:24px'>&#9997;</p></center>";
		}
	return value;
},

};

need some guidance on it.

I have made some changes to custom_script_report.js

ormatter: function (value, row, column, data, default_formatter) {
value = default_formatter(value, row, column, data);

	if (column.fieldname=="disabled") {
		if (data[column.fieldname] == 0) {
			value = "<center><p>&#9989;<br> yes</p></center>";
		} else  {
			value = "<center><p>&#10060;</p></center>";
		}
	}
	if (column.fieldname=="name") {
			value = "<center><p style='font-size:24px'>&#9997;</p></center>";
			column.link_onclick =
			console.log("testing")
		}
	return value;
},

};

as of now I am printing in console log and I want to redirect it to respective doctype

Hi @vipinazad-85:

Use

frappe.set_route('Form', "Customer", "your_customer_code")

Hope this helps.

Is that edit icon part of a custom column, just as for gender?

If so, the easiest way I know of to turn a column value into a link, is to define the column as “fieldtype”: “Link”, “options”: “Your DocType Name”. The value of the cell will be the document name (aka ID). Clicking on the icon will then redirect you to the specific document.

But, what intrigues me most is your HTML as part of the value of the column. I’m actually working on something very similar right now and maybe you could help me.
How do you get the row height to expand if the HTML includes one or more “br” elements?