Question

我有一个表格，你可以点击它来获取列和单元格值，例如：

{"name" : Clark}

现在，如何直接将输出放入表单并通过单击同一个表格单元保存到数据库中，而无需按钮或显示字段。 HTML中的字段仅用于测试，稍后会隐藏它。

非常感谢任何帮助

这是我的代码

model.py

class OnClickFormSave(models.Model):
    data = models.CharField(max_length=100)

    def __str__(self):
        return self.data

form.py

class OnClickFormSaveForm(forms.ModelForm):
    class Meta:
        model = OnClickFormSave
        fields = ['data']

view.py

def formsave_view(request):
    form = OnClickFormSaveForm(request.POST or None, request.FILES or None)
    if form.is_valid():
        instance = form.save(commit=False)
        instance.save()
        return HttpResponseRedirect('/form')
    return render(request, 'onClickSave.html', {'form': form})

HTML

   <form method="post" enctype="multipart/form-data">{% csrf_token %}
            {{ form.data }}
        <input  type="submit" value="Save Changes" />
   </form>
<table align="center" id="tableID" border="1" style="cursor: pointer;">
<thead>
    <tr>
        <th id="name">name</th>
        <th id="age">age</th>
        <th id="ID">ID</th>
    </tr>
</thead>
<tbody>
    <tr>
        <td>Clark</td>
        <td>29</td>
        <td>1</td>
    </tr>
    <tr>
        <td >Bruce</td>
        <td>30</td>
        <td>2</td>
    </tr>
</tbody>
</table>

的Javascript

$('table tbody tr td').on("click", getColumnID);
function getColumnID() {
    var $td = $(this),
        $th = $td.closest('table').find('th').eq($td.index());
    var head = $th.attr("id");
       $row = ($(this).text());
       var table = $row;
    var cell = `{"${head}" : ${table}}`;
    console.log(cell);

}

Answer 1

您可以将数据与数据一起调用！ POST方法足够好。在jQuery.post中，您已经拥有了单元格变量中的数据。

// before that you need to change the dict to `{'data': value}` so django will pick up this...
$.post( "/formsave-view", cell)
  .done(function( data ) {
    console.log(data);
  });

onClick HTML表格单元格保存到django数据库

1 个答案: