Using in Visual Studio 10 ASP.NET MVC3 - asp.net-mvc-3

I am using Visual Studio 2010 Professional edition for developing an application in ASP.NET MVC3 framework.
I have come across a situation where I need to have a literal space character, usually accomplished by adding (something similar) in HTML.
However, program gives a run-time error.
How do I overcome this?
Code:
<div class="week">
#for (int i = 0; i < 7; i++)
{
<div class="day">
#weekStartDay.ToString().Substring(0, 3)
</div>
weekStartDay = (DayOfWeek)(((int)weekStartDay + 1) % 7);
}
</div>
Error:
c:***\Documents\Visual Studio 2010\Projects\MvcApplication2\MvcApplication2\Views\Home\Calendar.cshtml(22): error CS0201: Only assignment, call, increment, decrement, and new object expressions can be used as a statement

Change your code to
<div class="week">
#for (int i = 0; i < 7; i++)
{
<div class="day">
#weekStartDay.ToString().Substring(0, 3)
</div>
#:
weekStartDay = (DayOfWeek)(((int)weekStartDay + 1) % 7);
}
</div>
#: tells the Razor view engine is plain text

If you look at this code in Visual Studio 2012 you will see the exact same error message. The is underlined and the tooltip shows this message.
The problem is that you are inside a code block: #{ }. If you want to output plain text you have to wrap it inside an HTML element like this:
<span> </span>
or you have to use
#:

simply use add #: before &nbsp

for every list item in your dropdown list you have to replace your list item value by .Replace(" ", "\u00A0")
eg:
in your controller
var Listval =(from u in yourtablename select u.YourColumnName.Replace(" ", "\u00A0")).Distinct().ToList();
ViewBag.DDlVals= new SelectList(Listval);
in your View page
#Html.DropDownListFor(model => model.YourColumnName, (SelectList)ViewBag.DDlVals, "--Select--", new { #class = "form-control" })

Related

Razor (.cshtml) editor code block format settings

I am running Visual Studio 16.8.1, when editing a Razor .cshtml file and applying a reformat (CTRL+K+D) the editor moves braces and elements in a code block starting with #
For example if I have the code:
#{
Layout = "_Layout";
ViewData["Title"] = "My Page";
}
#if (Model.ShowRequestId)
{
<p>
<strong>Request ID:</strong> <code>#Model.RequestId</code>
</p>
}
And I reformat the file by pressing CTRL+K+D it will move the fist line to the same line as the #{ and move the closing brace right after the last element like:
#{ Layout = "_Layout";
ViewData["Title"] = "My Page"; }
#if (Model.ShowRequestId)
{
<p>
<strong>Request ID:</strong> <code>#Model.RequestId</code>
</p>}
Is there a way to control when VS inserts or removes new lines and indenting before and after the braces so it formats like the first example? I have searched through the Options->Text Editor->{editor}->Formatting groups and can't find anything that seems to control this behavior, is this a bug in the VS editor or am I just missing the setting somewhere?
This looks like it was fixed in Visual Studio Version 16.8.2

Javascript generating anchors quote issue

I'm new to this site and new to Javascript, however I'm been coding in C for some years, and I ran into a problem that totally blows my mind.
I want to make a tool for myself (a very simple code generating tool). I want to generate html code and in a displayable manner, because the final product would be a static page (no javascript). So I tried to solve it with basic string manipulation.
The task and the code is so simple I'll just post it here.
Javascript with it's corresponding tags:
<script>
function ConvertListToGallery()
{
var cont = document.getElementById("gallery_generator_input");
var eof_link;
var eof_title;
var eof_descr;
var lines = [];
var tokens = [];
var i, k;
var result = document.getElementById("gallery_generator_output");
var link;
var lofasz = [];
if(cont)
{
lines = cont.value.split('\n');
lofasz = cont.value.split('"');
console.log(lofasz[0]);
result.innerHTML = "";
for( i = 0; i < lines.length; i++ )
{
tokens = lines[i].split(" + ");
for( k = 0; k < tokens.length; k++ )
{ console.log(tokens[k]); }
link = tokens[0];
result.innerHTML += '<img src=' + link + '/>';
}
document.getElementById("gallery_generator_result").value=result.innerHTML;
document.getElementById("gallery_convert").innerHTML = "Done!";
document.getElementById("gallery_convert").onclick = "";
}
}
</script>
The input:
https://drive.google.com/uc?id=0B3ju3vX1o4OuY0RaaDJKWnlRN1U + title +
desc https://drive.google.com/uc?id=0B3ju3vX1o4OuSC1hNFQwUV9IWlE +
title2 + desc2
And the output after running the script:
<img src="https://drive.google.com/uc?id=0B3ju3vX1o4OuY0RaaDJKWnlRN1U/"><img src="https://drive.google.com/uc?id=0B3ju3vX1o4OuSC1hNFQwUV9IWlE/">
It's like something automatically put quotes around the links. Sorry, I have tried so many things I can't remember now, but as I remember this "auto-quoting" thing only happens with links and it causes all sorts of problem in the resulting code (for example the '/' slips inside the quotes). And all other problems were caused by this behavior (I can't assign title and other attributes inside the img tag).
Additional html:
<form>
<textarea id="gallery_generator_input" style = "width:800px;"></textarea></form>
<div id="gallery_generator_output" style="border:solid; max-height:500px; overflow:auto;">
</div>
<textarea id="gallery_generator_result" style = "width:800px;"></textarea>
<div onclick = "ConvertListToGallery();" id="gallery_convert">Convert!</div>
Thank you for any hints in advance!
EDIT: removed the misleading WOW thing.
The desired result is simply a valid html image code.
Change this line
result.innerHTML += '<img src=' + link + '!!WOW>';
to this
result.innerHTML += '<img src="' + link + '!!WOW"/>';
also you can urlencode the exclamation marks if they are a problem:
result.innerHTML += '<img src="' + link + '%21%21WOW"/>';
Sorry for the late follow-up, but it turned out that writing to the innerHMTL caused the issue (I'm still not sure if writing to innerHTML has some kind of obscure code fixing/completion feature). If I accumulate the HTML in a separate variable THEN assign it to the innerHTML has no issues.
I know that it's not the best practice to make dynamic code like that (the elements don't get added to the DOM tree), but for my use it's simpler to make the code this way, since it's only a tool for me to generate static pages.

document.querySelectorAll("span + a") didn't work?

I have a HTML like this.
<span class="vm-video-side-notification-text-item">
Includes copyrighted content
</span>
I use
var x = document.querySelectorAll("span + a");
alert(x.length);
the alert is "0"... I don't know why.
I see the w3school says
element+element
div + p
Selects all <p> elements that are placed immediately after <div> elements
so I try span + a. Can anyone correct my mistake?
You're conflating elements with tags.
While the start tag of the a is directly after the start tag of the span indeed, the a element is inside the span element.
So, in order for your example to work, you can either
change the query selector to "span > a" for "any a directly inside a span"
var x = document.querySelectorAll("span > a");
alert(x.length);
or change the html to have the a element after the span element
<span class="vm-video-side-notification-text-item">
</span>
Includes copyrighted content
(... but not both!)

Reading text using selenium webdriver(xpath)

I'm using selenium to get some text on my webpage using xpath.
The page tag structure is as follows -
<span id="data" class="firefinder-match">
Seat Height, Laden
<sup>
<a class="speckeyfootnote" rel="p7" href="#">7</a>
</sup>
</span>
If I use the following code -
driver.findElement(By.xpath("//span[#id='data']")).getText();
I get the result = Seat Height, Laden 7
But I want to avoid reading the text within the <sup> tags and get the
result Seat Height, Laden
Please let me know which xpath expression I can use to get my desired result.
I don't know about any way to do this in Selenium, so there's my JS solution. The idea is to get all children of the element (including the text nodes) and then select only the text nodes. You might need to add some .trim() (or JS equivalent) calls to get rid of unneeded spaces.
The whole code:
WebElement elem = driver.findElement(By.id("data"));
String text;
if (driver instanceof JavascriptExecutor) {
text = ((JavascriptExecutor)driver).executeScript(
"var nodes = arguments[0].childNodes;" +
"var text = '';" +
"for (var i = 0; i < nodes.length; i++) {" +
" if (nodes[i].nodeType == Node.TEXT_NODE) {" +
" text += nodes[i].textContent;" +
" }" +
"}" +
"return text;"
, elem);
}
And just the JS for better readability.
var nodes = arguments[0].childNodes;
var text = '';
for (var i = 0; i < nodes.length; i++) {
if (nodes[i].nodeType == Node.TEXT_NODE) {
text += nodes[i].textContent;
}
}
return text;

Accordion menus & innerHTML

I've been using a shareware JS accordion-style sidebar (www.dynamicdrive.com/dynamicindex1/slashdot.htm). It's been working beautifully with PHP-based HTML, but is not working with AJAX.
The sidebar builds itself on <div>,<span>and<a> elements. Here is a section of the JS code:
for (var i = 0; i < this.submenus.length; i++)
this.submenus[i].getElementsByTagName("span")[0].onclick = function() {
mainInstance.toggleMenu(this.parentNode);
};
If I use hardcoded HTML like the following (or construct the same with PHP), it works fine:
<div id="navbar_side" class="sdmenu">
<div><span>STUDENTS</span><a>Adding Students</a><a>Deleting Students</a></div>
</div>
However, if I start with:
<div id="navbar_side" class="sdmenu"></div>
and then use this:
document.getElementById("navbar_side").innerHTML="<div><span>STUDENTS</span><a>Adding Students</a><a>Deleting Students</a></div>";
the menu doesn't slide. The info is all there. The <a hrefs> all work (which I've left out here). But the accordion movement doesn't - well... - move!
Why is this? Clearly the menu is not reading the AJAX-constructed node tree the same way as the PHP-constructed one.
Thanks,
Nick
Recommend you to start over your work by using jQuery UI - Accordion. Much cleaner & effective.

Resources