Как написать клиентский пользовательский Java-скрипт для проверки в частичном представлении asp.net mvc

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

Поскольку содержимое вашего частичного представления динамически добавляется в ваш DOM, поэтому динамические элементы не регистрируются вашей функцией Javascript click, чтобы ваша click работала, вы можете использовать Jquery . функция обработчика событий.

<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>

Если вы используете плагин проверки Jquery с MVC, отметьте этот пост.

Ссылки:

1.

2.

Answer 2

Это сработало для меня.

<script type="text/javascript">

$(document).ready(function () {

    $("#myModal").on("submit", "form", function (event) {
        event.preventDefault();
      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 3

После комментариев, для второго 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>