@php
$field_list =$GetFieldValues;
@endphp
<div class="col-md-12">
	<table class="table style-2 table-hover no-footer" id="table1">
		<thead>
			<tr>
				<td>Label Name</td>
				<td>Fields</td>
				<td>Display Type</td>
				<td>Order No.</td>
				<td>Enable/Disable</td>
			</tr>
		</thead>
		@php
		 $loopcount=0;
		 $i=1;
		 $HoldMe="";
		@endphp
		<tbody>
		@foreach($field_list as $fieldname)
			<tr id="Row{{$loopcount}}">
				 @php
				 $fields=$fieldname['ColumnName'];
				 $LabelValue=$fieldname['LabelValue'];
				 $DispayType=$fieldname['DisplayType'];
				 $Display="";
				 if($DispayType==1)
				 {
					 $Display="textBox";
				 }
				 elseif($DispayType==2)
				 {
					  $Display="DropDown";
				 } 
				 elseif($DispayType==3)
				 {
					  $Display="MultiSelect";
				 } 
				 elseif($DispayType==4)
				 {
					  $Display="Date";
				 } 
				 elseif($DispayType==5)
				 {
					  $Display="Radio";
				 }
				 elseif($DispayType==6)
				 {
					  $Display="CheckBox";
				 } 
				 elseif($DispayType==7)
				 {
					  $Display="TextArea";
				 } 
				 elseif($DispayType==8)
				 {
					  $Display="Relate";
				 } 
				 elseif($DispayType==9)
				 {
					  $Display="Photo";
				 } 
				 elseif($DispayType==10)
				 {
					  $Display="TextEditor";
				 } 
				 elseif($DispayType==11)
				 {
					  $Display="Phone";
				 } 
				 elseif($DispayType==12)
				 {
					  $Display="E-Mail";
				 } 
				 elseif($DispayType==13)
				 {
					  $Display="Float";
				 } 
				 elseif($DispayType==14)
				 {
					  $Display="DateTime";
				 } 
				 elseif($DispayType==15)
				 {
					  $Display="AssignedTo";
				 } 
				 elseif($DispayType==16)
				 {
					  $Display="Document";
				 } 
				 elseif($DispayType==17)
				 {
					  $Display="Numbers";
				 } 
				 elseif($DispayType==18)
				 {
					  $Display="ZipCode";
				 } 
				 elseif($DispayType==19)
				 {
					  $Display="Characters";
				 }
				 elseif($DispayType==20)
				 {
					  $Display="CloudAgent_Click2Call";
				 }
				 elseif($DispayType==21)
				 {
					  $Display="CloudAgent_Click2Call_Masked";
				 }
				 elseif($DispayType==22)
				 {
					  $Display="Masked";
				 }
				 elseif($DispayType==23)
				 {
					  $Display="Dependent_RelateTo";
				 }
				 elseif($DispayType==24)
				 {
					  $Display="Address";
				 }
				 elseif($DispayType==25)
				 {
					  $Display="SelfRelate";
				 }
				 elseif($DispayType==26)
				 {
					  $Display="DropDown";
				 }
				$OrderValue=$loopcount;
				 @endphp
				 <td>{{$LabelValue}}</td>
				 <td>{{$fields}}</td>
				 <td>{{$Display}}</td>
				<td> 
						<input type="hidden" class="form-control" name="DemographyId{{$loopcount}}" id="DemographyId{{$loopcount}}" value="{{$fieldname['DemographyConfigId']}}">
						<input type="number" min="1" class="form-control" name="OrderNO{{$loopcount}}" id="OrderNO{{$loopcount}}" value="{{$fieldname['SortOrder']}}" onclick="EnableDisablechk({{$loopcount}})">
				</td>
				<td>
					<!--<input type="checkbox" class="form-control" name="EnableDisable{{$loopcount}}" id="EnableDisable{{$loopcount}}" onclick="EnableDisable({{$loopcount}})" {{$fieldname['CheckMe']}} >-->
					<div class="n-chk">
						<label class="new-control new-checkbox checkbox-info">
						  <input type="checkbox" class="new-control-input" name="EnableDisable{{$loopcount}}" id="EnableDisable{{$loopcount}}" onclick="EnableDisable({{$loopcount}})" {{$fieldname['CheckMe']}} >
						  <span class="new-control-indicator"></span>
						</label>
					</div>
				</td>
			 </tr>
			 @php
			 $i++;
			 $loopcount++;
			 $k=0;
			 @endphp
		@endforeach
		</tbody>
	</table>

</div>
<script type="text/javascript">
$('tbody').sortable(
	{
		axis:'y',
		stop:()=>{
			
			oldArray=[];
					for(i=0;i<'{{$loopcount}}';i++)
					{
						fieldid="OrderNO"+i;
						oldArray.push($('#'+fieldid).val());
					}
					console.log(oldArray);
					//alert(oldArray);
					my_special_function('{{$loopcount}}',oldArray);
		}
	}
	);
my_special_function=(loopcount,oldArray)=>{
	for(i=0;i<=loopcount;i++)
			{
				fieldid="OrderNO"+i;
				rowid="Row"+i;
				//EnableDisable="OrderNO"+i;
				sortorderval=$('#'+rowid).index()+1;
				$('#'+fieldid).val(sortorderval);
				// $('#'+fieldid).trigger("onchange");
			}
			//alert(EnableDisable);
			newArray=[];
			for(i=0;i<'{{$loopcount}}';i++)
			{
				fieldid="OrderNO"+i;
				sortOrder=$('#'+fieldid).val();
				console.log(fieldid);
				newArray.push($('#'+fieldid).val());

				if(oldArray[i]!=sortOrder)
				{
					$('#'+fieldid).trigger("onclick");
				}
			}
}
</script>