JSFiddle - React, Tailwind, and code Playground

by Mahmoud Kassem

HTML

<script src="jquery.js"></script>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<select id="names">
  <option value="فلان">عقيد فلان</option>
  <option value="علان">عقيد علان</option>
</select>

<table>
<tbody id="target">

</tbody>
</table>

JavaScript

$(document).ready(function(){
	$('#names').on('change', function(){
  	
  	var val = $(this).val();
    
    $.ajax({
    	method: 'POST',
      url: '/echo/html/',
      data: {html: '<tr><td>'+val+'</td><td>عقيد</td></tr>'},
      beforeSend: function(){
      
      },
      success: function(html){
        //example php output as html '<tr><td>Mohammed</td><td>Colonel</td></tr>';
        $('#target').html(html);
      },
      error: function(html){

      }
    });
  });
});