javascript - Escaping generated HTML that onclick has a jQuery function with CSS attribute selector -


i have mechanism generates html in javascript, , need extend mechanism add remove row button.

the row-generating mechanism looks following:

debug.createoverriderow = function (override) {      var rowstr = "";     if (override.autodisplay) {         rowstr += "<tr session-key=\"" + override.sessionkey + "\" ";     } else {         rowstr += "<tr class=\"hide\" session-key=\"" + override.sessionkey + "\" ";     }     rowstr += "session-key-data-type=\"" + override.datatype + "\">";     rowstr += "<td id=\"tddisplayname" + + 1 + "\">" + override.displayname + "</td>";     rowstr += "<td id=\"tdvalue" + + 1 + "\">";      switch (override.datatype) {         case "nullableinteger":         case "integer":         case "rowstring":             rowstr += "<input type=\"text\" onchange=\"common.validatefield(this, " + override.validationpattern + ")\" onblur=\"common.validatefield(this, " + override.validationpattern + ")\" />";             break;         case "array":             rowstr += "<input type=\"text\"/>";             break;         case "date":             rowstr += "<input class=\"datepicker\" placeholder=\"yyyy-mm-dd\" type=\"text\" onchange=\"common.validatedate(this)\" onblur=\"common.validatedate(this)\" />";             break;         case "boolean":             rowstr += "<input type=\"checkbox\"/>";             break;         case "radio":             var inputs = override.inputlist.split(";");             rowstr += "<div>";             (var j = 0; j < inputs.length; j++) {                 var elements = inputs[j].split(":");                 rowstr += "<input id=\"rad" + j + "\" name=\"" + override.sessionkey + "\" type=\"radio\" value=\"" + elements[0] + "\" />&nbsp;" + elements[1] + "&nbsp;";             }             rowstr += "</div>";             break;     }      rowstr += "</td>";     rowstr += "</tr>";     return rowstr; } 

the mechanism supposed inject remove button:

debug.injectremovebuttonintooverriderow = function (override, row) {     $(row).find('td:last').append("<input type=\"button\" value = \"remove\" onclick=\"$('tr[session-key=\"" + override.sessionkey + "\"]').remove();\" />"); } 

html sample:

<tr session-key="data.sampleid" session-key-data-type="nullableinteger"><td id="tddisplayname71">sample id</td><td id="tdvalue71"><input type="text"><input type="button" value="remove" onclick="$(" tr[session-key="data.sampleid" ]').remove();'=""></td></tr> 

is possible escape quotes work?

as per @shilly's suggestion, have moved selector function:

debug.injectremovebuttonintooverriderow = function (override, row) {     var cleanedsessionkey = override.sessionkey.replace(/[^a-za-z0-9]/g, "");     $(row).find('td:last').append("<script type=\"text/javascript\"> function remove" + cleanedsessionkey + "(){ $('tr[session-key=\"" + override.sessionkey + "\"]').remove(); }</script><input type=\"button\" value = \"remove\" onclick=\"remove"+cleanedsessionkey+"()\" />"); } 

Comments

Popular posts from this blog

sql - invalid in the select list because it is not contained in either an aggregate function -

Angularjs unit testing - ng-disabled not working when adding text to textarea -

How to start daemon on android by adb -