@{section header}
<title>مونگو دی بی - درج تکی</title>
<style>
    .listShow-N2 table{border:none;margin-left:45px;}
    .listShow-N2 table tr:nth-child(odd){background-color:#ccc;}
    .listShow-N2 table tr:nth-child(even){background-color:#ddd;}
    .listShow-N2 table td{padding:0 45px 0 5px;margin:0px;}
</style>
@{end}
<div class="Hrow">
	<div class="Hcontainer Hcontainer-1200 Hpadd-2per">
    <div id="list" class="listShow-N2 Hltr">
        <h2>مونگو دی بی - درج تکی در مجموعه  &nbsp; @{!model.collection} </h2>
        <form id="delfrm" name="delfrm" action="" method="post">
            <input type="hidden" name="collection" value="@{!model.collection}"/>
            <div class="Hrow Hpadd-10 Hltr"  >
                <table id="darj">
                    <tr>
                        <td>
                        <input type="text" name="up1" value=""/>
                        </td>
                        <td><input type="text" name="up2" value="@{repository.k}"/></td>
                        <td>
                        <select name="up3">
                            <option value="string" selected>String</option>
                            <option value="num" >Nummber</option>
                            <option value="bool" >Boolean</option>
                            <option value="array" >Array</option>
                            <option value="object" >Object</option>
                        </select>
                        
                        </td>
                    </tr>
                </table>
                <b id="insert-jsfeild"  class="fas  Hbtn-mini fa-plus Hbg-green" data-color="#fff"></b>
            </div>
            <input type="hidden" id="countlist" name="countlist" value="-1"/>
            <input type="submit" class="Hfloat-L Hbtn-auto Hbtn-yellow2" value=" ثبت "/>
        </form>
    </div>
	</div>
</div>
@{section footer}
<script type="text/javascript">
var cunter=3;
function remove_jsfeild(itm){
    document.getElementById("countlist").value=document.getElementById("countlist").value.replace("-"+itm.nextElementSibling.name.replace("up",""),"");
    itm.parentElement.parentElement.remove();
}
$(document).ready(function(){
    $("#insert-jsfeild").click(function(){
        $("#countlist").val($("#countlist").val()+"-"+(cunter+1));
        var n='<tr><td><b  class="fas  Hbtn-mini fa-close Hbg-digired" onclick="remove_jsfeild(this);" data-color="#fff"></b>'
        +'<input type="text" name="up'+ ++cunter+'" value=""/>'
        +'</td><td><input type="text" name="up'+ ++cunter+'" value=""/></td><td><select name="up'+ ++cunter+'"><option value="string" selected>String</option>'
        +'<option value="num">Nummber</option><option value="bool">Boolean</option><option value="array">Array</option><option value="object">Object</option></select></td></tr>';
        $("#darj").append(n);
    });
});    
</script>
@{end}