Question

I have a model inside a strongly typed view but I would like there to be a select button which brings up a modal for each item, the problem is how do I use razor inside my modal definition so each modal is called myModal1, myModal2 etc each for the customer name:

<a class="btn" data-toggle="modal" href="#myModal">Select</a>
            <div class="modal hide" id="myModal">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">×</button>
                    <h3>Customer Options</h3>
                </div>
                <div class="modal-body">
                    <p>
                        @Html.ActionLink("Edit", "Edit", New With {.id = currentItem.CustomerId}) |
                        @Html.ActionLink("Details", "Details", New With {.id = currentItem.CustomerId})
                        |
                        @Html.ActionLink("Delete", "Delete", New With {.id = currentItem.CustomerId}) |
                        @Html.ActionLink("Book Job", "Create", "Job", New With {.id = currentItem.CustomerId}, Nothing)
                        |
                        @Html.ActionLink("Jobs", "ShowCustomerJobs", "Job", New With {.id = currentItem.CustomerId}, Nothing)
                        |
                        @Html.ActionLink("Bills", "BillsForCustomer", "Bill", New With {.id = currentItem.CustomerId}, Nothing)
                        |
                        @Html.ActionLink("Send Message", "SendCustomerMessage", "SendMessage", New With {.id = currentItem.CustomerId}, Nothing)
                        |
                        @Html.ActionLink("Record Payment", "RecordPayment", "Payment", New With {.id = currentItem.CustomerId}, Nothing)
                    </p>
                </div>
                <div class="modal-footer">
                    <a href="#" class="btn" data-dismiss="modal">Close</a>
                </div>
            </div>

Basically something along the lines of this (which does not work):

 <a class="btn" data-toggle="modal" href="#[e-mail]">Select</a>
            <div class="modal hide" id="[e-mail]">

I am not sure what the correct definition is in Razor to call Razor inside id and href definitions

Answer 1

Just add brackets ( ) @(currentItem.CustomerId)

<a class="btn" data-toggle="modal" href="#myModal@(currentItem.CustomerId)">Select</a>
        <div class="modal hide" id="myModal@(currentItem.CustomerId)">