檢索選擇列表元素數據jQuery的

我是新來的整個編碼的事情，已經學習了很多有幫助揭掉最近，所以我希望它可以繼續與我有下一個問題！檢索選擇列表元素數據jQuery的

我有一個完美的渲染和它的作用是顯示一些假信息，我輸入的是來自本地MYSQL數據庫jQuery的列表。什麼我迄今所做的是，當用戶點擊鏈接列出一個將他們帶到下一個頁面，說：「你已經選擇鏈接＃」，並在這種情況下，＃標籤代表用戶的dealid數選定的列表鏈接。

我試圖找出該怎麼做是這樣的：

隨着我已經從用戶的選擇獲得（即選擇dealid號）的信息，我怎麼能那麼通過這個返回到該數據庫，以便我可以找到並檢索具有該交易號碼的特定條目。

我的HTML代碼如下：

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>Find A Deal</title> 

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 

    <style> 
     img.fullscreen { 
      max-height: 100%; 
      max-width: 100%; 
     } 
     </style> 

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.css" /> 
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.2.0/jquery.mobile-1.2.0.min.js"></script> 
<script type="text/javascript"> 
    $(document).on('pagebeforeshow', '#index', function(){ 
     $("#list").empty(); 
     var url="http://localhost/test/json3.php"; 
     $.getJSON(url,function(json){ 
      //loop through deals 
      $.each(json.deals,function(i,dat){ 
       $("#list").append("<li><a id='"+dat.dealid+"'><h1>"+dat.name+"</h1><p>"+dat.dname+"</p></a></li>"); 
       $(document).on('click', '#'+dat.dealid, function(event){ 
        if(event.handled !== true) // This will prevent event triggering more then once 
        { 
         listObject.itemID = $(this).attr('id'); 
         $.mobile.changePage("#index2", { transition: "slide"}); 
         event.handled = true; 
        } 
       });    
      }); 
      $("#list").listview('refresh'); 
     }); 
    }); 

    $(document).on('pagebeforeshow', '#index2', function(){  
    $('#index2 [data-role="content"]').html('You have selected Link' + listObject.itemID); 
// var url="http://localhost/test/json9.php"; 
// $.getJSON(url, function(json){ 






    }); 

    var listObject = { 
     itemID : null 
    }  
</script> 
</head>  
<body>  
<div data-role="page" id="index"> 
    <div data-role="header" data-position="fixed"> 
     <h1>Current Deals</h1> 
    </div> 

    <div data-role="content"> 
     <div class="content-primary"> 
      <ul id="list" data-role="listview" data-filter="true"></ul> 
     </div> 
    </div> 

    <div data-role="footer" data-position="fixed"> 
     <div data-role="navbar"> 
      <ul> 
       <li><a href="http://localhost/findadeal/index.html" data-icon="home">Home</a></li> 
       <li><a href="http://localhost/findadeal/mydeal.html" data-icon="grid">My Deals</a></li> 
      </ul> 
     </div> 
    </div> 
</div> 

<!--New Page --> 

<div data-role="page" id="index2"> 
<div data-role="header"> 
     <h1> Find A Deal </h1> 
    </div> 

    <div data-role="content"> 
     <a data-role="button" href="#page1" data-icon="star" data-iconpos="left">Get Deal </a> 
    </div> 

    <footer data-role="footer" data-position="fixed"> 
     <nav data-role="navbar"> 
      <ul> 
       <li><a href="index.html" data-icon="home">Home</a></li> 
       <li><a href="#index" data-icon="grid">My Deals</a></li> 
      </ul> 
     </nav> 
    </footer> 
</div> 
</body> 
</html>

被參考，以創建原始列表（Json3.php）的PHP/JSON文件如下：

<?php 

$link = mysql_pconnect("localhost", "root", "") or die ("Could not Connect to DB"); 

mysql_select_db("findadeal") or die("Could not select database"); 

$arr = array(); 

$rs = mysql_query("SELECT r.restaurantid, r.name, r.image, d.dealid, d.dname, d.restaurantid 
FROM restaurant r, deal d 
WHERE r.restaurantid = d.restaurantid;"); 

while($obj = mysql_fetch_object($rs)) { 
$arr[] = $obj; 
} 

echo '{"deals":'.json_encode($arr).'}'; 

?>

我在這裏虧本，因爲我一直在尋找這方面的信息一段時間，似乎找不到我在找什麼。我很感激任何人的幫助，我真的很認真！提前致謝！！ :)

來源

2013-02-16 user2025934

可以簡化您的JavaScript這樣的：

$(document).on('click', '#'+dat.dealid, function(event){ 
    listObject.itemID = $(this).attr('id'); 
    $.mobile.changePage("#index2", { transition: "slide"}); 
    event.stopPropagation(); 
});

如果要加載項的數據，而無需重新加載頁面，那麼你需要做一個Ajax請求。如果你不介意重新加載頁面，重定向到http://domain.com/uri/whatever?id=<the_selected_id>然後在你的PHP腳本你可以使用get參數$_GET['id']的項目，並進行查詢來獲取數據，此ID。

UPDATE

你需要一個PHP腳本從數據庫中檢索數據。這個腳本被稱爲像這樣：http://www.domain.com/foo/bar/my_script.php?id=<the_id_from_the_selection>

而且你的腳本應該是這樣的：

<?php 

// Default value to return 
$data = array('error' => 'No deal found'); 

if (isset($_GET['id']) && is_numeric($_GET['id'])) { 

    // Using PDO for the database connection, it's much better and avoid SQL injection 
    // Make sure the PDO extension is enable in your php.ini 
    $pdo = new \PDO('mysql:host=localhost;dbname=<SOMEDB>', '<USERNAME>', 'PASSWORD'); 

    $sql = "SELECT * FROM deal WHERE id = :id"; 
    $statement = $pdo->prepare($sql); 
    $statement->execute(array('id' => $_GET['id'])); 
    $data = $statement->fetch(\PDO:FETCH_ASSOC); 
} 

echo json_encode($data); 

// You don't need the closing PHP tag. Actually it's easier to debug if you don't use it.

你的Ajax請求（調用時用戶選擇的東西，這是JavaScript的）應該是這樣的：

var dealId; // the selected deal id 

$.ajax({ 
    url : 'foo/bar/my_script.php', 
    data: {id: dealId}, 
    type: "GET", 
    async: true, 
    onSuccess: function(response){ 
    console.log(response); // look into the console to check the object structure 
    // Display your data here using dom selector and jquery 
    } 
});

來源

2013-02-16 00:55:04 maxwell2022

感謝您的快速評論回來了！聽起來不錯，我不得不先弄清楚其中的兩種方法，然後才搞清楚如何去做。你有沒有想過你建議的第二種方法叫做什麼？或者你個人推薦哪兩種？因爲我覺得不重新加載頁面會使應用程序看起來更好，但我不確定什麼行業標準會是！ – user2025934 2013-02-16 01:00:34

如果你需要在同一頁面上顯示數據，下拉選擇你最好使用ajax。爲此我推薦jQuery $ .ajax（）。你需要調用PHP腳本從數據庫中獲取數據並返回它（如JSON字符串，看看PHP'json_encode（）'）。如果你尋找$ .ajax（）tutoriel，你會找到你想要的 – maxwell2022 2013-02-16 01:05:12

下拉選擇？這是一種列表或什麼？我正在使用的列表只是一個標準的列表。當用戶導航到某個頁面時，不同的元素會在整個頁面上列出。然後，當進行選擇時，他們會被帶到一個新頁面，我希望顯示新信息 - 我仍然會使用那個$ .ajax嗎？ – user2025934 2013-02-16 01:09:36

檢索選擇列表元素數據jQuery的

回答

相關問題