Html And Javascript Code Concatenation Problem

I am trying to append HTML syntax with javascript and onClick trying to pass a function with 2 parameters. But while passing the parameters I am doing something wrong in concatenat

Solution 1:

Try instead of writting the ', try like this \':

addPanelHtml +="<li><a href=\'#\' id=\'btnhistory"+ i+"\' onclick=\'histDrpDwnEdt("+chkval+"\',\'"+ i+")\'>History Parameters</a></li>";

Solution 2:

I would highly recommend to use template strings in this use case

Here the solution with template strings

addPanelHtml += `<li><ahref='#'id='btnhistory${i}'onclick='histDrpDwnEdt(${chkval}, ${i})'>History Parameters</a></li>`;

Then you can get rid of all these + " " + concatenations and just use ${} to enclose your variables.

This improves the readabilty of your code by far.

Here you can read more about template strings

• https://developer.mozilla.org/de/docs/Web/JavaScript/Reference/template_strings

Solution 3:

My suggestion:

var addPanelHtml = '', i = 0, chkval = 1;

addPanelHtml += '<li><a href="#" id="btnhistory' + i + '" onclick="histDrpDwnEdt(' + chkval + ', ' + i + ')">History Parameters</a></li>';

console.log(addPanelHtml);