2016-06-13 10 views
0

Phonegapを使用してAndroid用のモバイルアプリケーションを構築しました。データはMySQLテーブルに格納され、データはajaxリクエストで取得されます。 2文字を入力した後にデータを文字通りフィルタリングする検索クエリです。アプリケーションがクラッシュしていますか? - 何か案が?Ajax、PHP/MySQL検索リクエストがクラッシュする

<!-- Remote call to Server --> 
    <script type="text/javascript"> 
     // Call the server for content 
     $.ajax({ 
       url: 'https://www.ppl-support.co.uk/ratchetserver/getdata', // URL -> load the data 
       crossDomain: true, 
       success: function(data){ 
        $(".list").html(data).show(); 
       } 
      }); 
      $(function(){ 
      $(".search").keyup(function() 
      { 
       var searchid = $(this).val(); 
       var dataString = 'search='+ searchid; 
       if(searchid!='') { 
        $.ajax({ 
        type: "POST", 
        url: "https://www.ppl-support.co.uk/ratchetserver/newgetdata.php", 
        data: dataString, 
        cache: false, 
        success: function(data) { 
         $(".list").html(data); 
         } 
        }); 
       }else{ 
        $.ajax({ 
        url: 'https://www.ppl-support.co.uk/ratchetserver/getdata.php', //load data 
        success: function(data){ 
         $(".list").html(data); 
        } 
        }); 
       } 
       return true;  
      }); 
     }); 

     function Reload(){ 
      location.reload(); // Reload the page onclick 
     } 
     // Send user to Home Screen 
     function Home(){ 
      location.assign('index.html'); 
     } 
    </script> 
</head> 

<body class="is-ump"><br><br> 
    <div id="users"> 
    <!-- Load abbreviations markup --> 
     <ul class="table-view" style="padding-left:0px;" id="theList"> 
      <ul class="list" style="padding-left:0px;"> 
       <li class="table-view-cell media" > 
        <a class="navigate-right"> 
         <img class="media-object pull-left" src="img/P1.png" style="width:50px;" alt="" > 
         <div class="media-body"> 
          <h4 align="center"> 
          Downloading contents, please wait... 
          </h4> 
         </div> 
        </a> 
       </li> 
      </ul> 
     </ul> 

    <!-- Search functionality ---> 
    <div class="ump"> 
     <div class="ump-widget-container"> 
      <div class="ump-widget ump-search-widget ump-hidden" id="ump-search-widget"> 
       <form action="#" method="POST"> 
        <input class="search" style="font-family:exo;" value="" placeholder="Search Abbreviations.." /><!-- 
        <button class="ump-button" style="color:white;background:#ffda00;font-family:exo;font-shadow:white;">Search</button> --> 
       </form> 
      </div> 
      <div class="ump-clear"></div> 
     </div> 
     <!-- navigational panel --> 
     <div class="ump-bar"> 
      <div class="ump-clear"> 
       <a href="#" class="ump-brand" title="UMP - Ultra Menu Pro">Pocket Pilot</a> 
       <div class="ump-icons"> 
        <a href="#"><i class="fa fa-envelope"></i></a> 
        <a href="#" class="ump-widget-toggle" data-target="#ump-search-widget"><i class="fa fa-search"></i></a> 
        <div class="ump-clear"></div> 
       </div> 
      </div> 
      <div class="ump-overlay"></div> 
     </div> 
     <nav> 
      <div class="ump-nav-container"> 
       <div class="ump-header"> 
        <img src="img/1.png" alt="" class="ump-header-background-image"> 
        <a href="#" title="UMP - Ultra Menu Pro"> 
         <img src="img/logo.png" alt=""> 
        </a> 
       </div> 
       <div class="ump-nav"> 
        <ul class="ump-default"> 
         <li> 
          <a><h4 onclick="Home()">Home</h4></a> 
         </li> 
         <li> 
          <a><h4>About</h4></a> 
         </li> 
        </ul> 
        <ul class="ump-social"> 
         <li> 
          <a href="#" class="ump-facebook"><i class="fa fa-facebook"></i></a> 
         </li> 
         <li> 
          <a href="#" class="ump-google-plus"><i class="fa fa-google-plus"></i></a> 
         </li> 
         <li> 
          <a href="#" class="ump-twitter"><i class="fa fa-twitter"></i></a> 
         </li> 
         <li> 
          <a href="#" class="ump-pinterest"><i class="fa fa-instagram"></i></a> 
         </li> 
         <li> 
          <a href="#" class="ump-youtube"><i class="fa fa-youtube-play"></i></a> 
         </li> 
        </ul> 
       </div> 
      </div> 
      <a class="ump-toggle"> 
       <i class="fa fa-times ump-close"></i> 
       <i class="fa fa-bars ump-open"></i> 
      </a> 
     </nav> 
    </div> 
</div> 
</body> 

そして、これはあなただけ(JSON形式で。EX)フォーマットされた形での配列を返し、それを返すことが私のPHPファイル(検索)

<?php 
header('Access-Control-Allow-Origin: *'); 
    header("Access-Control-Allow-Methods: POST, GET, OPTIONS"); 
    $str = ''; 
    if($_POST['search'] && $_POST['search'] != "") { 
     $q = $_POST['search']; 
     include_once('dbconnection.php'); 
     $sql = "SELECT * FROM `co_abbreviation` WHERE `acronym` LIKE = '%$q%'"; 
     $result = mysql_query($sql); 
     while($row = mysql_fetch_array($result)) { 
      $str .= "<div class='card' style='border-radius:0px;'> 
        <ul class='table-view'> 
        <ul class='list' style='padding-left:0px;'> 
         <li class='table-view-cell media'> 
          <a class='navigate-right'> 
           <div class='media-body'> 
            <h3 class='name'> 
             <b> 
              ".$row['acronym']." 
             </b> 
            </h3> 
            <h4 class='born' style='color:#1e404e;'> 
             <i> 
              ".$row['meaning']." 
             </i> 
            </h4> 
            <p class='mean' align='left'> 
            CAA Source: ".$row['source']." 
            </p> 
           </div> 
          </a> 
         </li> 
        </ul> 
       </ul> 
      </div>";  
      } 
     } 
    echo $str; 
?> 

App screen

+0

間違いはありますか?返される可能性のあるデータセットのサイズはどれくらいですか? – wahwahwah

+0

エラーがなく、フリーズしてからアプリまたはブラウザ(テスト中)がクラッシュします。 dbは現在1036のエントリを持っていますが、これは1つの結果だけが返される単一のクエリにフィルタリングされます。 –

+0

@wahwahwahあなたが見ることができるように私はちょうど私のサーバにアップロードしました。 http://ppl-support.co.uk/ratchetserver/ –

答えて

1

です。サーバーにHTMLコードを作成してクライアントに送信するときは、クライアントのJS関数でHTMLコードを作成します。 HTMLコードを送信すると結果配列を送信するよりも時間がかかります(約1kのデータがあると言ったように)。また、データトラフィックも増えます。

関連する問題