如何使HTML助手方法fire eveytime部分視圖呈現

我有一個視圖（用於創建配方），我動態添加了部分視圖（表示產品）。可以有幾種產品添加到配方中。局部視圖按鈕點擊添加，使用jQuery，並能正常工作：如何使HTML助手方法fire eveytime部分視圖呈現

$('.loadPartial').on('click', function (evt) { 
    evt.preventDefault(); 
    evt.stopPropagation(); 

    var $productsDiv = $('#productsDiv'), 
     url = $(this).data('url'); 

    $.get(url, function (data) { 
     $productsDiv.append(data); 
    }); 
});

局部視圖有一個組合。該組合的名稱是使用Html幫助器擴展方法「GetIndexedName」動態生成的，該方法將唯一索引添加到指定名稱。如果我點擊按鈕兩次，它應該呈現兩個部分觀點，首先點擊組合名稱之後應該是「ProductsCombo0」，之後的第二個「ProductsCombo1」

@Html.DropDownList( 
    @Html.GetIndexedName("ProductsCombo"), 
    null, 
    htmlAttributes: new { @class = "form-control col-md-3" } 
)

的問題是，該方法@ Html.GetIndexedName火災後才第一個按鈕點擊（在調試器中檢查）。接下來的點擊只會渲染局部視圖，但請使用該方法來生成名稱。所有組合都有名稱「ProductsCombo0」，「ProductsCombo0」

你知道如何在每次渲染局部視圖時觸發它？

如果這樣做不能這樣做，你可以推薦我一些其他的解決方案來生成唯一ID嗎？

來源

2016-01-01 MatGar

我終於找到了解決問題的辦法。來自AJAX調用的數據被緩存，這就是爲什麼函數只被調用一次的原因。我所要做的就是禁用它。所以我改變了jQuery'get'mehtod到'post'這個（我現在知道的ony）沒有被緩存。

來源

2016-01-01 21:33:14 MatGar

因爲每當您爲新行發出ajax呼叫時，它都是完全獨立的http呼叫，無論您是撥打第一行還是第八行，此呼叫都沒有任何信息。您需要存儲此值（哪一行是您撥打此電話的），並在構建下拉列表名稱時使用該值。

因此首先更新您的操作方法以接受行索引值。

public ActionResult AddRow(int id) 
{ 
    var vm = new AddItemVm {RowIndex = id}; 
    vm.Items = new List<SelectListItem>() 
    { 
     new SelectListItem {Value = "1", Text = "IPhone"} 
    }; 
    return PartialView("_NewItem", vm); 
}

我有小視圖模型我的操作方法和局部視圖，它看起來像之間傳遞數據，

public class AddItemVm 
{ 
    public int RowIndex { set; get; } 
    public List<SelectListItem> Items { set; get; } 
}

而在局部視圖，它是強類型的，以我們的觀點模型中，我們將讀取Model.RowIndex屬性並使用它來構建下拉名稱/ ID。

@model YourNamespaceHere.AddItemVm 
<div> 
    @Html.DropDownList("ProductsCombo"+Model.RowIndex, Model.Items) 
</div>

現在，我們需要確保我們是唯一的行索引值，我們要添加一個新行，每次發送給我們AddRow方法。每次用戶嘗試添加新行並使用該值時，您都可以保留一個javascript變量並增加它的值。

$(function() { 

    var rowIndex = 0; 
    $('.loadPartial').on('click', function (evt) { 
     evt.preventDefault(); 
     evt.stopPropagation(); 
     rowIndex++; 
     var $productsDiv = $('#productsDiv'), 
      url = $(this).data('url') + '/' + rowIndex; 

     $.get(url, function (data) { 
      $productsDiv.append(data); 
     }); 
    }); 
});

來源

2016-01-01 19:06:08 Shyju

如何使HTML助手方法fire eveytime部分視圖呈現

回答

相關問題