Несколько строк, использующих одну и ту же функцию?

Question

У меня есть сетка категорий, где пользователь может присвоить значение каждой категории, используя поле редактирования. В настоящее время поле редактирования статический бит кода:

<input style="text-align: right" type="text" value="@(sub.BudgetAmount.HasValue ? sub.BudgetAmount.ToString() : "")" /> 

Они генерируются в Foreach через в через список элементов из базы данных.

<div id="ccl@(cat.Id)" class="collapse collapsed collapse-categories"> 
    @foreach (var sub in Model.Lines.Where(x => x.CategoryId == cat.Id)) 
    { 
     <div class="row table_row"> 
     <div class="col-xs-12 col-lg-4 small-bold-cell"><a href="@Url.Action("EditSubCategory", "Category", new {id = sub.SubCategoryId})" class="btn btn-xs btn-success">View</a>&nbsp;&nbsp;&nbsp;@sub.SubCategory</div> 
     <div class="col-xs-4 col-lg-2 small-cell "> 
      <input style="text-align: right" type="text" value="@(sub.BudgetAmount.HasValue ? sub.BudgetAmount.ToString() : "")" /> 
     </div> 
     <div class="col-xs-4 col-lg-2 small-cell text-right">@sub.SpentAmount</div> 
     <div class="col-xs-4 col-lg-2 small-cell text-right">@sub.Remaining</div> 
     <div class="col-xs-2 col-lg-2 small-cell visible-lg text-right">@sub.Transactions</div> 
     </div> 
    } 
</div> 

Что мне нужно сделать, это, когда пользователь изменяет значение поля редактирования, нужно вызвать функцию JQuery, с идентификатором (я могу как-то, добавить идентификатор строки в качестве тега в поле редактирования?) и введенную сумму, и позвоните моему контроллеру (т. е. сохраните значение, связанное с идентификатором).

Как написать один метод javascript, который на основе строки, измененной пользователем, вызывает функцию сохранения? Я не уверен, как эта концепция может работать.

На данный момент мне просто нужен способ изменить этот код, чтобы вызвать метод javascript, который будет «предупреждать» идентификатор выбранной строки и значение в поле редактирования, которое я только что выложил, . или нажать «Enter» в

в визуальной идеи, это то, что мой экран выглядит следующим образом:

Я думаю, что я могу добавить что-то вроде «» данных-ид = 7' к моему editbox, чтобы получить идентификатор? Но как у меня есть один метод, чтобы использовать функцию во всех окнах редактирования. Я думаю, что я бы использовал класс и метод для этого класса.onexit?

Answer 1

Вы можете использовать делегированные обработчик событий для этой работы:

$('body').on('change', 'input.change-handled', myJqueryFunction); 

быть уверены, чтобы дать ваши входы в change-handled класс и имеют myJqueryFunction прочитать атрибут элемента data-id, что событие было призвано:

function myJqueryFunction() { 
    var dataId = $(this).attr('data-id'); 
}