如何在局部视图中加载 JavaScript CSS 文件

Posted 2023-03-06

【中文标题】如何在局部视图中加载 JavaScript CSS 文件

【英文标题】：How to load JavaScript CSS files in partial view

【发布时间】：2022-01-02 19:28:12

【问题描述】：

我有一个局部视图页面，我想在这个局部视图中加载 javascript 和 CSS 文件。

请帮助我如何做到这一点？

我想在局部视图中加载这三个文件

<link href="~/AdminTheme/BootstrapJalaliDatePicker/css/bootstrap- 
    datepicker.min.css" rel="stylesheet" />
<script src="~/AdminTheme/BootstrapJalaliDatePicker/js/bootstrap- 
    datepicker.min.js"></script>
<script src="~/AdminTheme/BootstrapJalaliDatePicker/js/bootstrap- 
    datepicker.fa.min.js"></script>

局部视图：

<div class="col-md-12">               
    <div class="col-md-6">
        <div class="form-group">
            <label asp-for="StartDate" class="control-label">
                StartDate
            </label>
            <input id="sdDate" class="Date form-control" name="stDate"/>    
            <span asp-validation-for="StartDate" class="error"></span>
        </div>
    </div>
             
    <div class="col-md-6">
        <div class="form-group">
            <label asp-for="EndDate" class="control-label"> 
                EndDate
            </label>
            <input id="edDate" class="Date form-control" name="edDate"/>
            <span asp-validation-for="EndDate" class="error"></span>
        </div>
    </div>
</div>

<script type="text/javascript" language=javascript>                  
    $(document).ready(function()        
        $('.Date').datepicker( dateFormat: "yy/mm/dd", isRTL: true, 
            showButtonPanel: true );
    );
 </script>

【问题讨论】：

只需将其添加到局部视图即可。您可以在整个 html 中的任何地方添加 JS 和 CSS 块，而不仅仅是在标题中。

当您将它们添加到局部视图时会发生什么？是什么不工作让你问这个问题？

我要显示日期插件，

这个局部视图在 Ajax 中执行操作。刷新页面后，显示日期插件，但插入记录操作后，不再显示日期插件插入新记录。

【参考方案1】：

得到的解决方案：

   $(document).on("focusin",".Date", function () 
         $(this).datepicker(
            dateFormat: "yy/mm/dd", 
            isRTL: true, 
            showButtonPanel: true
           );
        );  

添加css：

.datepickerz-index:1151 !important;