asp.net-mvc


How can I make an unordered list appear within a foreach loop in MVC3 Razor?


I have the following code:
#foreach (Content topic in Model.Topics)
{
if (topic.RowKey.Substring(2, 2) == "00")
{
<h3>#topic.RowKey.Substring(0, 2).TrimStart('0') - #Html.Raw(topic.Title)</h3>
}
else
{
<p>#String.Format("{0}.{1}",topic.RowKey.Substring(0, 2).TrimStart('0'),topic.RowKey.Substring(2, 2).TrimStart('0').PadLeft(1, '0')) - #Html.Raw(topic.Title)</p>
}
}
My input data (value of topic.RowKey) looks like this:
0100 <- This is topic 1
0101 <- This is topic 1.1
0102 <- This is topic 1.2
0103 <- This is topic 1.3
0200 <- This is topic 2
0201 <- This is topic 2.1
etc....
This works but what I would really like to do is to have an h3 heading every time the first two digits of the RowKey change and then between then and then next h3 heading I would like to have an unordered list instead of just <p>xxx</p>. I have tried lots of different combinations of things but nothing works. Is this even possible to do with Razor? Where I had huge problems was how can I get the <ul> and </ul>s to appear correctly? I know I can put a <ul> after the <h3> but how can I place the </ul>?
not checked in razor, there may be an # missing here or there, but...
#var groupedTopics = Model.Topics.GroupBy(t => t.RowKey.Substring(0, 2));
#foreach (var group in groupedTopics) {
var firstTopic = group.First();
<h3>#firstTopic.RowKey.Substring(0, 2).TrimStart('0') - #Html.row(firstTopic.Title)</h3>
<ul>
#foreach (var topic in group.Skip(1)) {
<li>#String.Format("{0}.{1}",topic.RowKey.Substring(0, 2).TrimStart('0'),topic.RowKey.Substring(2, 2).TrimStart('0').PadLeft(1, '0')) - #Html.Raw(topic.Title)</li>
}
</ul>
}
It would be more easy create a model parent-child, populated before send it to the view
the model
public class topic {
//everything else
public List<topic> subtopic{ get; set; }
}
the view
#foreach (Content topic in Model.Topics)
{
<h3>#topic.RowKey.Substring(0, 2).TrimStart('0') - #Html.Raw(topic.Title)</h3>
if (topic.subtopic.count > 0)
{
<ul>
#foreach (Content subtopic in topic.subtopic)
{
<li>#String.Format("{0}.{1}", topic.RowKey.Substring(0, 2).TrimStart('0'), topic.RowKey.Substring(2, 2).TrimStart('0').PadLeft(1, '0')) - #Html.Raw(topic.Title)</li>
}
</ul>
}
}
Its not about razor, this is something you can solve with any rendering enginge, web or windows forms or anything else.
#model List<Topic>
#{
int currentKey = 0;
bool withinUL = false;
foreach (Topic topic in Model)
{
if (topic.RowKey != currentKey)
{
currentKey = topic.RowKey;
if (withinUL)
{
withinUL = false;
#:</ul>
}
#:<h3>#topic.RowKey - #Html.Raw(topic.Title)</h3>
}
else
{
if (!withinUL)
{
withinUL = true;
#:<ul></ul>
}
#:<li>#topic.RowKey - #Html.Raw(topic.Title)</li>
}
}
}
#{bool isFirst = true;}
#foreach (Content topic in Model.Topics)
{
if (topic.RowKey.Substring(2, 2) == "00")
{
if(!isFirst) {
<text></ul></text>
isFirst = false
}
<h3>#topic.RowKey.Substring(0, 2).TrimStart('0') - #Html.Raw(topic.Title)</h3>
}
else
{
<li>
<p>#String.Format("{0}.{1}",topic.RowKey.Substring(0, 2).TrimStart('0'),topic.RowKey.Substring(2, 2).TrimStart('0').PadLeft(1, '0')) - #Html.Raw(topic.Title)</p></li>
}
}
</ul>

Related Links

set textarea text from ViewData asp.net mvc
Azure download blob filestream/memorystream
Bootstrap 3.1.1 less in ASP.NET MVC 5 have error with EnableOptimizations in true
simple membership provider with active directory
Lambda expression for getting a table row and update the row in database
How to call a HttpPost method from Controller in ASP.net MVC 4?
How do you escape a '#' symbol within in a url with razor
ASP MVC5 list/edit/view users
anchor tag in MVC partial view doesnt work as expected
OData filter not working for my Web API (mvc 4 stack)
Getting User in web api controller using Asp.net Identity 2 - User not autheticated
ASP.NET MVC action does not recognise post json data
ASP.Net MVC Partial View Model Binding
Ignoring long running threads in New Relic
Using dotConnect with MVC5 Razor
Azure Storage api doesn't work for asnyc uploads

Categories

HOME
wix
whatsapp
music
servlets
anylogic
wxpython
runtime-error
redhat
antlr
android-sms
spi
c++14
webdriver-io
plotly
windows-10-desktop
proftpd
executable
command-line-arguments
oracle-agile-plm
condor
apex
afnetworking-2
watchservice
amadeus
eigen3
teraterm
drupal-commerce
beanstalkd
dotnetbar
wso2cep
burp
background-subtraction
php-carbon
structure
desktop-app-converter
x-sendfile
opensuse
skyscanner
imagemapster
rights-management
flags
psychopy
essbase
gradle-tooling-api
hostname
wp-api
log4perl
ms-jet-ace
clientscript
arm7
jasmine2.0
ammonite
billing
easyhook
tfs2008
sqlfiddle
webclient-download
finalcut
submission
angularjs-filter
groupbox
gcloud-java
pakyow
balana
skrollr
egl
php-opencloud
wand
hjson
chunk-templates
avalonedit
treegrid
alienvault
google-swiffy
fastparse
vendor
cvs2git
iphone-privateapi
before-save
directcompute
email-spam
ituneslibrary
hebrew
android-lru-cache
libavcodec
freemind
nsimageview
memoization
sparc
progressdialog
northwind
memento
sender
vote
guvnor
calloc
code-structure
tipsy
quilt
websolr
android-assets
facebook-authentication
directoryentry
pong
etrade-api
cluetip
jboss-cache
custom-protocol
network-scan
code-statistics
user-testing

Resources

Mobile Apps Dev
Database Users
javascript
java
csharp
php
android
MS Developer
developer works
python
ios
c
html
jquery
RDBMS discuss
Cloud Virtualization
Database Dev&Adm
javascript
java
csharp
php
python
android
jquery
ruby
ios
html
Mobile App
Mobile App
Mobile App