web2py的 - 渲染Ajax响应为HTML表web2py、Ajax、HTML

2023-09-10 21:55:18 作者:巴黎铁塔下╮仰望幸福

我是新来的web2py,Python的堆栈。我有一个简单的要求来实现。我需要从UI形式传递一些数据到控制器的动作进行处理。加工后的行动返回响应回,我需要呈现为同一观点的HTML表视图中的数据。我使用AJAX用于这一目的。

I am new to Web2Py, Python stack. I have a simple requirement to implement. I need to pass some data from a UI form to a Controller action for processing. After processing the data that action returns a response back to the view which I need to render as an HTML table on the same view. I am using AJAX for this purpose.

我能够得到响应返回给看法,但不知道如何遍历该响应的元素,呈现为一个HTML表格。当我运行低于code它是所有的响应内容替换整个目标DIV。

I am able to get the response back to the view but don't know how to iterate over the elements of that response to render as an HTML table. When I run the below code all it does is replace the entire target DIV with the response content.

我知道这是pretty的直白这在Java中,Grails的,PHP等,但,我在努力寻找一种方法,即在web2py中。

I know it's pretty straightforward to this in Java, Grails, PHP, etc. But, I am struggling to find a way to that in Web2Py.

我在code以下片段: index.html的:

I have the following snippets in my code: index.html:

<script>
jQuery('#input_form').submit(function() {
    ajax('{{=URL('process_form')}}',
            ['input_var1','input_var2','input_var3','input_var4'], 'results_div');
    return false;
});

<div id="results_div">
    <form>
        <div class="table-responsive">
            <table id="records_table" class="table table-bordered">
                <tr>
                    <th>Col Head 1</th>
                    <th>Col Head 2</th>
                    <th>Col Head 3</th>
                    <th>Col Head 4</th>
                </tr>
                <tr>
                    <td>Col Content 11</td>
                    <td>Col Content 12</td>
                    <td>Col Content 13</td>
                    <td>Col Content 14</td>
                </tr>
                <tr>
                    <td>Col Content 21</td>
                    <td>Col Content 22</td>
                    <td>Col Content 23</td>
                    <td>Col Content 24</td>
                </tr>
            </table>
        </div>
    </form>
</div>

default.py

default.py

def process_form():
    results = request.vars
    return DIV(results)

任何帮助在这方面将大大AP preciated。

Any help in this regard would be greatly appreciated.

推荐答案

在默认情况下,阿贾克斯函数需要接收HTML,它将把其ID传入的元素中,所以,最简单的方法是让你的 process_form 函数返回表的完整的HTML,所以 results_div div的内容将被替换为新表。您可以使用web2py的HTML辅助建立在Python的HTML,也可以使用一个模板,与任何其他控制器动作。例如:

By default, the Ajax function expects to receive HTML, which it will place inside of the element whose id is passed in. So, the simplest approach is to have your process_form function return the full HTML of the table, so the content of the results_div div will be replaced with the new table. You can build the HTML in Python using the web2py HTML helpers, or you can use a template, as with any other controller action. For example:

def process_form():
    inputs = ['input1', 'input2', 'input3']
    html = DIV(TABLE(THEAD(TR(TH('Column 1'), TH('Column 2'), TH('Column 3')),
                           _class='test', _id=0),
                     TR([request.vars[input] for input in inputs]),
                     _id='records_table', _class='table table-bordered'),
               _class='table-responsive')
    return html

另外,你可以有 process_form 函数返回的JSON数据。在这种情况下,可以使第三个参数阿贾克斯()一个JavaScript函数,返回的JSON数据将被传递给函数。该功能可以再填充现有的表用新的数据。

Alternatively, you could have the process_form function return JSON data. In that case, you can make the third argument to ajax() a Javascript function, and the returned JSON data will be passed to that function. The function could then populate the existing table with the new data.