Show More / Less Without Stripping Html Tags In JavaScript / JQuery
Jan 6, 2011
I want to implement readmore/less feature. i.e I will be having html content and I am going to show first few characters from that content and there will be a read more link in front of it. I am currently using this code :
var txtToHide= input.substring(length);
var textToShow= input.substring(0, length);
var html = textToShow+ '<span class="readmore"> … </span>'
+ ('<span class="readmore">' + txtToHide+ '</span>');
html = html + '<a id="read-more" title="More" href="#">More</a>';
Above input is the input string and length is the length of string to be displayed initially. There is an issue with this code, suppose if I want to strip 20 characters from this string:
"Hello <a href='#'>test</a> output", the html tags are coming between and it will mess up the page if strip it partially. What I want here is that if html tags are falling between the range it should cover the full tag i.e I need the output here to be "Hello <a href='#'>test</a>" . How can I do this?
View 5 Replies
Similar Messages:
Mar 10, 2010
In my application, there's a module that displays a user's assignments. Sometimes these assignment descriptions are pretty long that's why I display up to 500 characters of the description. However, because I use an HTML editor in the app, if I blindly grab the first 500 characters, there's a good chance the description will look very funky due to missing HTML tags. So, I first need to strip off all the HTML tags, then grab the first 500 characters. Before I re-invent the wheel, I wanted to see if someone else has already tackled this issue and would be kind enough to share his/her code with me.
View 6 Replies
Mar 29, 2010
There are lots of questions on how to strip html tags, but not many on functions/methods to close them.
Here's the situation. I have a 500 character Message summary ( which includes html tags ), but I only want the first 100 characters. Problem is if I truncate the message, it could be in the middle of an html tag... which messes up stuff.
Assuming the html is something like this:
<div class="bd">"Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br/>
<br/>Some Dates: April 30 - May 2, 2010 <br/>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. <em>Duis aute irure dolor in reprehenderit</em> in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <br/>
</p>
For more information about Lorem Ipsum doemdloe, visit: <br/>
<a href="http://www.somesite.com" title="Some Conference">Some text link</a><br/>
</div>
How would I take the first ~100 characters or so? ( Although, ideally that would be the first approximately 100 characters of "CONTENT" ( in between the html tags )
I'm assuming the best way to do this would be a recursive algorithm that keeps track of the html tags and appends any tags that would be truncated, but that may not be the best approach.
My first thoughts are using recursion to count nested tags, and when we reach 100 characters, look for the next "<" and then use recursion to write the closing html tags needed from there.
The reason for doing this is to make a short summary of existing articles without requiring the user to go back and provide summaries for all the articles. I want to keep the html formatting, if possible.
NOTE: ignore that the html isn't totally semantic. This is what I have to deal with from my WYSIWYG.
EDIT:
I added a potential solution ( that seems to work ) I figure others will run into this problem as well. I'm not sure it's the best... and it's probably not totally robust ( in fact, I know it isn't ),
View 4 Replies
Jan 31, 2011
How can I remove all html tags and script tags? consider also short tags like unclosed tags
<script>blah...</script>
<body> aaa<b>bbb</body>
This should return aaa bbb.
notice that all the contents inside the script tag is ignored.
View 3 Replies
Sep 5, 2010
I have the following TR in HTML and i using JQuery
<tr class="RowDiv" id="tempTR" runat="server" visible="false"> <td>
<div class="LabelDiv">
<div class="dfltTxtBld">
ID<span class="reqChar" runat="server" id="Span1" visible="false">
*</span>
</div>
</div>
</td>
<td>
<div class="InputDiv">
<asp:TextBox ID="TextBox1" runat="server" CssClass="txtField" MaxLength="10"></asp:TextBox>
</div>
</td>
<td>
<div id="Div1" runat="server">
</div>
</td>
</tr>
and in javascript code i called the following method to hide it
$('#<%= tempTR.ClientID %>').hide();
but always it doesn't affected even i try to make it hidden and then show it also not work .. i try to hide & show TextBox1 and it work but if i try with the row it doesn't work ... is there any way to show/hide TR ?
View 4 Replies
Nov 9, 2010
On my webpage i have labels showing data from database. Some values can have html tags in them, example <br>. When showing <br> in a Lable it converts it to next line. What do i need to do to make Label show <br> as "<br>" string?
View 1 Replies
Mar 8, 2011
I want regex operation for removing style tags,css,scripts and html tags from html to plain text in asp.net c#...
View 1 Replies
Jun 19, 2010
I am trying to build a white list. I am using html agility pack to remove all tags I do not allow. however this only gets ride of these type of script tags
[Code]....
View 2 Replies
Feb 18, 2011
Repeater data rendering problem
im using Visual Web Developer Express2005 and language: VB
Example Image of my forum thread that im working:
i encircled in color red the part where i assign the 'content' as you can see above.here EXAMPLE of code in my repeater that populate a <td>(inserting data FROM my database) from my TableField('content')
[Code]....
the part that i encircled in the image above was the data on my tableField named--> 'content'.
The idea was to show not the whole content but to show Only some part of it. example is to show only the 1st 300chars or 100 words.
i tried this code which shows the fist 1-100 chars. [Code]....
Problem is the data i stored in the TableField('content') has other html tagsExample my Tablefield('content') has the following data.
<p class="MsoNormal" style="margin: 0in 0in 0pt"><span style="mso-ansi-language: EN-CA"><span style="font-size: x-small">All hands worked in the preparation..............
When i use the code .tostring.tosubstring(1, 100) it shows: <p class="MsoNormal" style="margin: 0in 0in 0pt"><span style="mso-ansi-language: EN-CA"><span style="font-size: x-small">All hands worked in the preparation..................
instead of starting at: All hands worked in the preparation.......Is there a way that i could extract first the html tags then use the
.string.tosubstring(1, 100) to make it work.I use the code below temporarily to generate the 'content' as showed in the image above. i limit the height of the lable to 100px which does the trick. but i know its not a good method thats why im trying to look for other methods.
<asp:Label runat="server" Height="100PX" Width="615px"><%#DataBinder.Eval(Container.DataItem, "Content")%></asp:Label>
------------------------------------------------------------------------
View 16 Replies
Mar 11, 2011
I am trying to save HTML content in a database. I have it stored properly but when I try to call it and display it on a page using a literal or label control, it does not show the content properly. It will show the text but not any HTML content (i.e. checkboxes, images, hyperlinks, etc)
View 9 Replies
Mar 27, 2010
i'm doing ajax website using PostWebRequest() function, when i call any .aspx page to the target html element the output is coming fine in IE but in FF(FireFox) is coming in html format(html tags) IE output : [URL] FF output : [URL]
javascript functions :
function PostWebRequest(postPage, HTMLTarget, parameter) {
displayElement = $get(HTMLTarget);
displayElement.innerHTML = "<div style='text-align:center;'><br /><br /><br /><br /><br /><img src='images/ajax-loader.gif' algin='center' /></div>";
var wRequest = new Sys.Net.WebRequest();
wRequest.set_url(postPage);
wRequest.set_httpVerb("POST");
var body = parameter;
wRequest.set_body(body);
wRequest.get_headers()["Content-Length"] = body.length;
wRequest.add_completed(onWebRequestCompleted);
wRequest.invoke();
}
function onWebRequestCompleted(executor, eventArgs) {
if (executor.get_responseAvailable()) {
if (document.all) {
displayElement.innerHTML = executor.get_responseData();
}
else {
displayElement.textContent = executor.get_responseData();
}
}
else {
if (executor.get_timeOut()) {
alert("Timed Out");
}
else {
if (executor.get_aborted())
alert("Aborted");
}
}
}
View 1 Replies
Sep 18, 2010
why the ValidateRequest dose not work when html tags had sent by __doPostBack method in javascript.
[Code]....
View 4 Replies
Sep 18, 2010
why the ValidateRequest dose not work when html tags had sent by __doPostBack method in javascript.
<script>
[Code]....
</script>
View 4 Replies
Aug 27, 2010
I have implemented a custom ModelMetadataProvider so that I can decorate my view models with some custom attributes and everything was working fine until I made use of a Partial View. The following code in my view works fine: -
<%: Html.DisplayFor(x => x.Results) %>
Results is a List which renders a custom display template and is also decorated with a custom attribute. Using breakpoints, after the above line and prior to the code within the custom display template, the overridden CreateMetadata method in my custom ModelMetadataProvider is invoked. If I look at the attributes collection parameter I can see that it does contain my custom attribute thus everything working as expected. However, if I replace the above with the following line of code in my view then it breaks: -
<% Html.RenderPartial("ApplicationSearchResults", Model.Results, new ViewDataDictionary()); %>
All the Partial View contains is: -
<%: Html.DisplayFor(x => x) %>
Again using breakpoints, after the above line and prior to the code within the custom display template, the overridden CreateMetadata method in my custom ModelMetadataProvider is invoked. But this time if I look at the attributes collection parameter my custom attribute is not there.
View 4 Replies
Mar 5, 2011
I have a some data which is displayed in div body now i want to import that div content in excel format so how can i do this using javascript/jquery or even c#
View 2 Replies
Feb 17, 2011
I have this code being called
[Code]....
which returns <div>here</div><script language=javascript>alert('');</script> The content gets loaded property, but no alert. How would I get a javascript routine to work from an ajax call along with posting the HTML code?
View 4 Replies
Jun 18, 2012
I have a small issue here. I have a Div inside a TD that is defined like this
Code:
<td >
<div id="divGoogleEarthMap" runat="server" style="display:none"
>
<asp:HiddenField ID="HiddenField1" runat="server" />
<asp:ImageButton ID="GoogleEarthMap" runat="server" Height="100px"
OnClientClick="javascript:showimage('GoogleEarthMap'); return false;"
Width="100px" />
</div>
</td>
now the display style of this div is hidden. so i have a Javascript that runs when i close my popup. the first thing that javascript does is to populate two textboxes and show this div. It populate the textboxes nicely , but it fails to show or unhide the div. i have tried to set of code example using the normal javascript and also JQuery as depicted below
Code:
$('#divGoogleEarthMap').css('display', "block;");
and
Code:
var div = document.getElementById("divGoogleEarthMap");
div.style.display = "block";
or
Code:
document.getElementById('divGoogleEarthMap').style.display = 'block'; but still my Element cant be displayed.
View 2 Replies
Nov 29, 2010
which I am not able to figure out any logical reason behind it. The code given below works perfectly fine in IE 6.
[Code]....
Even the anchor links aShow and aHide works in Firefox (I am using version 3.6.12) but for some weird reason I can't get the button controls to show/hide the divText. The exact problem is when I click the "Show Div" button I can actually see the dvText div for few milli seconds but then it dissappears. Is this a bug in Firefox or am I doing anything wrong I have no idea..
[Code]....
View 7 Replies
Aug 16, 2010
When i click on a button in the repeater, i wanna display an ajax modal popup using jquery. I am trying to do that, but its not getting displayed.
View 1 Replies
Oct 24, 2010
I have to break a HTML content string in to multiple lines. And each line should have some fixed characters, 50 or 60 Also I don't want to break the word..or html tags...
ex : <p>Email: <a href="mailto:someone@gmail.com">someone@gmail.com</a></p>
<p><em>"Text goes <font color=red>Hello world</font> Text goes here and Text goes here Text goes here 1976."</em> </p>
How can I acheive this in C#?
View 1 Replies
Apr 10, 2014
i have 4 comboxes (com1, com2, com3,com4) and 4 tables (tab1, tab2, tab3, tab4)com1 and tab 1 have master table relationships i.e when in com1 the name is entered tab 1 shows the result of that entry. the same is for the rest comboxes and tables.
Now what i am trying to do is when an user clickes on com1 and types the name of the employee tab2 tab 3 and tab 4 should be hidden. if com2 is clicked tab1 and tab3, ta4 shoud be hidden.etc
Currenty i am using this code which i do not like. Is there any easy and short way to do hide an show.
this is the code i am using
<script type="text/javascript">
$("#com1").on('click', function () {
$("#div1").fadeIn();
[Code]....
View 1 Replies
Jul 13, 2010
I have a hidden asp.net MVC control in the form:
<%= Html.HiddenFor(m => m.NodeId) %>
my JavaScript / jQuery code:
var DeleteEntireItem = '<% = btnDeleteEntireMenu.ClientID%>';
var Node;
debugger;
$('#' + DeleteEntireItem).click(function () {
Node = NodeValue;
document.forms[0].submit();
});
How can I assign the value of variable 'Node' to the asp.net MVC hidden control?
View 1 Replies
Feb 14, 2011
I have a dynamic page which has repeating input text fields and is build using Jquery. I use C#.net to get the data to be displayed on the input fields. My question is on how do I handle single Quotes and double quotes while rendering the input field. I create jquery string on page render and uses that to render the input fields on the page. But if any of the input fields contains a html tag with double quotes then it screws up the whole page. Let me know I this make sense or need more explanation.
View 1 Replies
Jun 11, 2010
I've made an ASP.NET web form that uses the standard ASP.NET validation. I'd like to make the error summary show up in a jQuery UI Modal Message as well as below the actual form.Is it possible to execute the script if the validation finds an error?
View 4 Replies
Aug 17, 2010
I've got UpdatePanel with Div
<telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1">
<div class="pnlFind" style="display:none;">
</div>
</telerik:RadAjaxPanel>
wanna use js for showing this div
[code]....
but after partial postback, I got div invisible again(right! restore DOM) How can I remember that div should be always visible after button click.
View 1 Replies
