关于编辑如何使用 <a> 标签内文本字段中的现有文本预填充 x 可编辑弹出窗口

Question

我在从数据库加载数据后渲染了大约 100 多个字段，我的目的是将这些字段显示为普通的可编辑文本字段，其中包含数据。但是当用户点击这些字段中的任何一个时，应该会出现一个 x 可编辑的弹出窗口，并且应该在其中预先填充文本字段的值（这样用户就不必输入所有内容）。

这是html代码：

<a href="#" data-type="text" id="abn" data-pk="1" data-url="/post" data-title="Enter ABN">
 <input type="text" id="abn" name="abn" class="form-control" value="<?php echo $drvData->ABN; ?>" >
</a>

在 JS 中，我只是这样做的：

$.fn.editable.defaults.mode = 'popup';
$('#abn').editable();

但问题是，如果我设置 x-editable 属性 "data-value"，它将显示为 href 而不是文本字段。但是如果我使用

<input type="text" value="<?php echo $drvData->ABN;?>" ...>

它显示弹出窗口为空，任何人都可以帮助我，我认为它与 .editable() 有关以传递值但不知道如何去做。

Answer 1

我不确定这是解决问题的正确方法，但它对我来说非常有效：

在标签内而不是使用我已经使用并做了这样的事情：

<a href="#" data-type="text" id="ABN" data-pk="1" data-url="/post" data-placement="right" data-title="Enter ABN">
<textarea id="abn" name="abn" class="form-control" >
<?php echo $drvData->ABN; ?>
</textarea>
</a>

在 CSS 中，我这样做是为了将文本区域显示为输入字段：

<style> textarea {  height: 38px;  resize: none;} </style>

仅供参考，我正在使用：$.fn.editable.defaults.mode = 'popup';

我做了很多搜索，但找不到任何可以在锚标记内嵌入输入字段的东西，除了这个解决方法，我必须让它工作所以我这样做了:)

关于编辑如何使用 <a> 标签内文本字段中的现有文本预填充 x 可编辑弹出窗口

On edit how to pre-populate x-editable popup with existing text from a text field inside <a> tag

javascript

x-editable

bootstrap-4