creating dynamic id for divs in MVC with Razor… with a twist

问题

The twist being, all answers that I found on the topic simply do not seem to work. I tried just about all formattings I found in answers to this question and made a few desperate attempts on my own, but none of them have any effect. It's almost as if razor wasn't there, but other razor synthax in the same cshtml file executes without trouble. As most of the time, the div is declared in a loop and its name should be appended by i. Here's some things I tried, not in the order I tried them in. The order can be deduced by the decreasing sanity of the synthax:

<div id="accord@(i)">

<div id="@("accord" + i)>

<div id="@{@("accord" + i)}">

with:

string fName = "accord" + i;        //fName is filled correctly, that much I could verify

I tried some things:

<div id=@fName>

<div id="@fName">

<div id="@(fName)">

<div id="@{fName}">

<div id=@(fName)>

<div id="@{@fName}">

<div id=@{@fName}>

I also tried several combinations of the two approaches, like for example

string fName = "accord";
<div id="@(fName + i)">

aso...

All of these attempts have not yielded any results... the id of the div is ALWAYS #Literaly_Whatever_Comes_after_=

So... can anybody venture a guess at what I'm doing wrong?

In the interest of completion, since you never know what might be involved, here's the entire loop. It doesn't have any actual logic in it, that comes after I made the concept work:

<div id="yearaccord">

    @for (int i = 0; i < 4; ++i)
    {
        //add a nested months accordion for every year
        <h3>i = @i</h3>
        string fName = "accord" + i;
        <div id="@{@fName}">

            @for (int j = 0; j < 4; ++j)
            {
                //add an accordion displaying the blog titles for each month
                <h3>j = @j</h3>
                <div>
                    @for (int w = 0; w < 6; ++w)
                    {
                        //add blog titles
                        <h4>JabbadaJba @w</h4>
                    }
                </div>
            }
        </div>
    }
</div>

Note that ALL other razor synthax in this loop behaves the way I expected it to... only when it's used as an id, things go wonky.

回答1:

string fName = "accord" + i; is interpreted as ordinary HTML when between HTML nodes. Move it up right after the @for or wrap it in @{ //.. }

@for (var i = 0; i < 10; i++) {

    var fName = "accord" + i;

    <h3>i = @i</h3>
    <div id="@{@fName}">
        //..
    </div>
}

@for (int i = 0; i < 4; ++i)
{
    //add a nested months accordion for every year
    <h3>i = @i</h3>
    @{
        string fName = "accord" + i;
    }
    <div id="@fName">
        //..
    </div>
}

回答2:

Ok, got it figured out... The problem was that I was only very convinced that it didn't work, while it actually worked. The result didn't look as expected, but that's not what convinced me that it didn't work. But I always checked the id of the div in the debugger inside visual studio... turns out that visual studio does not show the actual name of the div, but the uninterpreted code with which it was declared. The id when I examined the element in the browser was correct, in the end.

Only that I'm pretty new to this whole web-thing, exclusively working with C++ (non .NET) before now, so I don't yet know where all the things are and how they behave... it's part of the learning process I guess.

Thanks for the answers. They all worked once I knew where to look if they work.

@dawidr: Your line was missing a closing bracket, so that's what produced the error. I noticed it once I took a closer look at it ;)

回答3:

I do have same problem, and I found a solutions, In my case, not only I want to populate the attributes in my single page, but also want to pass a definite value to my partial view so that I may able to re-use it.

Warning: My codes looks awful, i'm still finding my way out to improve it.

  @{ ViewData["suffix"] = "RF"; }
  <div @{ViewData["myId"] = "foo" + ViewData["suffix"];}
     id=@ViewData["myId"]></div>

Now, before I call a partial view, I update the ViewData["suffix"] in order to ensure that all my replicated partial view has a unique id. Calling the partialView it would be

  <div id="partialView1">@{Html.RenderPartial("_partialView", ViewData);}</div>

I'm leaving this code, just in case someone needed it. cheers!

回答4:

string strDynamicId= "fuFileUpload_" + @item.FeildID;

<input type="file" accept=".pdf" name=@strDynamicId id=@strDynamicId />

This worked for me you should try this

来源：https://stackoverflow.com/questions/27819425/creating-dynamic-id-for-divs-in-mvc-with-razor-with-a-twist

标签

asp.net-mvc

razorengine