ECGtestJsonAjax

Why do the player names get repeated?

by cneeds

HTML

<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
  <!-- **************************************************
       *                                                *
       *  Login                                         *
       *      click (Submit) to LoginSubmit             *
       *      click (Register) to Register new user     *
       *      click (Lost PW) to Retrieve lost password *
       *                                                *
       ************************************************** -->
  <div id="LoginPage" data-role="page">

    <div data-role="header"><h1>Login to ECG</h1>
      <a id="LoginClick" href="#LoginSubmit" title="Submit login details">Submit</a>
      <a id="Register" href="#LoginPage" align="right" title="Register new user">Register</a>
    </div>

    <div data-role="content">
      <form>
        <div>
          <label for="UserName">User name</label>
          <input id="UserName" title="Enter your User Name" tabindex="1" type="text" placeholder="User name" maxlength="10" autofocus>
        </div>
        <div>
          <label for="Password">Password</label>
          <input id="Password" title="Enter your Password" tabindex="2" type="password" placeholder="Password" maxlength="10">
        </div>
        <div>
          <label for="EmailAddress">Email address</label>
          <input id="EmailAddress" title="Enter your email address" tabindex="3" type="text" placeholder="Email address" maxlength="40">
        </div>
      </form>
    </div>

    <div data-role="footer"><h1>Educational card games</h1>
      <a href="#" title="Retrieve your password">Lost PW</a>
    </div>

  </div>

  <!-- **************************************************
       *                                                *
       *  Find and show other players                   *
       *      click (Play) to DisplayHand               *
       *                                                *
      ...

JavaScript

$(document).on('click', '#LoginClick', function(evnt) {

//    evnt.stopImmediatePropagation();

    // Find other players

    // Send a call to the backend for players
    var lilength = $('li').length;
    if (lilength == 0) {
      $.getJSON('http://www.cjneeds.com/ECG/getPlayers.php', function(Users) {

        // For each Player, add them to the list
        $.each(Users, function(i,User) {

          // Add each Player to the list
          $('<li/>').text(User['userName']).appendTo("#playerList");
        });

        // Refresh the list
        $("#playerList").listview('refresh');
      });
    }
  });