从表单提交中提取ID的更好方法Javascript/Django

Question

目前我编写的工作，但它似乎相当粗糙。基本上这里就是我所（简化）：

JQuery的准备：

<script type="text/javascript"> 

    $(document).ready(function() { 
     $('div.partDelete').click(function() { 

     // TODO this seems like a dirty hack 
     var split = this.id.split('_'); 
     if(split.length == 3) { 
      $('#part_id').val(split[0]); 
      alert($('#part_id').val()); 
      $('#removePartForm').submit(); 
     } else { 
      alert('There was a problem removing the selected part'); 
     } 
    }); 

</script> 

我使用的形式：

<form id="removePartForm" action="{% url remove_part %}" method="post"> 
    <input type="hidden" id="part_id" name="part_id" value="-1" /> 

    {% for part in current_build.parts.all %} 
     <div id="{{ part.id }}_part_id" class="partDelete">remove</div> 
    {% endfor %} 
</form> 

所有我想要做的是设置隐藏的输入取part.id已被用户选中，以便我可以在我的视图中使用它。

对于所有我知道这是正确的方式去做这件事，但我只是有一种感觉，它不是。我是Django的新手& JQuery，所以可能会有一些内置的功能，我还没有找到。

感谢您的任何建议，您可能有！

解决方案（见下文mikaelb的答案）

的Javascript：

$('div.partDelete').click(function() { 
    var selected_id =$(this).data("id"); 
    $('#part_id').val(selected_id); 
    $('#removePartForm').submit(); 
}); 

HTML变化：

<div class="partDelete" data-id="{{ part.id }}">remove</div> 

Answer 1

首先的; ID不应以数字开头（http://www.w3.org/TR/html4/types.html#type-name）。

除此之外，你通常使用data- *属性来设置ID从服务器端与JS进行通信。 data- *属性可以是任何你想要的。所以data-foo =“”是一个有效的属性。

例子：
HTML：

<div class="item" data-id="{{ part.id }}"> 
    <p>Foo</p> 
</div> 

的Javascript：

$(function() { // same as document read 

    $(".button-class").on("click", function() { 
     // Here "this" will be the element 
     var id = $(this).data("id"); // same as getting attribute data-id 
     // Could also use $(this).attr("data-id") 
    }); 
}); 

希望这有助于。

编辑：移动评论以使其更清楚，将示例更改为更加具体到OP的问题。