MVC Html ActionLink with Twitter Bootstrap doesn't work with html attributes for javascript integration

Question

I'm developing an application framework using the "Twitter Bootstrap for MVC" by Eric Hexter et al.

I'm having one minor problem with the default html.actionlink behaviour in the shared Index page that uses a foreach loop to provide a list from the anonymous model sent to the view.

I'm trying to add an html attribute for an "id" which will call a javascript modal when deleting a row of data.

If I try to add attributes the routevalues variable is rendered as a string. I've tried with an IDictionary for the html attributes but the result is similar.

Creating an actionlink outside of the foreach loop has the javascript working as expected.

Code (snippet) last line is where the error/confusion occurs:

@using BootstrapSupport
@model System.Collections.IEnumerable   
    <h4>@Model.GetLabel() <small>Listing</small></h4>
<table class="table table-striped">
    <caption></caption>
    <thead>
        <tr>
            @foreach (var property in Model.VisibleProperties())
            {
                <th>
                    @property.GetLabel()
                </th>
            }
            <th></th>
        </tr>
    </thead>
    @{ int index = 0; }
    @foreach (var model in Model)
    {
        ViewData[index.ToString()] = model;
        <tr>
            @foreach (var property in model.VisibleProperties())
            {
                <td>
                    @Html.Display(index + "." + property.Name)
                </td>                    
            }
            <td>
                <div class="btn-group">
                    <a class="btn dropdown-toggle" data-toggle="dropdown" href="#">
                        Action
                        <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                        @{
                            @Html.TryPartial("_actions", model)                            
                            var routevalues = model.GetIdValue();  
                            <li>@Html.ActionLink("Edit", "Edit", routevalues)</li>
                            <li>@Html.ActionLink("Details", "Details", routevalues)</li>
                            <li class="divider"></li>
                            <li>@Html.ActionLink("Delete", "Delete", routevalues, new { id = "mylink" })</li>

Expected result:

<li><a href="/Film/Delete/1" id="mylink">Delete</a></li>

Actual result:

<li><a href="/Film/Delete?Count=1&amp;Keys=System.Collections.Generic.Dictionary%602%2BKeyCollection%5BSystem.String%2CSystem.Object%5D&amp;Values=System.Collections.Generic.Dictionary%602%2BValueCollection%5BSystem.String%2CSystem.Object%5D" id="mylink">Delete</a></li>

I get a slightly different but similar result when I try it with an IDictionary (which assumes the routevalues returns a RouteValueDictionary)

---edit in response to Satpal----

                    <li><a Comparer="System.Collections.Generic.GenericEqualityComparer`1[System.String]" Count="1" Keys="System.Collections.Generic.Dictionary`2+KeyCollection[System.String,System.String]" Values="System.Collections.Generic.Dictionary`2+ValueCollection[System.String,System.String]" href="/Film/Delete?Count=1&amp;Keys=System.Collections.Generic.Dictionary%602%2BKeyCollection%5BSystem.String%2CSystem.Object%5D&amp;Values=System.Collections.Generic.Dictionary%602%2BValueCollection%5BSystem.String%2CSystem.Object%5D">Delete</a></li>

Is there any way I can get the expected result without re-writing chunks of the code behind Eric Hexter's MVC Twitter Bootsrap mod?

As per Satpal's help, the line of code that works is as follows:

<li>@Html.ActionLink("Delete", "Edit", new RouteValueDictionary(routevalues), new Dictionary<string, object> { { "id", "mylink" } })</li>

Answer 1

Try to use initializer syntax to pass HTML Attributes as Dictionary

@Html.ActionLink("Delete", "Delete",  routevalues, 
  new  Dictionary<string, object>{
  { "id", "mylink" }
  }
 )

As per LinkExtensions.ActionLink there is no overload for

ActionLink(HtmlHelper, String, String, RouteValueDictionary, Object)

Thus you have to use oveload

ActionLink(HtmlHelper, String, String, RouteValueDictionary, IDictionary<String, Object>)