在循环外部传递foreach id以使用JavaScript更新表单

我想一次一次地更新权限状态，权限将根据给定的角色授予

每个角色都有自己的Id，并且正在显示它，但是我还必须更新角色Id的权限，但是使用foreach循环，我的UI只是分散在表单中。因此，任何方法都可以为表单提供id来更新表单中的元素

我通过javascript获取Id，但它总是给出循环的第一个Id

Blade.php

            <div class="col-lg-3 col-md-3">
                <a href="#" id="createType" class="btn btn-primary btn-block" data-toggle="modal" data-target="#myModal"><i class="fa fa-plus"></i> Add Positions</a>
                @foreach($data as $key=>$item)
                <div class="roles-menu">
                    <ul class="nav" id="item_id" onclick="item()">
                        <li><a href="" onclick="giveinput()">{{ $item->name }}</a></li>
                        {{--<div id="input">{{ $item->id }}</div>--}}

                    </ul>
                    <input id="input" value="{{ $item->id }}">
                </div>

                @endforeach
            </div>

                <form method="post" action="{{ url('/system-configurations/roles-permission/permission') }}">
                    {{ csrf_field() }}


                    <div class="col-sm-9 module-access">
                            <h6 class="panel-title mb-20 display-ib">Module Access</h6>
                            <div class="pull-right  mb-10">

                            </div>

                        <div id="divID"></div>
</div>
                    <!-- /.row -->
                    <div class="row">
                        <div class="col-md-12 text-right">
                            <button class="btn btn-info">Save</button>
                        </div>
                    </div>
                </form>

@foreach（$key=>$item形式的数据）


{{--{$item->id}}--}

@endforeach
{{csrf_field（）}}
模块访问
拯救

剧本

<script>
function giveinput(){
    $("#input").each(function() {
        var input=document.getElementById("input").value;
        var div = document.getElementById('divID');
        div.innerHTML = div.innerHTML + input;
        alert(div.innerHTML );
        e.preventDefault();
        });
    }
</script>

函数输入（）{
$（“#输入”）。每个（函数（）{
var输入=document.getElementById（“输入”）.value；
var div=document.getElementById（'divID'）；
div.innerHTML=div.innerHTML+输入；
警报（div.innerHTML）；
e、 预防默认值（）；
});
}

请查看下面的示例，了解如何使用DOM元素进行迭代。“id”属性应该用作对DOM元素的唯一引用。也就是说，我建议您改用'name'属性，并使用它查询元素

下面的代码可能无法回答您的问题，但至少说明了如何使用html进行迭代以获得正确的id值

var htmlElements=$（'input[name=“input”]”）；
htmlElements.each（函数（索引、元素）{
console.log（element.value）；
});
请查看下面的示例，了解如何使用DOM元素进行迭代。“id”属性应该用作对DOM元素的唯一引用。也就是说，我建议您改用'name'属性，并使用它查询元素

下面的代码可能无法回答您的问题，但至少说明了如何使用html进行迭代以获得正确的id值


var htmlElements=$（'input[name=“input”]”）；
htmlElements.each（函数（索引、元素）{
console.log（element.value）；
});
我只需从函数中直接给出id即可。而不是使用Id获取元素

   <li><a  onclick="getID('{{ $item->id }}')">{{ $item->name }}</a></li>


        <script>
        function getID(val){
            $("#input").each(function() {
                var div = document.getElementById('divID');
                div.value = val;
                e.preventDefault();

                });
            }
        </script>

{{$item->name}
函数getID（val）{
$（“#输入”）。每个（函数（）{
var div=document.getElementById（'divID'）；
div.value=val；
e、 预防默认值（）；
});
}
我只需从函数中直接给出id即可。而不是使用Id获取元素

   <li><a  onclick="getID('{{ $item->id }}')">{{ $item->name }}</a></li>


        <script>
        function getID(val){
            $("#input").each(function() {
                var div = document.getElementById('divID');
                div.value = val;
                e.preventDefault();

                });
            }
        </script>

{{$item->name}
函数getID（val）{
$（“#输入”）。每个（函数（）{
var div=document.getElementById（'divID'）；
div.value=val；
e、 预防默认值（）；
});
}
我建议您使用类而不是id，因为id是唯一的

<input class="input" value="{{ $item->id }}">

我建议您使用类而不是id，因为id是唯一的

<input class="input" value="{{ $item->id }}">