创建表模板并从表单输入中呈现数据

时间:2014-02-13 23:39:27

标签: backbone.js

表单输入字段具有参数X和Y.如果我选择运算符(加,减,乘或除),结果应显示在结果区域中。应使用Backbone.js将所有这些值动态传输到表视图。自从我开始学习核心信息以来,有人可以建议如何通过Backbone.js在表中创建动态视图以及如何从表单输入中收集数据吗?

HTML:

<!DOCTYPE html>
<html>
<head>
    <title>Math Function</title>
    <script src="Script/jquerylibrary.js"></script>
    <script src="Script/Underscore.js"></script>
    <script src="Script/Backbonelibrary.js"></script>
    <script src="JavaScript/mathFunction.js"></script>
    <link rel="stylesheet" type="text/css" href="CSS/mathFunction.css"/>
</head>
<body>
    <form>
        <label>Enter Value of X :</label>
        <input type="text" id="parameter1">
        <label>Enter Value of Y :</label>
        <input type="text" id="parameter2">
        <select>
            <option>Add</option>
            <option>Subtract</option>
            <option>Multiply</option>
            <option>Divide</option>
        </select>
        <label>Result of the fucntion :</label>
        <input type="text" id="Result">
    </form>
    <br>
    <hr/>
    <div>
        <table>
            <thead>
                <tr>
                    <th>Parameter X</th>
                    <th>Parameter Y</th>
                    <th>Operator</th>
                    <th>Result</th>
                </tr>
            </thead>
            <tbody id="data">
                <tr>
                    <td>dummy</td>
                    <td>dummy</td>
                    <td>dummy</td>
                    <td>dummy</td>
                </tr>
            </tbody>
        </table>
    </div>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

带有Backbone的表中的动态视图的

Here's an example

var Row = Backbone.View.extend({... // view that represents a row in the table

var MyView = Backbone.View.extend({... // view that interact with the inputs