Question

我有两张桌子：

表状态

--------------------
| id_state | state |
--------------------
|    1     | AAA   |
|    2     | BBB   |
|    3     | CCC   |
--------------------

表省

-------------------------------------
| id_province | id_state | province |
-------------------------------------
|    1        | 1        | qqq      |
|    2        | 1        | www      |
|    3        | 1        | eee      |
|    4        | 2        | rrr      |
|    5        | 2        | ttt      |
-------------------------------------

我想创建可以动态添加省的编辑字段，如下所示：例如，查询是

  "SELECT s.state, p.province FROM state s, province p WHERE p.id_state=s.id_state AND id_state=1"

State   : AAA
Province: qqq
          www
          eee

省的值必须显示为输入表格，我想要做的就是添加＆＃34;删除＆＃34;输入旁边的按钮并添加＆＃34;添加更多＆＃34;输入下方的按钮。

State   : AAA
Province: qqq (remove)
          www (remove)
          eee (remove)
          some value (remove) //if user click add more
          (add more)

我是JQuery的新手，我试图在谷歌搜索，但我仍然不明白。到目前为止，我已经尝试过了：

$(document).ready(function() {
    var max_fields      = 10; //maximum input boxes allowed
    var wrapper         = $(".input_fields_wrap"); //Fields wrapper
    var add_button      = $(".add_field_button"); //Add button ID

    var x = 1; //initlal text box count
    $(add_button).click(function(e){ //on add input button click
        e.preventDefault();
        if(x < max_fields){ //max input box allowed
            x++; //text box increment
            $(wrapper).append('<div><input type="text" name="mytext[]"/><a href="#" class="remove_field">Remove</a></div>'); //add input box
        }
    });

    $(wrapper).on("click",".remove_field", function(e){ //user click on remove text
        e.preventDefault(); $(this).parent('div').remove(); x--;
    })
});

And in the HTML:
<div class="input_fields_wrap">
    <button class="add_field_button">Add More</button>
    <div><input type="text" name="mytext[]"></div>
</div>

但是，我想在输入字段下面添加更多按钮，我希望从数据库中回显我以前的数据。你能给我一个简短的解释吗？谢谢。

Answer 1

Selamat malam。

看起来你还没有任何服务器端代码。

如果您使用PHP，请尝试阅读本文：

教程php ajax将表多行插入：http://www.amitpatil.me/add-edit-delete-rows-dynamically-using-jquery-php/

动态输入形式JQuery

1 个答案: