-1
votes

Ajouter Nouveau Div avec jQuery et JavaScript

Maintenant, j'essaie d'ajouter de nouveaux div avec ce code c'est le travail.
Le problème est quand j'essaie d'ajouter de nouvelles div en une ligne durable. C'est toujours après avoir duré la rangée.
J'ai besoin d'ajouter de nouveau div à côté de la dernière ligne.

Peut-être que c'est à cause de insertAfter code> mais je ne peux pas le corriger. P>

<form action="#" method ="post">
<div id="overall" class="col-md-12">
</div>
<button type="submit" id="submit" class="btn btn-primary ml-2 mt-2" value="submit" >submit</button> 
</form>


2 commentaires

S'il vous plaît fournir votre HTML


Je ma mise à jour HTML maintenant.


3 Réponses :


0
votes

Dans votre code, vous utilisez 'Insérer ()' à la place, vous devez utiliser'Append () 'Cause de cette façon, vous allez ajouter votre nouveau code après la dernière.


1 commentaires

Si j'utilise append () lorsque j'essaie d'ajouter entre eux. Il a l'air malade



0
votes

Sans votre HTML est difficile à deviner (où sont ces classes et comment vous les avez structurées. Je dirai essayer d'utiliser après au lieu d'insérer, cela pourrait être le problème. http://api.jquerery.com/insertabilter/


1 commentaires

Salut @haghel. Essayez de ne pas répondre si vous n'êtes pas sûr de la question. Au lieu de cela, vous pouvez utiliser un comportement de commentaire pour poser des éclaircissements comme HTML ou des classes.



0
votes

Je reçois ma réponse avec moi-même maintenant. Merci à tous.

function addRow(eId) {

     var mathX = Math.random().toString(36).substr(3, 12);

     $('#rowExpression'+eId.id).one( "click",function(){
         var nearest = $(this).prev().attr('id');

     console.log(nearest +'                neastest div');
     console.log(eId.id +'                    this id');
     console.log(mathX +'                     new id');


     var lastedId = $('.row').last().attr("id") ;
     console.log(lastedId, "rowExpression"+mathX);

     /*$('<div class="row mt-2"" id="rowExpression'+mathX+'"></div>').appendTo('#overall')
     .insertAfter($( "#"+nearest ));*/

     if('rowExpression'+eId.id == lastedId) {
         $('<div class="row mt-2"" id="rowExpression'+mathX+'"></div>').appendTo('#overall');

         }
     else{
         $('<div class="row mt-2"" id="rowExpression'+mathX+'"></div>').appendTo('#overall')
         .insertAfter($( "#"+nearest ));

         }
     $('<div class="col-md-9" id="Selector'+mathX+'"></div>').appendTo('#rowExpression'+mathX);
     $('<h5> e '+mathX+'</h5>').appendTo('#Selector'+mathX);
     $('<div class="col-md-1 col-md-offset-2" id="CRUDExpression'+mathX+'"></div>').appendTo('#rowExpression'+mathX);
     $('<i class="btn success-item fas fa-plus-circle pr-1" onclick="addRow(this)" id="'+mathX+'" ></i>').appendTo('#CRUDExpression'+mathX);
     $('<i class="btn cross-item fas fa-minus-circle pl-1" onclick="deleteRow(this)" id="'+mathX+'" ></i>').appendTo('#CRUDExpression'+mathX);



}); 

}


0 commentaires