How to create a html block in java-script variable

Posted on by

JavaScript is a client-side and dynamic scripting language. JavaScript allows you to build interactivity into static HTML pages. It makes pages more dynamic and interactive. Some time you need to use a large block of HTML code into JavaScript variable.

How you can create it ? First of all create HTML block you want display and assigned to a java script variable whichever wrapping in single quotes. You need a backslash at the end for string that span multiple lines and some quotes to encapsulate it overall, like this:
Example:

var html='<table class="form-table">

<tbody>

<tr valign="top">

<th scope="row">Field Name</th>

<td>

<input type="text" autofocus="autofocus" class="regular-text required" id="formtitle" name="formtitle" />

<span id="formtitleerr" class="err"></span>

</td>

</tr>

<tr valign="top">

<th scope="row">Field Type</th>

<td>

<select id="fieldtype">

<option value="Text">Text</option>

<option value="Textarea">Textarea</option>

<option value="RadioBox">RadioBox</option>

<option value="CheckBox">CheckBox</option>

<option value="Number">Number</option>

<option value="Email">Email</option>

</select>

<span id="formtitleerr" class="err"></span>

</td>

</tr>

</tbody>

</table>';

Here is a handy tool for creating java script HTML block easily.
Click Here
It automatically creates a list of html tags, keeping the indentation.