{% for item in special_rows %}
                <tr>
                    <td class="special-stains-material-id"><select id="special-stains-material-id-{{item.index}}" name="special_stains_material_id.{{item.index}}" data-table="special-stains" data-index="{{item.index}}" class="material-id-choice"></select></td>
                    <td class="special-stains-short-desc"><div id="special-stains-short-desc-{{item.index}}"></div></td>
                    <td class="special-stains-science-info"><input type="text" id="special-stains-science-info-{{item.index}}" name="special_stains_science_info.{{item.index}}" class="row-text" value="{{ item.science_info }}" size="10" /></td>
                    <td class="special-stains-stain">
                        <select id="special-stains-stain-{{item.index}}" name="special_stains_stain.{{item.index}}">
                            {% for stain in special_stains %}
                                <option value="{{stain.value}}">{{stain.name}}</option>
                            {% endfor %}
                        </select>
                    </td>
                    <td class="special-stains-instructions"><input type="text" id="special-stains-instructions-{{item.index}}" name="special_stains_instructions.{{item.index}}" class="row-text" value="{{ item.special_instructions }}" size="10" /></td>                    
                </tr>
                {% endfor %}
                <script>
                $(".special-stains-table-form .special-stains-tbody tr .special-stains-material-id .material-id-choice").on('change', function(){
                    var selid = $(this).attr('id');
                    var index = $(this).attr('data-index');
                    var optindex = $("#"+selid+" option:selected").attr('data-index');
                    var descval = $("#routine-short-desc-"+optindex).val()
                    $("#special-stains-short-desc-"+index).html(descval);
                });
                </script>