if I use a paragraph element the line doesn't break, but if I use a textarea element the line breaks. why is this?
html:
<div id="requirement_7">
<h3> Requirement #7</h3>
<p>Press "Show Array" button to see an array created with JSON.<br>
It will show A state, the capital and quailty rating.</p>
<button type="button" id="array_button" onclick="JSONArray()">Show Array</button>
<p id="array_text"></p>
</div>
javascript:
function JSONArray(){
var text = '{"stateCapital":['+
'{"stateName":"Texas", "stateCapital":"Austin", "qualityRating":"10"},'+
'{"stateName":"Virginia", "stateCapital":"Richmond", "qualityRating":"7"},'+
'{"stateName":"California", "stateCapital":"Sacremento", "qualityRating":"7"},'+
'{"stateName":"Coloroado", "stateCapital":"Denver", "qualityRating":"10"} ]}';
var obj = JSON.parse(text);
document.getElementById("array_text").innerHTML =
obj.stateCapital[0].stateName + " " + obj.stateCapital[0].stateCapital + " "
+ obj.stateCapital[0].qualityRating + "\n" +
obj.stateCapital[1].stateName + " " + obj.stateCapital[1].stateCapital + " "
+ obj.stateCapital[1].qualityRating + "\n" +
obj.stateCapital[2].stateName + " " + obj.stateCapital[2].stateCapital + " "
+ obj.stateCapital[2].qualityRating + "\n" +
obj.stateCapital[3].stateName + " " + obj.stateCapital[3].stateCapital + " "
+ obj.stateCapital[3].qualityRating;
}
I have "\n" in my script to create the line break. I'm confused why it works in one element and not the other?
you need to replace "\n" with "<br>" since you are using .innerhtml it recognizes it as HTML and not JavaScript.
Codepen http://codepen.io/noobskie/pen/ojjeKZ?editors=101
You must use <br> to make a line break in paragraph.
If you do not want to change from '\n' to <br> you can use <pre> tag instead of <p> tag.
refer doc:
http://www.w3schools.com/html/html_paragraphs.asp
http://www.w3schools.com/tags/tag_pre.asp
Related
I am having html code for hyperlink as below:
<td> {{ book.code }}</td>
<td>{{book.name}}</td>
it is directing to the correct page.
In Script from the response I update the page as below It is not giving error (of course link page is empty because of 1 as parameter):
html += "<tr> <td> <a href= '{% url 'select_stock_report' 1 %}'>"+item1.code+"</a></td>"+
"<td>" + item1.name + "</td>" + "<td>" + item1.open_qty + " </td>"
But I want to replace 1 (one) with item1.id.
html += "<tr><td><a href='{% url 'select_stock_report' item1.id %}'>"+item1.code+"</a></td>"+
"<td>" + item1.name + "</td>" + "<td>" + item1.open_qty + " </td>"
But I am getting error.
How to build the line with this replacement. I tried all "",'',+ with this item.id without success.
Thanks for your help.
String content="<h1>Heading 1</h1>\n" +
" <h2>Heading 2</h2>\n" +
" <p>This is some html. Look, here\\'s an <u>underline</u>.</p>\n" +
" <p>Look, this is <em>emphasized.</em> And here\\'s some <b>bold</b>.</p>\n" +
" <p>Here are UL list items:\n" +
" <ul>\n" +
" <li>One</li>\n" +
" <li>Two</li>\n" +
" <li>Three</li>\n" +
" </ul>\n" +
" <p>Here are OL list items:\n" +
" <ol>\n" +
" <li>One</li>\n" +
" <li>Two</li>\n" +
" <li>Three</li>\n" +
" </ol>";
Its use html inside of java
I have a input as below with a pattern
$('#charEntry').append("<input type='text' class='form-control' id='chars"+i+"' pattern='(?=.*\\\\d)(?=.*[a-z])(?=.*[A-Z])(?=.*[-+*/%])(?=.*[.?,:;-~]).*' " +
"title='Your String Must Contain:
" +
"One Upper Case Value
" +
" One Lower-Case Value
" +
" One Arithmetic Value
" +
" One Punctuation Character
" +
" One Numeric Value'" +
" maxlength='" +charLength + "'" +
" minlength='" +charLength + "' required>");
However in the actual message the new lines would not get printed as below.
I have tried , \n and 
 but nothing works.
is there a fix for this?
I have a string like so:
var customerInfo = data[0].Customer_Name + " " + data[0].Customer_LName + "\r\n" + data[0].Phone + "\r\n" + data[0].Email;
and I am trying to add new lines with \r\n but its not working, everything is on the same line. Please Help.
To print the javascript variable in an HTML page, you should use the <br /> tag to create a new line, instead \r\n.
var customerInfo = data[0].Customer_Name + " " + data[0].Customer_LName + "<br />" + data[0].Phone + "<br />" + data[0].Email;
Given the following snippet:
out.println("<form action=" + "./post" + " " + "method=" + "post" + " " + "id=" + "tweetForm" + ">");
for (int i = 1; i <= twParser.currentTweetIndex; i++) {
output = twParser.tweetArray[i] + newLine;
out.println("<p>");
out.println("<textarea" + " " + "name=text" + " " + "id=\"styled\"" + " " + "maxlength=140" + " " + "cols=" + "140" + " " + "rows=" + "1" + " " + "tag=" + "text_" + String.valueOf(i) + " " + "form=" + "tweetForm" + " " + "onfocus=\"setbg('#e5fff3');\" onblur=\"setbg('white')\"" + ">" + output + "</textarea>");
out.println("<span class=label-style-countdown" + " " + "id=" + "chars" + String.valueOf(i) + ">" + String.valueOf(140 - twParser.tweetArray[i].length()) + "</span> characters remaining");
out.println("<p>");
}
out.println("<input type=" + "submit" + " " + "name=" + "post" + " " + "value=" + "post" + " " + "style=\"float: left;\"" + "/>");
out.println("<button type=\"reset\" value=\"Reset\">Reset</button>"
...that creates HTML multiple textarea elements and posts them to a servlet. But since all the textareas have the same name, only the contents of the first textarea are posted.
Is there a way to post them all?
Thanks
To have multiple inputs from same name you can use name array like
<textarea name="text[]">You text here</textarea>
which will post all the values having same name as an array.
PS: This can be done with any input types expect radio buttons
On this line:
out.println("<textarea" + " " + "name=text" + " " ...
Append i to the name of the textarea, such that the names increase as text1, text2 etc.
out.println("<textarea" + " " + "name=text" + i.toString() + " " ...
Perform the same loop on the server when receiving the POST request to receive from each textarea.
I'm appending some information to the DOM, but realized that some of the information I need is nested within an object. When I do the below bit of code, the part within the loop returns as undefined. Is there a way to iterate over and pull out this information so that I can append it to my page:
function placeOnPage(allStopsWithRoutes){
allStopsWithRoutes.forEach(function(stop){
$('#stops').append("Stop: " + stop.crossStreets + "<br>" +
// LOOP HERE
stop.routes.forEach(function(route){
"Bus Name: " + busName + "<br>" +
"Stops Away: " + stopsAway + "<br>" +
"Destination: " + destination + "<p>"
});
// END LOOP
);
});
}
I don't think strings can be concatenated that way. Change your approach to concatenate before hand and store it in a variable. Then append the variable
function placeOnPage(allStopsWithRoutes) {
allStopsWithRoutes.forEach(function(stop) {
var concatenatedStr = '';
stop.routes.forEach(function(route) {
concatenatedStr += ("Bus Name: " + busName + "<br>" +
"Stops Away: " + stopsAway + "<br>" +
"Destination: " + destination + "<p>");
});
$('#stops').append("Stop: " + stop.crossStreets + "<br>" + concatenatedStr);
});
}