<style>
    .newoption
    {
        background-color:#CCCCCC !important;
        font-weight:bold !important;
    }

</style>



<select class="select2Supp wdt100" name="supplier" id="supplier" >



    {assign var=u value=1}

    {foreach $clientData as $client}

    {if {$u} eq 2}
    <option  value="-2"  class="newoption">اضافة عميل جديد</option>
    {/if}

    <option {if {$clientid} eq {$client->clientid}}  selected="selected"  {/if} value="{$client->clientid}" data-id="i{$client->clientid}" data-mobile="{$client->clientmobile}" data-phone="{$client->clientphone}" data-clientcode="{$client->clientcode}" data-specialdiscount="{$client->specialDiscount}" data-specialdiscountval="{$client->specialDiscountVal}">{$client->clientname}</option>

    {capture assign=u}{$u+1}{/capture}

    {/foreach}




</select>







{literal}

<script>


    $(document).ready(function (e) {

        //console.log($('#specialDiscountVal_').val());
        $("#supplier").change(function () {
            $('#specialDiscount_').val($("#supplier option:selected").data('specialdiscount'));
            $('#specialDiscountVal_').val($("#supplier option:selected").data('specialdiscountval'));

            var theselectedvalue = $(this).val();




            if (theselectedvalue == "-2")
            {
                //e.preventDefault();

                var elemposition = $(this).data('position');
                $("#myModal1").find(".savemodel1").attr('data-position', elemposition);
                $('#myModal1').modal('show');
            }


            else
            {

                $("#debt").html('<img src="../views/default/images/6.gif" alt="">');

                $('#debt').load('' + supplierpagename + '?do=getclientdebt&clientid=' + theselectedvalue + '', function () {


                    document.getElementById("hidden_debt").value = $('#debt').html();

                    $("#tempclientName").val($("#supplier option[value='" + theselectedvalue + "']").text());


                    ////////////add by sara//////////////////
                    therestofdebt();

                    if (theselectedvalue == "1")
                    {
                        $('#genpay').attr('readonly', true);
                    }
                    else
                    {
                        $('#genpay').attr('readonly', false);
                    }

                    //$("#editdebt").css("display", "block");


                });
            }


            return false;



        });

        function matcher(term, text, opt) {
            //var label = $(opt).val();//.attr('id');
            var mobile = String($(opt).data('mobile')); //data of option to search into it too
            var phone = String($(opt).data('phone')); //data of option to search into it too
            var code = String($(opt).data('clientcode')); //data of option to search into it too
            var id = String($(opt).data('id')); //data of option to search into it too

            term = term.toUpperCase(); //term to search
            text = text.toUpperCase(); //text of option

            if (text.indexOf(term) > -1
                    || (mobile !== undefined && mobile.toUpperCase().indexOf(term) > -1)
                    || (phone !== undefined && phone.toUpperCase().indexOf(term) > -1)
                    || (code !== undefined && code.toUpperCase().indexOf(term) > -1)
                    || (id !== undefined && id.toUpperCase().indexOf(term) > -1)) {
                return true;
            }

            return false;
        }
        $('.select2Supp').select2({
            matcher: matcher
        });
    });

</script>

{/literal}