Question

这是我的java代码。我想找一个更干净的方法来做到这一点。如何通过序列化访问相同的数据？我计划在一个页面上有多个需要处理的表单。我想要干掉代码而不必专门命名每个字段。

谢谢！

HTML： ItemAmountDescription

                            <tr class="edit_tr" id="3">
                <td class="edit_td">
                    <span class="text" id="name_3">Salary</span>
                    <input type="text" value="Salary" class="editbox" id="name_input_3"/>
</td>                    <td class="edit_td">
                    <span class="text" id="amount_3">100.00</span>
                    <input type="text" value="100.00" class="editbox" id="amount_input_3"/>
</td>                    <td class="edit_td">
                    <span class="text" id="description_3">Salary</span>
                    <input type="text" value="Salary" class="editbox" id="description_input_3"/>
</td>                </tr>

            </tbody>
        </table>

Java代码：

    <script type="text/javascript">
    $(document).ready(function()
    {
        $(".edit_tr").click(function()
        {
            var ID=$(this).attr('id');
            $("#name_"+ID).hide();
            $("#amount_"+ID).hide();
            $("#description_"+ID).hide();
            $("#description_input_"+ID).show();
            $("#name_input_"+ID).show();
            $("#amount_input_"+ID).show();

        }).change(function()
        {
            var ID=$(this).attr('id');
            var name=$("#name_input_"+ID).val();
            var amount=$("#amount_input_"+ID).val();
            var description=$("#description_input_"+ID).val();
            var dataString = 'id='+ ID +'&name='+name+'&amount='+amount+'&description='+description;
            $("#name_"+ID).html('<img src="load.gif" />'); // Loading image

            if(name.length>0 && amount.length>0)
            {


                $.ajax({
                    type: "POST",
                    url: "{{url('budget/edit-income')}}",
                    data: dataString,
                    cache: false,
                    success: function(html)
                    {
                        $("#name_"+ID).html(name);
                        $("#amount_"+ID).html(amount);
                        $("#description_"+ID).html(description);
                    }
                });
            }
            else
            {
                alert('Enter something.');
            }

        });

// Edit input box click action
        $(".editbox").mouseup(function()
        {
            return false
        });

// Outside click action
        $(document).mouseup(function()
        {
            $(".editbox").hide();
            $(".text").show();
        });

    });
</script>

Answer 1

您提到序列化...使用$('form').serialize();为ajax创建字符串data

JQuery - 编辑表，通过序列化获取数据？

1 个答案: