在HTML中使用模式弹出窗口并返回上一页

Question

我正在学习HTML，CSS，JavaScript和SQL。

以下信息是“上下文”

该方案是一个网站，我可以在其中添加有关狗的信息，关于狗的主人的信息，并将狗与主人链接。数据存储在SQL数据库中。

我可以成功地添加有关狗和主人的记录，并通过将OwnerTable主键作为DogTable中的外键来链接它们。都很好。

必须能够创建最初没有所有者的狗记录，然后再添加所有者。或者，当我添加一条狗记录时，我可能会将其分配给数据库中的现有所有者。

说我要添加一条狗记录，然后意识到我想链接到不在数据库中的所有者。

现在是问题/问题。

我可以在添加狗的页面上添加一个按钮，这将允许我添加新的所有者，而在添加新狗记录的中间。在我看来，从我阅读的内容来看，有两种方法：

1. 只需使用href切换到现有的“添加所有者”页面
2. 当我单击添加所有者按钮时，创建模式弹出窗口（正确的术语？）>

现在1.似乎不太理想，因为在添加新所有者后，我将不得不导航回添加狗页面。

2. 似乎更具吸引力，因为工作流没有中断，这就像用户体验是“我需要添加一条狗，但我需要添加一个所有者。我将快速添加一个所有者，然后继续添加该狗而不会丢失我已经输入的有关狗的信息“

但是，我期望2出现的问题是，我将有两个执行相同操作的代码实例-一个用于添加所有者的“独立”网页和一个用于添加所有者的模式弹出窗口。我担心的是，页面和模式之间将有重复的代码-如果以后我需要以某种方式更改“添加所有者”代码，这将导致维护问题。

是否有解决这种重复的方法-或我可以使用的其他HTML / JS设施-但仍然保留（1）“独立”添加所有者或（2）在添加新狗记录的同时添加所有者的功能？] >

我正在学习HTML，CSS，JavaScript和SQL。以下信息是“上下文”。该场景是一个网站，我可以在其中添加有关狗的信息，有关狗的所有者的信息并链接狗的信息...

Answer 1

您可以对添加所有者页面和模式版本使用相同的请求端点。您唯一需要维护的就是添加所有者页面。如果您不使用任何服务器端技术，我认为最简单的方法是将iframe放在模式内，以便您可以为模式和添加所有者页面使用相同的html文件。这篇文章提供了一些有关仅使用普通javascript进行Asp.Net称为partial view的信息-Partial render in HTML/JavaScript

警告：如果某人在浏览器中禁用了javascript，则使用纯javascript方法很容易失败。