0

我正在通过尝试构建一个简单的购物清单 Web 应用程序来学习 Python、Django、Javascript 和 jQuery。如果我的方法正确，我想听听经验丰富的开发人员的意见：

功能： 网页将显示食物列表。当我点击某种食物时，我希望显示一份配料清单（这将是我的购物清单）。单击另一种食物将向购物清单添加更多成分。

我的方法： 我用 django 构建了一个简单的页面。我能够显示已输入数据库的所有食物的列表。我现在需要的是在我点击食物时开始构建成分列表。

我在想我会在第一页加载时从数据库中加载成分列表，但用 css 隐藏它们。当我点击一个食品项目时，我会使用 jquery/css 取消隐藏与食品项目相关的成分。

这种方法对我来说似乎很笨拙。您能否给我一些建议，如何使用上述技术创建我的购物清单应用程序？我的方法正确吗？

4

2 回答 2

3

这就是我的做法。但请注意，这个问题没有正确答案。

让我们调用您单击食物的页面，index.php。

在 上index，我将拥有所有可以点击的食物，以及一个 ID 为“ingredients”的空 div——例如。<div id="ingredients"></div>

当点击食物时，他们会在main.js.

onClick 处理程序将：

  • 跟踪当前选择的食物
  • get_ingredients.php通过 AJAX将 json 或其他格式的列表发送到页面。
  • （此页面将返回我想在“Ingedients”部分显示的 HTML）
  • 使用 AJAX 调用返回的 html 设置成分 div 的内容。

更明确地说，get_ingredients.php将：

  • 解析通过 AJAX 发送的食物的 GET/POST 列表index
  • 查询数据库以查看所选食品所需的成分
  • 构造与查询结果相对应的 HTML，该查询结果应放入面向用户的页面上的“成分”div 中。
  • echo通过/ print/ /etc “显示它” printf，这并不是真正用AJAX显示，而是作为AJAX响应发送。

这样，您只需跟踪选择的食物，而不是在选择和取消选择食物时添加/减去单个成分的数量。

这具有重新传输“您已经知道”的东西的缺点，即先前选择的食物成分，但是它消除了许多原本需要的工作。

于 2012-06-16T18:14:25.453 回答
0

@jedwards 的评论是正确的。而不是在开始时为每个项目加载所有内容（这可能导致初始页面加载缓慢）。您应该执行一个单击事件，该事件会回调服务器并传递数据库中对象的名称或 id 并返回其成分，然后填充包含这些成分的 div。jqueryajax

于 2012-06-16T18:11:05.390 回答