【Web前端问题】请问如何设计前端UI，方便编辑SQL多对多关系？
我正在做一个在线书店，显然书和作者是多对多关系（一本书可以有多个作者，一个作者可以写多本书），因此需要三个表：
书表B: id, title, ...
作者表A: id, name, ...
两者关系表C: bid, aid。
现在我们向数据库录入一本书（假定是数据库没有的新书），那么一定要向B表和C表插入新记录，但A表呢？这本新书的作者可能已经在A中了，也可能不在，若不在，就应先创建作者插入到A中，取得自动递增id，才能和bid一起插入到C中。
我想问的是，前端UI怎么设计，才能优雅地提示用户该如何录入作者，例如：
当作者不存在时，提示用户先创建作者；
当作者已存在或刚创建完，如何把作者id和这本书关联起来？
我曾想过用作者名字来找id，比如用一个 input 框要求用户输入作者名字，然后Ajax提交到后台搜索数据库，没找到时提示用户作者尚不存在，若找到了……
但这种方案也有几个挺难办的问题：
1.如果用户把名字输错导致没有找到怎么办？当作者是外国人时名字很容易输错
2.用户输对了，但却找到多个重名的怎么办？当作者是中国人时重名并不罕见
拜托大家帮我设计一下UI，我觉得不管怎么样，后台肯定都有办法处理！所以我不担心后台，我希望前端UI能令用户用起来方便。
谢谢！
回答：
我个人觉得：
方案一：查找再提示
列出一个添加新书的表单，表单作者一栏里，可以边输入边显示（像百度搜索那样），然后用户选择一个，作者名字就成为一个标签一样。类似于下面这种感觉：
但是不建议做成这种标签质感的设计，会让人感觉是关键词啥的。
方案二：弹出窗口型
列出一个添加新书的表单，表单作者一栏里，改成一个选择作者的按钮，然后弹出一个小弹窗，可以直接搜索作者，也可以按类别/拼音开头之类的查找，想要哪个就点下哪个。如果没有自己想要的作者，就点击添加作者。
方案三：后台直接处理
列出一个添加新书的表单，表单作者一栏里，作者自己输入。提交内容后，后台自己判断有没有这个作者，如果没有就插入一条新的。这种就用户操作简单很多，但是如果怕用户输错的话，可以在旁边加个小提示：你输入的是不是___？之类的。
如果是重名的情况，可以考虑鼠标移动到作者名字的时候，出现一个小气泡，内容就是作者的简介，这样应该能区分开吧。
回答：
可以参考一下element ui的的输入框。
- 姓名模糊搜索
- 搜索结果显示可以分辨作者的信息。如：学校、出生年份
回答：
第3张关系表完全可以 在书表B 里加一个 authorIdList字段 代替，对应类型为JSON
回答：
问题1：使用模糊搜索，有一种输入框是输入部分文字，会显示出一个下拉列表，把模糊搜索匹配的结果显示出来
问题2：同上，在下拉列表中选择正确的人名
以上是 【Web前端问题】请问如何设计前端UI，方便编辑SQL多对多关系？ 的全部内容， 来源链接： utcz.com/a/135991.html
