Ajax zu unterschiedlichen Ergebnissen in PHP

Question

HTML CODE

<div class="card text-center pricing-card mb-20"> 
<ul class="list-group list-group-flush"> 
    <?php 
    $gbewas = mysqli_query($con,"SELECT * FROM price"); 
     while($okks = mysqli_fetch_array($gbewas)) 
    { ?> 
<li class="list-group-item d-block text-left"> 
<input type="radio" name="dep" id="btn-login" value="10"> 
<span style="font-size:16px; margin-left:10px"><?=$okks['plan']?></span> 
</li> 
<?php } ?> 
</ul> 
</div> 
      <!--- SHOW RESULT---> 
<input type="text" class="error" id="logerror"> 

jQuery zu bestimmen: dieser Code

$(document).ready(function() { 
    $("#btn-login").click(function() { 
    var price = $("input#btn-login").val(); 
    $('#logerror').input(price); 
    }); 
}); 

Ich brauche Lösung. Erste Ausgabe, ich habe 4 Zeilen im Preis dbTable und es holt die 4 Zeilen korrekt, aber wenn ich auf jedes/verschiedene Radio-Buttons klicke es immer den ersten Eingabewert als Ergebnis.

Zweite Ausgabe, Das Ergebnis zeigt, ist nicht im Eingabeformat

<input type="text" class="error" id="logerror"> 

Aber zeigen in div Format

<div class="error" id="logerror"></div> 

Answer 1

Zwei Probleme - Ihr id s sind alle gleich, so jQuery die abholt zuerst #btn-login jedes Mal. Aber Sie verwenden für jeden Eingang den gleichen Wert (10). Worin besteht der Unterschied?

Angenommen, Ihre Datenbank hat eine [price] Spalte, verwenden wir das als Wert; und lassen Sie uns den Preis von nur das Element, das angeklickt wurde erhalten.

while($okks = mysqli_fetch_array($gbewas)) 
{  
    ?> 
    <li class="list-group-item d-block text-left"> 
    <input type="radio" name="dep" class="btn-login" value="<?= $okks['price'] ?>"> 
    <span style="font-size:16px; margin-left:10px"><?=$okks['plan']?></span> 
    </li> 
    <?php 
} 

Bitte beachte, dass wir class statt id verwenden, da id muss eindeutig sein. Wir werden dies auch in unserem JavaScript tun:

$(document).ready(function() { 
    $(".btn-login").click(function() { 
    var price = $(this).val(); // the clicked element 
    $('#logerror').val(price); // val(), not input() 
    }); 
}); 

Answer 2

Versuchen Sie dies. Beim Erstellen der Liste der Optionsfelder weisen Sie allen Eingangsfunkgeräten dieselbe ID zu. Auch wenn Sie allen eine gemeinsame Klasse zuweisen möchten, müssen Sie allen Elementen eine andere ID zuweisen, wenn Sie in der Lage sein müssen, jedes Element gezielt anzusprechen. Ich nehme an, Sie haben auch eine "id" -Spalte in Ihrer Preistabelle (oder Sie können einen anderen Bezeichner verwenden, der eine Zeile eindeutig identifiziert) als Teil der ID.

<div class="card text-center pricing-card mb-20"> 
<ul class="list-group list-group-flush"> 
    <?php 
    $gbewas = mysqli_query($con,"SELECT * FROM price"); 
     while($okks = mysqli_fetch_array($gbewas)) 
    { ?> 
<li class="list-group-item d-block text-left"> 
<input type="radio" name="dep" class="btn_login" id="btnLogin_<?=$okks['id'] ?>" value="10"> 
<span style="font-size:16px; margin-left:10px"><?=$okks['plan']?></span> 
</li> 
<?php } ?> 
</ul> 
</div> 
      <!--- SHOW RESULT---> 
<input type="text" class="error" id="logerror"> 


<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Open+Sans+Condensed:300|Raleway' rel='stylesheet' type='text/css'> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    <script type="text/javascript"> 

     // Ajax post 
     $(document).ready(function() { 
      $(".btn_login").click(function() { 
       var price = $(this).val(); 
       $('#logerror').val(price); 
       }); 
      }); 
    </script>