laravel 5.8 bootstrap在Jquery中不起作用 [英] laravel 5.8 bootstrap not working in Jquery

问题描述

我正在使用> https://developer.snapappointments.com/bootstrap-select/examples /

它在视图中工作正常，但是当我在下面的Jquery中使用此代码时，它无法正常工作.帮我解决这个问题.

its working fine in view but when i using this in Jquery below code its not working. help me to fix this.

查看代码

    <table id="tableAppointment" style="background-color:powderblue;">
     
        <tr>
        <th style="text-align:center;" colspan="1">NAME</th>
        <th style="text-align:center;" colspan="1">HSN/SAC</th>
       
       
      <th><a href="#" class="addRow btn btn-warning vertical-center"><i class="glyphicon glyphicon-plus">ADD</i></a></th>
      </tr>
       
       <tr>
        <td >
    
            <select class="selectpicker" data-live-search="true"  name="product_name[]">
           <option value=""></option>
          @foreach ($addnewitem as $key=>$addnewitems)
            <option  >{{$addnewitems->product_name}}</option> 
          @endforeach </select>
    
        </td>
    
     
        <td >
              <select class="selectpicker" data-live-search="true"  name="part_no[]">
           <option value=""></option>
          @foreach ($addnewitem as $key=>$addnewitems)
            <option  >{{$addnewitems->part_no}}</option> 
          @endforeach </select>
    
        </td>
    
      <td><a href="#" class="btn btn-danger "><i class="glyphicon glyphicon-remove">REMOVE</i></a></td>
      </tr>
    
    </table>
    
    <script type="text/javascript">
    
        $('.addRow').on('click',function(){
            addRow();
        });
        function addRow()
        {
        
            var tr='<tr>'+
    
    
            '<td ><select class="selectpicker" data-live-search="true"  name="product_name[]"><option 
 value=""></option> @foreach($addnewitem as $key=>$addnewitems)<option  >{{$addnewitems->product_name}}</option>@endforeach </select></td>'+
    
    
    
             
'<td ><select class="selectpicker" data-live-search="true"  name="part_no[]"><option value=""></option> @foreach($addnewitem as $key=>$addnewitems)<option  >{{$addnewitems->part_no}}</option>@endforeach </select></td>'+
    
    
           
            
'<td><a href="#" class="btn btn-danger remove"><i class="glyphicon glyphicon-remove">REMOVE</i></a></td>'+
         
            '</tr>';
            $('tbody').append(tr);
        };
        $('.remove').live('click',function(){
            var last=$('tbody tr').length;
            if(last==1){
                alert("you can not remove last row");
            }
            else{
                 $(this).parent().parent().remove();
            }
        
        });
    
    </script>

推荐答案

单击$('.addRow')后，您需要重新渲染selectpicker

after click $('.addRow') u need to re-render selectpicker

您可以使用render方法强制重新渲染引导选择的ui.如果您以编程方式更改了任何会影响元素布局的基础值，这将很有用.

You can force a re-render of the bootstrap-select ui with the render method. This is useful if you programatically change any underlying values that affect the layout of the element.

$(document).on('click','.addRow',function(){
    addRow();
    $('.selectpicker').selectpicker('refresh');

});

这篇关于laravel 5.8 bootstrap在Jquery中不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！