Jquery 使用腳本附加 MVC PartialView

Question

我有將PartialView附加到 div 的 javascript 函數。 一切正常，除了 PartialView 包含一些<script></script>腳本。 jQuery 找不到那些動態附加的函數 - Uncaught ReferenceError: getIDc4 is not defined 。

我的JS函數

var url = '@UrlHelper.GetFullUrl("Inventories/GetFilterRow")'; //this returns partial view
        $.ajax({
            type: 'POST',
            data: { aRef: aRef },
            url: url,
            success: function(data) {
                $('.filter').append($(data)[0]);
                var script = document.createElement('script');
                script.type = 'text/javascript';
                script.src = url;
            }
        });

和局部視圖

...
@{
    int id = Model != null ? Model.Id : 1;
}

<div id="@Html.Raw("FilterCondition" + id)">
...
...
...

    @{
        string getIdcFunction = string.Format("getIDc{0}", id);
    }
    <script>
        @{
            @:function  
                @getIdcFunction<text>() {
            var grid = $("@Html.Raw("#field"+id)").data("kendoDropDownList");
            var item = grid.value();
            return { IDc: item };
        }
            </text>
        }
    </script>

</div>

我怎樣才能讓那些動態附加的函數開始工作？

當我通過使用頁面加載生成局部視圖時

@Html.Partial("GetFilterRow", new {Id = 1})

一切正常。 唯一的問題是當這個視圖通過 jquery 和 ajax 追加時。 然后找不到那些函數。

感謝幫助。

Answer 1

你有幾個我知道的選項。 選項一是將您的腳本包含在主視圖中，並設置onclick或您嘗試調用的任何事件來調用該函數。

例如，在您的主視圖中有：

function floorSelect(clickedFloor) {
         doStuff;
         }

在您的部分觀點中，有：

    <ul class="dropdown-menu" role="menu" aria-labeledby="dropDownSelectFloor">
                @For i As Integer = 0 To Model.ListOfFloors.Count - 1
                    @<li role="presentation"><a id="ddListSelectFloor" class="ddListSelectFloor" 
                     onclick="floorSelect(this)" role="menuitem" tabindex="-1">
                     @Model.ListOfFloors(i)</a>
                        </li>
                    Next
                </ul>

請注意從主視圖調用腳本的onClick 。

選項 2 是通過id附加腳本（您也可以對class執行此操作）

像這樣：

@For i As Integer = 0 To Model.ListOfDisplayTypes.Count - 1
                If Model.ListOfDisplayTypes(i).Equals("DatePicker") Then
                @<div class="row">
                    <div class="col-md-4">
                        <b>@Model.ListOfFields(i): </b>
                    </div>
                    <div class="col-md-4">
                        <input class="search" id="@Model.ListOfCategoryAttributeIDs(i)" type="text" placeholder="@Model.ListOfFields(i)">
                    </div>
                    <script>
                        jQuery("input[id='@Model.ListOfCategoryAttributeIDs(i)']").datepicker();
                    </script>
                </div>
                End If
            Next

Answer 2

1.將局部視圖中的腳本放入scripts.js文件中。 2.在將局部視圖附加到 div 后，使用$.getscripts('path of scripts.js') 。