VPK
VPK

Reputation: 3090

create new elements using javascript

In my Spring web application, for customer registration page I am adding and removing divs containing text, img and a-ref elements. When I write the code inside the same jsp the page works perfectly but according to my requirement when I try to put javascript code into a js file and import it and click add button a new div is inserted along with script code as given below,

in the image below when i press the '+' sign button i intend to call a js function which adds a row with text field and a close button and an img, but instead of this it shows the code

the js function I am using to add a div is..

function addInputBox() { 
var ni = document.getElementById('myDiv'); 
var numi = document.getElementById('theValue');
var num = (document.getElementById('theValue').value -1)+ 2;
numi.value = num;
var newdiv = document.createElement('div');
var divIdName = 'my'+num+'Div';

newdiv.setAttribute('id',divIdName); 
var htmlString  = '<div style="margin-top: 5px"><input type="text"name="service_name" title="Service Name" maxlength="200" style="width:400px;vertical-align:middle;"/>'+ 
                            '<a href="javascript:removeInputBox(\''+divIdName+'\')"><img src="<c:url value="/resources/img/common/x.png" />" alt="" style="vertical-align:middle;margin-left: 5px"/></a>'+
                            '<img src="<c:url value="/resources/img/ope/new.png" />" style="vertical-align:middle;margin:2px 0 0 2px;margin-left: 5px" /> </div> ';

newdiv.innerHTML = htmlString; 
ni.appendChild(newdiv);} 

any idea what may went wrong? any help would be greatly appreciated..

Upvotes: 0

Views: 173

Answers (1)

bipen
bipen

Reputation: 36531

pretty sure the script is there , because you are not escaping the quotation..try this

<img src="<c:url value=\"/resources/img/common/x.png\" />" alt="" style="vertical-align:middle;margin-left: 5px"/></a>'+
                        '<img src="<c:url value=\"/resources/img/ope/new.png\" />" style="vertical-align:middle;margin:2px 0 0 2px;margin-left: 5px" /> 

missing escape..."\" in ur img tag....

not sure wat c:url is...

hope this helps

Upvotes: 1

Related Questions