Passer la boucle extérieure de l'ID foreach pour mettre à jour un formulaire à l'aide de JavaScript

Question

Je souhaite mettre à jour le statut des autorisations de temps en temps et les autorisations seront accordées en fonction du rôle attribué.

Chaque rôle a son propre ID et il est affiché, mais je dois également mettre à jour l'autorisation en ce qui concerne l'ID de rôle mais avec la boucle foreach est donnée à la forme que mon interface utilisateur est juste dispersée. Donc, de toute façon, comment donner un identifiant au formulaire pour mettre à jour les éléments du formulaire.

J'obtiens l'ID via javascript mais il donne toujours le premier id de la boucle.

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>

Scénario

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

javascript html laravel-5

0

Faiez 12 avril 2018 à 11:17

Answer 1

Je l'ai fait en donnant simplement id directement à partir de la fonction. Au lieu d'obtenir l'élément en utilisant l'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>

0

Faiez 12 avril 2018 à 08:54

Answer 2

Je vous suggère d'utiliser la classe au lieu de l'id car les identifiants sont censés être uniques

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

Après cela, vous pouvez parcourir les éléments en sélectionnant «ceci» à l'aide du sélecteur jquery dans la fonction .each

$(".input").each(function() {
    var input= $(this).val();
    //... rest of your code
});

1

user3603030 12 avril 2018 à 09:07

Answer 3

Veuillez consulter l'exemple ci-dessous pour savoir comment itérer avec les éléments DOM. La propriété 'id' est censée être utilisée comme référence unique à un élément DOM. Cela dit, je vous recommande d'utiliser la propriété 'name' à la place et d'interroger les éléments qui l'utilisent.

Le code ci-dessous peut ne pas répondre à votre question mais indique au moins comment itérer avec le html afin d'obtenir les valeurs id appropriées.

var htmlElements = $('input[name="input"]');

htmlElements.each(function (index, element) {
  console.log(element.value);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input name="input" value="1">
<input name="input" value="2">
<input name="input" value="3">
<input name="input" value="4">

1

Luiz Duarte 12 avril 2018 à 08:48

Passer la boucle extérieure de l'ID foreach pour mettre à jour un formulaire à l'aide de JavaScript

3 réponses

Questions connexes

De nouvelles questions

javascript