How to handle Html tags in string - when displayed in MVC page - asp.net-mvc-4

So I'm retrieving data from the Rally web service and the description field contains html tags.
My MVC page looks like this:
<table width="100%" id="stories">
<tr>
<td>ID</td>
<td>Name</td>
<td>Description</td>
<td>TaskEstimateTotal</td>
</tr>
#foreach (var story in Model.UserStories)
{
<tr>
<td>#story["FormattedID"]</td>
<td>#story["Name"]</td>
<td>#story["Description"]</td>
<td>#story["TaskEstimateTotal"]</td>
</tr>
}
</table>
The html tags appear as text
eg:
<DIV>As a Marketing Analytics And Data Manager</DIV>
I've tried encoding and decoding it but neither of those are producing the desired response. Encoding it will convert the < into < type text.
<td>#HttpUtility.HtmlEncode(story["Description"])</td>
Hopefully it's just something simple I've missed!
Unless I should be stripping out the tags?

Have you tried:
<td>#Html.Raw(story["Description"])</td>
MSDN: http://msdn.microsoft.com/en-us/library/gg480740(v=vs.98).aspx

You can do:
<td>#Html.Raw(story["Description"])</td>
Razor html encodes strings by default.

Related

Showing a substring of text that contains HTML

I am implementing something similar to a blog engine, where on the entry page I would like to see a listing of my posts, and, for each, its title and a short piece of its body content.
This body content is HTML, and is stored in the database as a string, so, it's not enough to just show a substring of it, because it might break the HTML structure.
I guess the algorithm would be: render the string to HTML and extract only the first X characters of it.
Is there any solution for this problem?
Here is a working demo like below:
View:
#model IEnumerable<Post>
<table class="table">
<thead>
<tr>
<th>
#Html.DisplayNameFor(model => model.Title)
</th>
<th>
#Html.DisplayNameFor(model => model.Body)
</th>
</tr>
</thead>
<tbody>
#foreach (var item in Model)
{
<tr>
<td>
#Html.DisplayFor(modelItem => item.Title)
</td>
<td>
#Html.DisplayFor(modelItem => item.Body)
</td>
</tr>
}
</tbody>
</table>
Controller:
public IActionResult Test()
{
var model = new List<Post>()
{
new Post(){ Title="asp.net core mvc",Body="<html><div><h1>The Model-View-Controller (MVC) architectural pattern separates an application into three main groups of components: Models, Views, and Controllers. This pattern helps to achieve separation of concerns. Using this pattern, user requests are routed to a Controller which is responsible for working with the Model to perform user actions and/or retrieve results of queries. </h1></div></html>"},
new Post(){Title="asp.net core razor pages",Body="<html><div>Razor Pages is designed to make common patterns used with web browsers easy to implement when building an app. Model binding, Tag Helpers, and HTML helpers all just work with the properties defined in a Razor Page class.</div></html>"}
};
foreach(var item in model)
{
item.Body= Regex.Replace(item.Body, #"<[^>]+>| ", String.Empty);
item.Body= item.Body.AsSpan(0, 30).ToString()+"...";
}
return View(model);
}
Result:

Headers in column using dojo

Is there a way to bring headers in the column and on click of the header, the attributes associated with the header in a different column using Dojo?
Thanks
Kumar
you can use the event onHeaderCellClick
onHeaderCellClick: function()
{
console.log("do what you want");
}
to add the header, you can do it easily in declarative way like this:
<table data-dojo-type="dojox.grid.DataGrid">
<thead>
<tr>
<th field="fieldName" width="200px">Column Header</th>
</tr>
</thead>
</table>
If you are using declarative way you can use the attribute onHeaderCellClick to your table, onHeaderCellClick="func" call function func().

Web Automation - How do I input text into a rich text box on a website (textarea) defined by a class?

I have been trying this for a few days and am completely stuck. If anybody could help me out I would be very grateful; Im using VB.NET.
The HTML Code:
<tbody>
<tr>
<td class="chat-attachment-cell"></td>
<td class="chat-input-cell">
<textarea class="chat-message-input"></textarea>
</td>
<td class="chat-send-cell"><a href="#" class="chat-send-button"> alt="Send" width="66" height="66" border="0">
</a>
</td>
</tr>
</tbody>
The text box I need to input into is this bit
<textarea class="chat-message-input"></textarea>
Thankyou in advance for any help provided
You select the element then change the .innertext property with what you want.
There are multiple ways to do it, and I can't give you an example because I don't know what you are using nor the whole html, but for example it could look like this:
WebBrowser1.Document.GetElementById("someid").InnerText="Sometext"
For start, you can try looking how the collection of elements you get looks, then you should be able to figure out what to do next.
Dim test = WebBrowser1.Document.GetElementsByTagName("textarea")
For example on this page:
Dim test = WebBrowser1.Document.GetElementsByTagName("tbody")
test(1).InnerText = "Hi there"

Server Side datatable crashes on processing

I have the following code:
<script type="text/javascript">
$(document).ready(function(){
$('#browseListings').DataTable({
"processing":"true",
"serverSide":"true",
"ajax":"http://localhost//htdocs/index.php/admin/ajaxbrowse"
});
});
</script>
<table border="0" cellpadding="2" cellspacing="1" class="datable_table display" id="browseListings">
<thead>
<tr>
<th>Company Name</th><th>Country</th><th>Listing Type</th> <th>Actions</th></tr>
</thead>
</table>
On the page load it correctly gives me the first 10 entries however when I pagniate it just hangs on "Processing". I know it returns data from the console in the same format as the first page so have I missed something? From the manual it doesn't look like you have to set Columns - it should just simply work??
Ok the issue here was that draw needs to increase and I had hard coded it to 1! I was using my own custom server side script and had included draw but not set it to match the inbound (although have cast as int as suggested).

Use Greasemonkey to remove table

I am trying to replace a table with my own table using grease monkey. The page that has the table has 2 tables with the same class and no IDs.
I need to replace only the second table (with my own table) and do nothing to the first table. There is nothing that really makes the second table unique from the first table, so the only thing I can think of is trying to add a DIV around the second table, but cant figure it out.
Any ideas? Heres the page code:
<h3>Table 1</h3>
<table class="details" border="1" cellpadding="0" cellspacing="0">
<tbody><tr>
<th>1</th>
<td>2</td>
</tr>
</tbody></table>
<h3>Table 2</h3>
<table class="details" border="1">
<tbody><tr>
<th>1</th>
<td>2</td>
</tr><tr>
<th>3</th>
<td>4</td>
</tr>
</tbody></table>
You can use xpath to find the second tables, and do something with it. The xpath expression would be (//table[#class="details"])[2]. Below I added an example which uses (//pre)[1] instead, this will find the first code block on this page, I will hide it as an example. So this hides the page code from your question. (//pre)[2] will hide my script.
See Also here for a tutorial how to use xpath.
// ==UserScript==
// #name so-test
// #namespace test
// #include http://stackoverflow.com/questions/4635696/use-greasemonkey-to-remove-table
// ==/UserScript==
// find first <pre> on this page
var xpathResult = document.evaluate('(//pre)[1]', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null);
var node=xpathResult.singleNodeValue;
// now hide it :)
node.style.display='none';