2
Contributors
6
Replies
7
Views
7 Years
Discussion Span
Last Post by diafol
0

i am using jquery .

$("div.Container").append("<div   style='margin-left:8px;text-align:left' id='Name"+counter+"' onclick=EnablePropertiesField('lblName','"+counter+"','Name');> "+"<div style='height:50px;width: 555px;'>"+"<span id='lblName"+counter+"'>* Name</span> <br/><input type='text' style='width: 180px' class='Text' required='true' id='txtName"+counter+"' /><span id='errorName"+counter+"' style='color:red'></span> "+"<span style='float:right'><img src='images/remove-ico.gif' alt='Delete' id='imgName"+counter+"' onclick=DeleteNode('Name"+counter+"') class='DeleteClass' /></span>"+"</div></div>\n");      
		++counter;
0

OK, so if I get you right - this is an example of your js-initiated output (where counter = 1):

<div style='margin-left:8px;text-align:left' id='Name1' onclick=EnablePropertiesField('lblName','1','Name');>
   <div style='height:50px;width: 555px;'>
        <span id='lblName1'>* Name</span><br/>
        <input type='text' style='width: 180px' class='Text' required='true' id='txtName1' /><span id='errorName1' style='color:red'></span><span style='float:right'><img src='images/remove-ico.gif' alt='Delete' id='imgName1' onclick=DeleteNode('Name1') class='DeleteClass' /></span>
    </div>
</div>

I would suggest placing all your style rules into an external css file. You can give the bounding div a classname like "sideElement" or something, so you can hook the rest of the insides to it. You should also enclose your inline js within quotes.

css:

.sideElement{
  margin-left:8px;
  text-align:left;
}
.sideElement div{
  height:50px;
  width: 555px;
}
.sideElement input{
  width: 180px;
}
.sideElement div > span{/* applied to first child span under div*/
 color:red;
}
.sideElement div span + span{ /*applied to 2nd and subsequent span elements inside div element*/
 float:right;
}

markup:

<div class="sideElement" onclick="EnablePropertiesField('lblName','1','Name');">
   <div>
        <span id='lblName1'>* Name</span><br/>
        <input type='text' class='Text' required='true' id='txtName1' /><span id='errorName1'></span><span><img src='images/remove-ico.gif' alt='Delete' id='imgName1' onclick="DeleteNode('Name1');"  /></span>
    </div>
</div>

I apologise if I have deleted a class or something that you rely upon. I assume that you need certain ids for document.getElementById() in js functions. I assume the class="Text" and required="true" is something to do with a client-side validation. If not remove the class and style through the css. Do you need an id for the image?

I've gone through this so you can de-clutter the markup and get to grips with what's causing the problem.

0

i am using jquery .

$("div.Container").append("<div   style='margin-left:8px;text-align:left' id='Name"+counter+"' onclick=EnablePropertiesField('lblName','"+counter+"','Name');> "+"<div style='height:50px;width: 555px;'>"+"<span id='lblName"+counter+"'>* Name</span> <br/><input type='text' style='width: 180px' class='Text' required='true' id='txtName"+counter+"' /><span id='errorName"+counter+"' style='color:red'></span> "+"<span style='float:right'><img src='images/remove-ico.gif' alt='Delete' id='imgName"+counter+"' onclick=DeleteNode('Name"+counter+"') class='DeleteClass' /></span>"+"</div></div>\n");      
		++counter;

yes your logic is right for counter.no apologise for that thing.
class="Text" and required="true" , can not remove these as u know that.... i tested with external css file but in IE it is not displaying good more gaps between controls showing in IE

i want it in proper format .....

so can u help me....

0

looked at your site and your trousers are down on the form create page. All your js is showing. Can't see the offending page as the form creator will not advance beyond the faulty page.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.