javascript - 我可以使用在线表单自动填充 HTML 页面而不使用数据库吗?

标签 javascript php jquery html css

我正在尝试为我的网站设置一个每日特价页面。我希望厨师们能够在线填写表格,并将他们输入表格的信息显示在网站的每日特价页面上。我是编程新手,我根本不懂 PHP,所以我想知道是否有一种我不知道的简单方法可以做到这一点。

我可以很容易地使用数据库来完成此操作,但是我无法为该站点设置数据库。说来话长,别问。

我可以使用 PHP 将数据从厨师填写的在线表格传输到每日特价页面 - 但一旦表格关闭,数据就不会保留在那里。我曾尝试在表单上使用 onSubmit return false 来防止它被清除,但这没有用。有没有其他方法可以做到这一点,还是我做错了?

我可以使用本地存储来保存表单中的信息,并使用 jQuery 从表单中获取数据并将其放在每日特价页面上——但这只适用于我的机器。是否有类似服务器或域名的本地存储?

我尝试嵌入一个谷歌文档和一个谷歌工作表 - 谷歌的文档显示,当对工作表进行更改时,工作表将在嵌入它们的网站上自动更新,但事实并非如此 - 或者至少我没有设法让它工作。此外,CSS 非常有限,因此它们看起来不太好。

我可以使用 jQuery.load() 从 .html 和 .txt 获取信息到我的每日特价页面 - 但我如何首先将信息获取到 html 或 txt 文件中?文本文件需要在服务器上或在线,以便厨师可以访问它并且网站可以访问它。我可以使用 PHP 和 html 表单写入 .txt,但我无法将它们放在一起。

使用这些非常简单的页面:

表单.html

<form action="action.php" method="POST">
    <input name="field1" type="text" />
    <input name="field2" type="text" />
    <input type="submit" name="submit" value="Save Data">
</form>

Action .php

   <?php
if(isset($_POST['field1']) && isset($_POST['field2'])) {
    $data = $_POST['field1'] . '-' . $_POST['field2'] . "\r\n";
    $ret = file_put_contents('mydata.txt', $data, FILE_APPEND | LOCK_EX);
    if($ret === false) {
        die('There was an error writing this file');
    }
    else {
        echo "$ret bytes written to file";
    }
}
else {
   die('no post data to process');
}

加载.html

<b>Projects:</b>
<ol id="cafe"></ol>

<script>
$( "#cafe" ).load( "mydata.txt" );

</script>

我已经能够填写表格 - 将该数据写入文本文件 - 从文本文件中获取该数据并将其添加到 html 页面 - 但我如何让它完成所有这些工作并且看起来不错?我不知道如何设置它以便在将数据添加到文本文件时将特定的数据添加到特定的 div 中,这样我就可以将该特定的 div 调用到我的 html 页面上并向其中添加 CSS? 我是否必须为每个新数据创建一个新的 .txt 文件?

每个餐厅我有 5 件事需要更新,我有 4 家餐厅。

所以我会: 餐厅 A - 我需要更新 1. 厨师姓名。 2.特别的名字,3.特别的描述,4. child 的特别的名字,5. child 的特别的描述。 餐厅 B - 我需要更新 1. 厨师姓名。 2.特别的名字,3.特别的描述,4. child 的特别的名字,5. child 的特别的描述。
餐厅 C - 我需要更新,1. 厨师姓名。 2.特别的名字,3.特别的描述,4. child 的特别的名字,5. child 的特别的描述。
餐厅 D - 我需要更新 1. 厨师姓名。 2.特别的名字,3.特别的描述,4. child 的特别的名字,5. child 的特别的描述。

什么都不需要保存只是替换 -

所以现在我认为如果我将每条新数据写入不同的 txt 文件,我可以做到这一点。所以餐厅 A 会有 chefname.txt、specialname.txt、specialdescription.txt、kidspecial.txt 和 kiddescription.tx。

有没有人有更好的方法来做到这一点?这似乎是一件简单的事情,我只是很新,不知道是什么 我应该这样做来完成这个。

如有任何想法或帮助,我们将不胜感激。

最佳答案

不使用数据库的最简单方法是使用 JSON,存储在一个简单的 .txt 文件中。然而,这确实需要更多地考虑安全性。最重要的问题是授权他人编辑您的表单,从而修改您的数据。

但为了回答您的问题,我建议如下:

form.html

<form action="action.php" method="POST">
    <select name="restaurant">
        <option value="1">Restaurant 1</option>
        <option value="2">Restaurant 2</option>
        <option value="3">Restaurant 3</option>
        <option value="4">Restaurant 4</option>
    </select>
    <input name="chef" type="text" />
    <input name="special_name" type="text" />
    <input name="special_descr" type="text" />
    <input name="child_name" type="text" />
    <input name="child_descr" type="text" />
    <input type="submit" name="submit" value="Save Data">
</form>

action.php

<?php
if (isset($_POST['submit'])) {
    $data = json_decode(file_get_contents("data.txt"), true); // true for assoc
    $data[$_POST['restaurant']] = array(
        "chef" => $_POST['chef'],
        "special_name" => $_POST['special_name'],
        "special_descr" => $_POST['special_descr'],
        "child_name" => $_POST['child_name'],
        "child_descr" => $_POST['child_descr']
    );
    $newData = json_encode($data);
    file_put_contents("data.txt", $newData);
}
?>

load.php

<?php
$data = json_decode(file_get_contents("data.txt"), true); // true for assoc

foreach($data as $k => $v) {
    echo "<p>" . PHP_EOL;
    echo "Special Restaurant " . $k . ":<br />" . PHP_EOL;
    echo "Chef: " . $v['chef'] . "<br />" . PHP_EOL;
    echo "Name: " . $v['special_name'] . "<br />" . PHP_EOL;
    echo "Description: " . $v['special_descr'] . "<br />" . PHP_EOL;
    echo "Children: " . $v['child_name'] . "<br />" . PHP_EOL;
    echo "Description: " . $v['child_descr'] . "<br />" . PHP_EOL;
    echo "</p>" . PHP_EOL;
}
?>

基本上,在 action.php 中,您首先将 data.txt 文件中的现有数据从 JSON 解码为 PHP 可读的多维数组,键为 1 到 4(餐厅),每个数组包含一个数组,其中包含不同的值厨师,特殊名称等 然后您可以轻松更新此数组,再次将其转换为 JSON 并存储。

在 load.php(不是 load.html)中,您可以再次将 JSON 字符串转换为数组,遍历它并输出每个餐厅的值。

现在,这只是一个例子来说明我将如何处理这个问题,您应该自己添加错误处理和授权检查。

关于javascript - 我可以使用在线表单自动填充 HTML 页面而不使用数据库吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54654965/

相关文章:

javascript - Vue.js 使用伪选择器选择 div 中的最后一个元素

php - Python 3.6 Bittrex API 无效签名

jquery - IE 中的 CSS 问题

jquery - 具有多个条件的 If 语句出现故障

php - =?UTF-8?B??= 通过 php 邮件发送的电子邮件问题

jquery - jQuery 中的 "Which child of its parent am I?"

javascript - 这个 jQuery 元素的 innerHTML 语句有什么问题?

javascript - 如何让这个 Action 更长而不停顿

javascript - ExtJS粘南面板

php laravel 数组 excel mongodb