如何通过 ajax 请求填充复选框以在 razor 页面 mvc 上运行 RelatedUserAccessPermission?

问题描述 投票:0回答:1

我在 .NET core 7 MVC razor page 上工作。我遇到问题,我无法通过对此功能使用 ajax 请求来填写复选框 ID

StockTake
ShelfLabelPrint
RelatedUserAccessPermission

下面的URL我在浏览器上运行它来访问功能

RelatedUserAccessPermission

https://localhost:7160/AddUserAccess?handler=RelatedUserAccessPermission

 public JsonResult OnGetRelatedUserAccessPermission(int UserId)
        {

            var UserAccess = _db.UserAccess.ToList();
            return new JsonResult(UserAccess);

        }

函数返回的数据

OnGetRelatedUserAccessPermission

ModuleCode AccessRight UserId
1           1           1220
2           1           1220

so 基于用户id

    if(modulecode=1 and accessright=1)
    
    then StockTake checkbox will be checked based on value =1
    
    if(modulecode=2 and accessright=1)
    
    then ShelfLabelPrint checkbox will be checked  based on value =2
    if(modulecode=3 and accessright=1)
    
    then Transfer checkbox will be checked based on value =3

关于 AddUserAccess.cshtml

<button id="FillCheckBox" type="submit" class="col-sm-1 btn btn-primary">Submit</button>
        <div class="form-group row">
            <label for="user-id" class="col-sm-1 col-form-label" style="font-size:15px;font-family: 'Open Sans', sans-serif;font-weight: bold;">User ID</label>
            <div class="col-sm-3">
                <input id="useraccess-id" asp-for="UserAccess.UserId" type="text" class="form-control" style=" margin-left:10px;font-size:15px;font-family: 'Open Sans' , sans-serif;font-weight: bold;" />
            </div>
        </div>
        <input id="StockTake" type="checkbox" asp-for="UserAccess.MODULECODE" value="1">
        <label for="lblStockTake">Stock Take</label>

        <input id="ShelfLabelPrint" type="checkbox" asp-for="UserAccess.MODULECODE" value="2">
        <label for="lblShelfLabel">Shelf Label Print</label>

        <input id="Transfer" type="checkbox" asp-for="UserAccess.MODULECODE" value="3">
        <label for="lblTransfer" style="margin-right:5px;">Transfer</label>

有关我期望的更多详细信息

我需要通过ajax请求实现的确切逻辑

  <script type="text/javascript">
            $(document).ready(function () {
                $('#FillCheckBox').click(function () { 
                    //How to Make Ajax Request Fill CheckBoxes
if(modulecode=1 and accessright=1)
    
    then StockTake checkbox will be checked
    
    if(modulecode=2 and accessright=1)
    
    then ShelfLabelPrint checkbox will be checked 
    if(modulecode=3 and accessright=1)
    
    then Transfer checkbox will be checked


                    
                
            });
            });
        </script>
jquery ajax asp.net-mvc asp.net-core razor-pages
1个回答
0
投票

为了测试,我将复选框

asp-for="UserAccess.MODULECODE"
更改为
asp-for="UserAccess.ck"
,因为有
ModuleCode
属性。

我需要通过ajax请求实现的确切逻辑

我有一个工作演示,你可以参考一下,希望对你有帮助。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script type="text/javascript">
    $(document).ready(function () {
        $('#FillCheckBox').click(function () {
            var id = $("#useraccess-id").val();     
            alert(id);
            $.ajax({
                type: "Get",
                url: "/AddUserAccess?Handler=RelatedUserAccessPermission",
                data: { UserId: id },
                success: function (result) {
                    for (i = 0; i < result.length; i++) 
                    {         
                        if(result[i].moduleCode == 1 & result[i].accessRight == 1)
                        { $("#StockTake").prop("checked", true); };
                        if (result[i].moduleCode == 2 & result[i].accessRight == 1)
                        { $("#ShelfLabelPrint").prop("checked", true); };
                        if (result[i].moduleCode == 3 & result[i].accessRight == 1) 
                        { $("#Transfer").prop("checked", true); };                      
                    };
               },
                failure: function (response) {
                    console.log(response);
                }
            });
                });
                });
</script>

结果:

© www.soinside.com 2019 - 2024. All rights reserved.