Question

我正在尝试在局部视图中编写自定义java脚本以进行验证。我正在使用弹出窗口显示我的局部视图。

要将我的局部视图显示为弹出窗口，我这样做。

  <a href="#" title="Genrate Purchase Order" class="btn btn-success genratepo" onclick="GenratePO(@item.Id)"><i class="fa fa-address-card"></i></a>

<script>
     function GenratePO(orderId) {
         debugger;
         var url = "/Order/GenratePO?OrderId=" + orderId;

                 $("#myModalBody").load(url, function (data) {
                     $("#myModalBody").html(data);
                     $("#myModal").modal("show");
                 });
             }

之后我通过控制器
返回部分视图

if(orderId < 1)
        {
            ShowAlert("Invalid Id or Record Deleted",AlertStyle.Danger);
            return RedirectToAction("Index");
        }
        var orderpreferenceData= _unitOfWork.OrderPreference.FindBy(m => m.OrderDetailId == orderId && m.IsDeleted != true && m.IsActive == true).FirstOrDefault();
        var viewModel = new PurchaseOrderViewModel()
        {
            OrderId = orderId,
            VendorList = GetVendorSelectList(),
            FabricList = GetFabricSelectList(),
            FabricId = Convert.ToInt32(orderpreferenceData.FabricId)
        };
        return PartialView("GenratePO",viewModel);

但是当我尝试在局部视图中编写我的自定义java脚本方法时，它没有调用。

<script type="text/javascript">

     $(document).ready(function () {
         alert("hello");
         $("#btn_Submit").click(function () {

             debugger;
             var selectedindex = $(".ddlVendor").prop('selectedIndex');

             if (selectedindex < 0) {
                 $(".lblmsg").text("Select Vendor First");
             }
             var orderQuantity = $(".txtOrderQuantity").val();

             if (!jQuery.trim(orderQuantity).length > 0) {
                 $(".lblmsg").text("Please Enter Order Quantity");
             }

         });

     });

我不知道为什么会发生这种情况并且java脚本无效。

Answer 1

在评论之后，第二个JavaScript试试这个：

    <script type="text/javascript">

         $(document).ready(function () {
             alert("hello");

             $("#btn_Submit").on('click', function () {
                 alert("hello again");  //Just to check if it is working or not
                 debugger;
                 var selectedindex = $(".ddlVendor").prop('selectedIndex');

                 if (selectedindex < 0) {
                     $(".lblmsg").text("Select Vendor First");
                 }
                 var orderQuantity = $(".txtOrderQuantity").val();

                 if (!jQuery.trim(orderQuantity).length > 0) {
                     $(".lblmsg").text("Please Enter Order Quantity");
                 }

             });

         });
</script>

Answer 2

由于部分视图的内容会动态添加到DOM中，所以动态元素没有在Javascript click函数中注册，要使click工作，您可以使用Jquery .on事件处理函数。

<script type="text/javascript">

     $(document).ready(function () {
         alert("hello");
     $(document).on('click', '#btn_Submit', function(){
         alert("click works");
             debugger;
             var selectedindex = $(".ddlVendor").prop('selectedIndex');

             if (selectedindex < 0) {
                 $(".lblmsg").text("Select Vendor First");
             }
             var orderQuantity = $(".txtOrderQuantity").val();

             if (!jQuery.trim(orderQuantity).length > 0) {
                 $(".lblmsg").text("Please Enter Order Quantity");
             }

         });

     });


</script>

如果您正在使用带有MVC的Jquery验证插件，请检查this post。

Refrences：

1.

2.

Answer 3

这对我有用。

Optional<T>

为了完成这项工作，我必须在我调用我的部分视图的页面中编写我的java脚本。

如何在部分视图中编写客户端自定义java脚本以进行验证asp.net mvc

3 个答案: