При рендеринге частичного вида из вида jQuery скрипт не работает. При добавлении же динамически работает - PullRequest
Новая
       6

При рендеринге частичного вида из вида jQuery скрипт не работает. При добавлении же динамически работает

0 голосов
/ 14 января 2020

Я добавляю некоторые функциональные возможности в старый проект (ASP. NET MVC 5)

В связи с этим я отображаю существующие элементы: 

    @if (Model.ItemsVM != null)
    {
        for (int i = 0; i < Model.ItemsVM.Count(); i++)
        {
            Model.ItemsVM[i].Index = i; Html.RenderPartial("_AddItem", Model.ItemsVM[i]);
        }
    }

и более поздние через AJAX я вызываю тот же частичный вид из контроллера, чтобы добавить дополнительные элементы.

Пикл состоит в том, что код jQuery из этого частичного вида работает должным образом, если он добавлен динамически, но не, если он обычно отображается Html .RenderPartial.

Дополнительная информация:

jQuery JavaScript Library v3.1.1 is loaded at the bottom

_AddItem.cs html

@model K.Master.VMs.Racuni.RacunStavkeVM
<div class="row" id="added_row_@Model.Index">
<div class="col-sm-1 text-center">
    <input type="hidden" name="ItemsVM[@Model.Index].RacunStavkaId" value="@Model.RacunStavkaId" />
    <strong>@{ int j = Model.Index + 1; }@j</strong>
</div>
<div class="col-sm-6" id="jqueryTest">
    @Model.ComboName
    <input type="hidden" name="ItemsVM[@Model.Index].StavkaId" value="@Model.StavkaId" />
    <input type="hidden" name="ItemsVM[@Model.Index].ComboName" value="@Model.ComboName" />
</div>
<div class="col-sm-2">
    <!-- Količina -->
    <input class="form-control focus" data-val="true" data-val-number="@Ress.ErrMustBeANumber" name="ItemsVM[@Model.Index].Quantity" type="text" value="@Model.Quantity" id="ItemsVM_@(Model.Index)__Quantity" />
    <span class="field-validation-valid text-danger" data-valmsg-for="ItemsVM_@(Model.Index)__Quantity" data-valmsg-replace="true"></span>
</div>
<div class="col-sm-2 text-center">
    @Model.MjernaJedinica
    <input type="hidden" name="ItemsVM[@Model.Index].MjernaJedinica" value="@Model.MjernaJedinica" />
</div>
<div class="col-sm-3 text-center">
    <!-- Cijena -->
    <input class="form-control" data-val="true" data-val-number="@Ress.ErrMustBeANumber" name="ItemsVM[@Model.Index].Cijena" type="text" value="@Model.Cijena" id="ItemsVM_@(Model.Index)__Cijena" />
    <span class="field-validation-valid text-danger" data-valmsg-for="ItemsVM_@(Model.Index)__Cijena" data-valmsg-replace="true"></span>
</div>
<div class="col-sm-2 text-center">
    <!-- Popust -->
    <input class="form-control" data-val="true" data-val-number="@Ress.ErrMustBeANumber" name="ItemsVM[@Model.Index].Popust" type="text" value="@Model.Popust" id="ItemsVM_@(Model.Index)__Popust" />
    <span class="field-validation-valid text-danger" data-valmsg-for="ItemsVM_@(Model.Index)__Popust" data-valmsg-replace="true"></span>
</div>
<div class="col-sm-3">
    <!-- Suma -->
    <input class="form-control sum" data-val="true" data-val-number="@Ress.ErrMustBeANumber" name="ItemsVM[@Model.Index].Sum" type="text" value="@Model.Popust" id="ItemsVM_@(Model.Index)__Sum" disabled style="text-align:right;" />
    <span class="field-validation-valid text-danger" data-valmsg-for="ItemsVM_@(Model.Index)__Sum" data-valmsg-replace="true"></span>
</div>
<div class="col-sm-1 text-center">
    <input type="checkbox" name="ItemsVM[@Model.Index].Delete" value="true" class="iHidden" />
</div>
</div>
<div class="clearfix"></div>
<script type="text/javascript">
$('#added_row_@(Model.Index)').on('input propertychange change keyup click', function () {
    var quantity_@Model.Index = parseFloat($("#ItemsVM_@(Model.Index)__Quantity").val() != '' ? $("#ItemsVM_@(Model.Index)__Quantity").val() : 0);
    var cijena_@Model.Index = parseFloat($("#ItemsVM_@(Model.Index)__Cijena").val() != '' ? $("#ItemsVM_@(Model.Index)__Cijena").val() : 0);
    var popust_@Model.Index = parseFloat($("#ItemsVM_@(Model.Index)__Popust").val() != '' ? $("#ItemsVM_@(Model.Index)__Popust").val() : 0);
    if (popust_@Model.Index > 0) {
        $('#ItemsVM_@(Model.Index)__Sum').val(Math.round((quantity_@Model.Index * cijena_@Model.Index) - (((quantity_@Model.Index * cijena_@Model.Index) * popust_@Model.Index) / 100)).toFixed(2));
    }
    else {
        $('#ItemsVM_@(Model.Index)__Sum').val(Math.round(quantity_@Model.Index * cijena_@Model.Index).toFixed(2));
    }
    SumSums();
});
</script>

Я знаю, что проблема это с jQuery, загружаемым до чего-то, но все варианты с документом / ready et c. не работает и ломает скрипт при динамической загрузке.

1 Ответ

0 голосов
/ 14 января 2020

И, поместив jQuery расслоение наверх, проблема решена! 

<html>
<head>    
@Scripts.Render("~/bundles/jquery")
...
</head>
<body>
...
...