ajax形式像结构

时间:2012-04-17 23:44:32

标签: php jquery mysql ajax

我会尽可能地简短和描述(考虑到我的情况更长)。 假设我有2个具有以下结构的数据库表:

用户表:

id ----用户名----黄金

项目表:

id ----- item_name ---- item_price

我想要实现的是头脑风暴,我用20多个脚本组合尝试了这个。我需要能够将表​​中的所有项目回显到一个良好的布局(完成) 有一个文本框供用户输入需要购买的值。 a href提交金额,从用户拥有的金额中扣除项目的价格,然后将1添加到库存中。我不需要PHP代码,因为它很容易。我只需要帮助尝试更新“实时”中输入的值。 “商店”的布局看起来像这样:

while($_row = mysql_fetch_assoc($query)){
 echo out name...
 <input type = 'text' name = 'to_buy_value'/>
 <a href = 'javascript:;' class = 'buy'>Buy</a>
}

我希望上面的代码能为您提供足够的参考。 TL; DR(在db结构之后?) 1-一个带有href作为提交的文本框。 2-表更新是即时完成的(无重新加载)。阿贾克斯。 3-一次可以购买超过1件商品而无需重页加载 4 - 除非必要,否则无需PHP代码帮助。 我会感激任何帮助。

2 个答案:

答案 0 :(得分:1)

前段时间,我有一个项目,我必须做一些CMS只是为了新闻管理,添加,编辑,删除等。正如Satya评论的那样,如果你想做得很好,那就是使用AJAX。

我做的是一个循环,就像你的一样,对于用PHP提取的每一行mysql_fetch_assoc在表中添加一个tr(是的,我知道,表......)。我知道你不想要PHP帮助,但我认为这会对你有帮助。

    $res=mysql_query($query) or die(mysql_error());
    while($row = mysql_fetch_assoc($res)) {  
     foreach ($row as $col => $val) {
     if ($col != "column you dont display or isn't 'ID' column" && $col != "another column you dont display, and so on") {
       if ($col == "ID") $id = $val;

       //use this to echo values in table/tr/td/div/span or whatever you use to display values
       if ($col == "gold") {
        echo 'whatever you want to echo using the gold value';
       }
       if ($col == "name of last column you are displaying") {
        echo 'whatever you display for that column';
        echo '<input type="text" value="Introduce quantity">';
        //If you are on HTML5 you could just use id="{$id}" as it will be easier
        echo '<a href="#" class="buy" id="i_{$id}" value="Introduce quantity">';
       }
      }
     }

这里最重要的事情之一是跟踪每个项目的ID,这样您就可以在向服务器发送POST请求时将它们联系起来。

我建议你使用jQuery,它很容易使用

<script type="text/javascript">
  $(document).ready(function () {
    $(".buy").click(function(e) {
      e.preventDefault();
      // You get the id attribute of the button clicked, which contains the
      // item ID. Then you substr the string to get just the id number. Example:
      // The id of the clicked element is "i_2254" you use substr to get just the
      // 2254 and send it to the php that process the buy
      // If you choose the HTML5 id form I said above in the PHP, then var id=$(this).attr("id")
      var id = $(this).attr("id").substr(2);
      $.ajax({
              type: "POST",
              url: "buy_item.php",
              async:false,
              data: "itemID="+id,
              success: function(data) {
                  // Here is where the magic occurs, this is what happens when you
                                      // get the response, here is where you update the
                                      // inventory, quantity, etc WITHOUT reloading.
                                      // The variable data is the response of the server
                                      // you just echo what you need on buy_item.php, and 
                                      // that will be data here
                                      // A simple example is to change the value of an input
                                      // with id="gold", you echo gold on php and...

                                      $('#gold').val(data);

                }
              }); 

  });
    });
  });
</script>

在buy_item.php中,您可以更新表格的黄金值,并将项目添加到项目表格中。使用$ _SESSION变量来存储用户会话名称并更新该用户的黄金和项目。

我建议您调查一下AJAX和jQuery(可选),它会有很多帮助!

我认为基本上这会解决你的问题,我希望能有一个游戏邀请:P

答案 1 :(得分:1)

这是一个非常粗略的解决方案。在while循环中,您可以将项目的数据库ID附加到元素的id:

while($_row = mysql_fetch_assoc($query)){
 echo out name...
 <input id="purchaseAmount{$_row->id}" type="text" name="value_to_buy" />
 <a id="purchaseButton{$_row->id}" href="#" class="buy">Buy</a>
}

然后将javascript函数绑定到您的“购买”链接,该链接将发出AJAX请求:

$('.buy').bind('click', function() {

  // Grab the item id and amount
  var itemId = $(this).attr('id').substring(14);
  var itemAmount = $('purchaseAmount' + itemId).val();

  $.ajax({
    url: 'someurl/purchaseItem.php',
    data: { item: itemId, amount: itemAmount },
    success: function(data) {
      // Update the player's gold and inventory on screen
    }
  });
});

“purchaseItem.php”文件可以返回一个简单的JSON对象,该对象保存玩家当前的黄金和库存的物品金额。或者您可以返回HTML,具体取决于您的页面设置方式。