如何从骨干js的HTML表单中获取JSON数据

Question

我正在Backbone.js视图中创建一个动态表单。我希望在不使用jQuery的情况下从视图中获取表单中的所有JSON数据。有没有办法获取数据？

例如：当您勾选复选框时，我只想要检查字段的数据。

<table class="table">
                  <thead>
                    <tr>
                      <th></th>
                      <th>{{labels.selectImage}}</th>
                      <th>{{labels.nameVisibleToShop}}</th>
                      <th>{{labels.sourceCode}}</th>
                      <th>{{labels.pricePerItem}}</th>
                    </tr>
                  </thead>
                  <tbody>
                      <tr id ="school-imageId-{{categoryImage.cmsId}}">
    <td><input type="checkbox" class="form-control mz-embrodiary-enable"/></td>
    <td><img width="40px" src="{{categoryImage.imageUrl}}" /></td>
    <td>
        <input type="text" name="name" class="form-control" placeholder="{{labels.nameVisibleToShop}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="name">{{labels.genericRequired}}</span>
    </td>
    <td>
        <input type="text" name="sourceCode" class="form-control" placeholder="{{labels.sourceCode}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="name">{{labels.genericRequired}}</span>
    </td>
    <td>
        <input type="text" name="price" class="form-control" placeholder="{{labels.enterPrice}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="price">{{labels.genericRequired}}</span>
    </td>
  </tr>
    <tr id ="school-imageId-{{categoryImage.cmsId}}">
    <td><input type="checkbox" class="form-control mz-embrodiary-enable"/></td>
    <td><img width="40px" src="{{categoryImage.imageUrl}}" /></td>
    <td>
        <input type="text" name="name" class="form-control" placeholder="{{labels.nameVisibleToShop}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="name">{{labels.genericRequired}}</span>
    </td>
    <td>
        <input type="text" name="sourceCode" class="form-control" placeholder="{{labels.sourceCode}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="name">{{labels.genericRequired}}</span>
    </td>
    <td>
        <input type="text" name="price" class="form-control" placeholder="{{labels.enterPrice}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="price">{{labels.genericRequired}}</span>
    </td>
  </tr>
    <tr id ="school-imageId-{{categoryImage.cmsId}}">
    <td><input type="checkbox" class="form-control mz-embrodiary-enable"/></td>
    <td><img width="40px" src="{{categoryImage.imageUrl}}" /></td>
    <td>
        <input type="text" name="name" class="form-control" placeholder="{{labels.nameVisibleToShop}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="name">{{labels.genericRequired}}</span>
    </td>
    <td>
        <input type="text" name="sourceCode" class="form-control" placeholder="{{labels.sourceCode}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="name">{{labels.genericRequired}}</span>
    </td>
    <td>
        <input type="text" name="price" class="form-control" placeholder="{{labels.enterPrice}}" disabled/>
        <span class="mz-validationmessage hidden" data-mz-validationmessage-for="price">{{labels.genericRequired}}</span>
    </td>
  </tr>
                  </tbody>
              </table>