javascript
  • jquery
  • 2015-05-29 84 views 3 likes 
    3

    我在我的页面中有一个动态表单,并且包含了一个自动计算总数。 现在我的问题是我想用数据的属性来获取特定的输入值:如何使用tbody中的数据属性获取输入值?

    我有这样的代码:

    $('#add-particular').on('click', function(){ 
    
         var add_row = '<tbody id="row-parent-' + quot_row + '">'; 
          add_row += ' <tr id="quot-parent-' + quot_row + '" class="uk-animation-slide-left" style="background: #C8D4DA">'; 
          add_row += '  <td class="uk-text-center uk-text-bold">' + quot_row + '.0</td>'; 
          add_row += '  <td class="uk-text-center"><input type="text" class="uk-form-width-medium" name="quotation[' + quot_row + '][\'particular\']" data-name="particular" /></td>'; 
          add_row += '  <td class="uk-text-center"><input type="number" min="0" name="quotation[' + quot_row + '][\'unit\']" data-name="unit" class="uk-form-width-small uk-text-center" value="0" onClick="this.select()" onChange="computeParentTotal(' + quot_row + ', \'int\')" /></td>'; 
          add_row += '  <td class="uk-text-center">'; 
          add_row += '   <select name="quotation[' + quot_row + '][\'unit_label\']" class="uk-form-width-small" data-name="unit_label">'; 
          add_row += '    <option value="">--</option>'; 
          add_row += '    <option value="sqm">Sqm</option>'; 
          add_row += '    <option value="lot">Lot</option>'; 
          add_row += '    <option value="sets">Sets</option>'; 
          add_row += '   </select>'; 
          add_row += '  </td>'; 
          add_row += '  <td class="uk-text-center"><input type="text" class="uk-text-right uk-form-width-small" value="0.00" onChange="computeParentTotal(' + quot_row + ', \'dec\')" name="quotation[' + quot_row + '][\'unit_price\']" data-name="unit_price" /></td>'; 
          add_row += '  <td class="uk-text-center"><input type="text" class="uk-text-right uk-form-width-small" id="parent-subtotal-' + quot_row + '" readonly name="quotation[' + quot_row + '][\'total_price\']" data-name="total_price"/></td>'; 
          add_row += '  <td class="uk-text-center"><button type="button" onClick="addParentParticular(' + quot_row + ')" class="uk-button uk-button-primary"><i class="fa fa-plus-circle"></i></button> <button type="button" class="uk-button uk-button-danger" onClick="removeParentParticular(' + quot_row + ')"><i class="fa fa-minus-circle"></i></button></td>'; 
          add_row += ' </tr>'; 
          add_row += '</tbody>'; 
    
         $('#no-quot').remove(); 
         $('#quotation-list').append(add_row); 
    
         quot_row++; 
    
        }); 
    

    而且我有一个事件触发这样的:

    function computeParentTotal(id, type) { 
        var unit = $('#quot-parent-' + id + ' td').data('unit').val(); 
        $('#parent-subtotal-' + id).val(unit); 
    } 
    

    但我得到以下错误:

    TypeError: $(...).data(...) is undefined

    回答

    2

    您需要使用attribute equals selector作为unitdata-name是属性

    var unit = $('#quot-parent-' + id + ' td input[data-name="unit"]').val(); 
    

    var unit = $('#quot-parent-' + id + ' td').data('unit')将尝试从第一td元件得到在'#quot-parent-' + id元件中不存在这样的误差的unit的值的值。

    +0

    哇谢谢它的作品。 – Jerielle

    +0

    是的你是正确的我没有在选择器中包含输入标签:) – Jerielle

    相关问题