從actionlink獲取屬性jquery

Question

如何從actionlink獲取屬性到jquery？

@Html.ActionLink("Edit contact", "Edit", "Contact", new { Area = "Customers", contactId = -1 }, new { @id="EditContact", @class = "btn btn-info" }) 

我希望在按下聯繫人時動態更新contactId。

$(document).on('click', '#contacts .list-group-item', function(e) { 
     var id = (this.id); 
     var elem = $('#EditContact'); 
     var newUrl = elem.prop('href').replace('-1', id); 
     elem.prop('href', newUrl); 
    }); 

此代碼的工作原理，但只是一次，因爲-1的變化。所以我需要收集contactId並將其保存爲一個變量。

$(document).on('click', '#contacts .list-group-item', function(e) { 
       var id = (this.id); 
       var elem = $('#EditContact'); 
       var oldId = elem.attr('contactId'); 
       var newUrl = elem.prop('href').replace('oldId', id); 
       elem.prop('href', newUrl); 
    }); 

我試過這個，但是oldId是未定義的。我如何收集contactId？

Answer 1

你可以做的是，不是保留-1作爲路由值，而是生成沒有路由值的鏈路。所以它將只是基礎url（沒有contactId的查詢字符串）。點擊鏈接後，您可以使用此基礎網址並追加該ID並生成新網址並導航至該網址。

@Html.ActionLink("Edit contact", "Edit", "Contact", new { Area = "Customers" }, 
             new { @id="EditContact", @class = "btn btn-info" }) 

而在點擊事件中，請確保阻止默認的點擊事件行爲。

$(function() { 

    $(document).on('click', '.list-group-item', function (e) { 
     e.preventDefault(); 
     var id = (this.id); 
     var newUrl = $('#EditContact').attr("href") + '?contactId=' + id; 
     window.location.href = newUrl; 
    });  

}); 

另一個更好的解決方案是，當你建立與類環「列表組項目」的項目，你可以添加URL中的數據屬性。

例如

@foreach(var item in SomeCollection) 
{ 
    <div class="list-group-item" data-url="@Url.Action("Edit", "Contact", 
              new { Area = "Customers" ,contactId=item .Id})"> 
     Some Name of the Item in the loop 
    </div> 
} 

，現在，這個被點擊時，讀取URL數據屬性，並使用該導航。

$(function() { 

    $(document).on('click', '.list-group-item', function (e) { 
     e.preventDefault();   
     window.location.href = $(this).data("url"); 
    });  

});