<div>
    <div id="mav_load">
        <h1>Категории заданий</h1>
        <div class="feedok"><?php echo $feed; ?></div>

        <div class="panel panel-primary">
        	<div class="panel-heading">Создать новую категорию</div>
        	<div class="table-responsive">
                <table class="table">
                    <tbody>
        	        	<tr class="info">
        	        		<td><input placeholder="Название" type="text" name="Title" id="Title_0" class="form-control"></td>
        	        		<td><input placeholder="Краткое описание" type="text" name="Body" id="Body_0" class="form-control"></td>
        	                <td style="width: 90px;">                       
        	                    <button style="margin:3px;" title="Добавить" data-toggle="tooltip" data-placement="bottom" class="btn btn-sm btn-success" onclick="ins_item();"><i class="fa fa-check"></i></button>
        	                </td>
        	        	</tr>
        	        </tbody>
                </table>
            </div>
        </div>
        <div class="panel panel-default">
        	<div class="panel-heading"><strong>Добавленные категории</strong></div>
        	<div class="table-responsive">
                <table class="table table-striped table-hover table-condensed">
                    <thead>
                    	<tr>
                    		<th>ИД</th>
                    		<th>Название</th>
                    		<th>Краткое описание</th>
                    		<th></th>
                    	</tr>
                    </thead>
                    <tbody>
                    	<?php foreach ($items as $k => $val) { ?>
                    	<tr>
                    		<td><?php echo $k; ?></td>
                    		<td><input type="text" name="Title" id="Title_<?php echo $k; ?>" class="form-control" value="<?php echo $val['Title']; ?>"></td>
                    		<td><input type="text" name="Body" id="Body_<?php echo $k; ?>" class="form-control" value="<?php echo $val['Body']; ?>"></td>
                            <td style="width: 90px;">                       
                                <button style="margin:3px;" title="Обновить" data-toggle="tooltip" data-placement="bottom" class="btn btn-sm btn-warning" onclick="up_item(<?php echo $k; ?>);"><i class="fa fa-refresh"></i></button>
                                <button style="margin:3px;" title="Удалить" data-toggle="tooltip" data-placement="bottom" class="btn btn-sm btn-danger" onclick="return delet_item(<?php echo $k; ?>);"><i class="fa fa-trash"></i></button>
                            </td>
                    	</tr>
                    	<?php } ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>
<script src="/assets/mav/js/start.js"></script>
<script>
    function dataload(formData){
    	$('#ajaxProgress').show();
		formData.append('aj',1);
		$.ajax({
	        url: document.location.href,
	        type: "POST",
	        cache: false,
	        contentType: false,
	        processData: false,         
	        data: formData,
	        success: function(content){
                $('#mav_load').html($(content).find('#mav_load').html());
	            $('#ajaxProgress').hide();
	        }
    	});
		return false;
    }
    function ins_item(id){
        var formData = getFormData_el('[data-dataform]');       
        formData.append('ins_item',1);
        formData.append('Title',$('#Title_0').val());
        formData.append('Body',$('#Body_0').val());
        dataload(formData);
        return false;
    }
    function up_item(id){
        var formData = getFormData_el('[data-dataform]');       
        formData.append('up_item',id);
        formData.append('Title',$('#Title_'+id).val());
        formData.append('Body',$('#Body_'+id).val());
        dataload(formData);
        return false;
    }
    function delet_item(id){
        if(!confirm('Подтвердите удаление!'))
            return false;
        var formData = getFormData_el('[data-dataform]');       
        formData.append('DeletItem',id);
        dataload(formData);
        return false;
    }
</script>