Question

我有一个动态行表，其中一个<td>是一个多选字段。我面临的问题是我在多选字段中看不到任何样式。我怎么能解决这个问题。

<form name="add_name" id="add_name">
<table class="table" id="dynamic_field">
<thead> <tr><th>Days</th> <th>Start time</th> <th>End time</th<th>venue</th>   <th></th></tr> </thead>
<tbody>
<tr height="auto">   
<td class="col-sm-6">

        <select id="days" class="multiselect" multiple="">
                <option value="1">Sunday</option>
                <option value="2">Monday</option>
                <option value="3">Tuesday</option>
                <option value="4">Wednesday</option>
                <option value="5">Thursday</option>
                <option value="6">Friday</option>
                <option value="7">Saturday</option>
        </select>
 </td>
<td><input type="time"  id="doc_timestarts" name="doc_timestarts" style="border:none;height:30px;" /></td>
<td><input type="time"  id="doc_timeends"name="doc_timeends"   style="border:none;height:30px;" /></td>
<td><input type="text" id="form-field-icon-1"  style="border:0;height:30px;"/></td>
<td><button type="button" name="add" id="add" class="btn btn-success">Add More</button>
</td>
</tr> 
 </tbody>
</table>  
  <input type="button" name="submit" id="submit" class="btn btn-info" value="Submit"  />

和我的脚本部分：

$(document).ready(function(){ 
   var i=1; 
   $('#add').click(function(){ 
      i++;     
      $('#dynamic_field').append('<tr id="row'+i+'"><td class="col-xs-12 col-sm-6"> <select id="days" class="multiselect" multiple=""><option value="1">Sunday</option><option value="2">Monday</option><option value="3">Tuesday</option><option value="4">Wednesday</option><option value="5">Thursday</option><option value="6">Friday</option><option value="7">Saturday</option></select></td><td><input type="time"  id="doc_timestarts" name="doc_timestarts"   style="border:none;height:30px;" /></td><td><input type="time" id="doc_timeends"name="doc_timeends"   style="border:none;height:30px;" /></td><td><input type="text" id="form-field-icon-1"  style="border:0;height:30px;"/></td><td><button type="button" name="remove" id="'+i+'" class="btn btn-danger btn_remove">X</button></td>  </tr>');
});

$(document).on('click', '.btn_remove', function(){  
  var button_id = $(this).attr("id");   
  $('#row'+button_id+'').remove();  
});  

$('#submit').click(function(){            
   $.ajax({  
     url:"name.php",  
     method:"POST",  
     data:$('#add_name').serialize(),  
     success:function(data)  
     {  
         alert(data);  
         $('#add_name')[0].reset();  
     }  
    });  
   });  

 });

请找到jsfiddle。 https://jsfiddle.net/zty2us1s/

动态行与多选

0 个答案: