Kendo ui和jQuery UI冲突

时间:2013-09-12 09:34:35

标签: javascript jquery jquery-ui kendo-ui

我使用Kendo UI作为我的日期选择器,我想在自动完成时使用jQuery UI。

在我的代码上插入我的jquery自动完成后,会出现以下错误:

  

未捕获的TypeError:无法读取未定义的属性'element'

这是兼容性问题吗?

这是我的javascript代码组合

$(document).ready(function(){  
$(".auto_c").autocomplete({            
     source: "purchaseorder_controller/get_data",
    minLength: 3,
    }); 
  })

<script type="text/javascript">

        //automatic computation in rows
        $('[id^=qty],[id^=price],#tin_number').on('change',function() {


            var index = this.id.match(/\d+/)[0];
            var qty = parseInt($('#qty'+index).val());
            var price = parseFloat($('#price'+index).val());
            var disc = $("#discount").val();
            var lessitem = $("#less").val();
            var total = 0;


            $('#total'+index).val((qty * price ? qty * price : 0).toFixed(2));

            var total = 0;
            $('[id^=total]').each(function(index){
                total+=parseFloat($(this).val()?$(this).val():0);
            });

            var totalAll = $('#sum_of_total').val(total.toFixed(2));

            var vatable = 0;
            var vatable_amt = 0;
            var totalVat = 0;
            var computeDisc = 0;
            var computeLess =0;

            if($("#tin_number").val().length != 0){
                vatable = total / 1.12;
                vatable_amt = vatable * 0.12;
                totalVat = vatable + vatable_amt;

            }else{
                totalVat = total;


            }

            $('#vatable').val(vatable.toFixed(2)); 
            $("#vatable_amount").val(vatable_amt.toFixed(2));
            // var gtotal = $("#gtotal").val(totalVat.toFixed(2));
            var gtotal = +$("#gtotal").val(totalVat.toFixed(2)).val();
            $("#total_amt_due").val(gtotal.toFixed(2));

        });

        $("#discount").on('change',function(){
            var totalSales = $("#gtotal").val();
            var discountedAmt = $("#discount").val();
            var returnAmt = $("#less").val();
            var computeTotalDisc = (totalSales - discountedAmt) - returnAmt;
            $("#total_amt_due").val(computeTotalDisc.toFixed(2));
        });

        $("#less").on('change',function(){
            var totalSalesx = ($("#gtotal").val() - $("#less").val() - $("#discount").val());
            $("#total_amt_due").val(totalSalesx.toFixed(2));
        });

        //AUTO ASSIGN TO SUPPLIER INFO
        $('#supplier_list').bind('change', function(){
            var var_add_category ='<?php echo site_url("purchaseorder_controller/supplier_details"); ?>';
            $.ajax({
                type:'POST',
                url: var_add_category,
                data:{ id: $(this).val() },
                dataType:'json',
                success:function(d){

                    var bankname = d['bankname'];
                    var bankbranch = d['bankbranch'];

                    $("[name=spaddress]").val(d['spaddr']);
                    $("[name=tin]").val(d['sptinno']);
                    $("[name=contactperson]").val(d['pricontactname']);
                    $("[name=contactnumber]").val(d['sptelno']);
                    $("[name=bank]").val(bankname + ' - ' + bankbranch);
                    $("[name=account_name]").val(d['bankacctname']);
                    $("[name=account_no]").val(d['bankacctno']);

                }
            });    
        });

        $("[id^=code]").on('change',function(){

            var index = this.id.match(/\d+/)[0];
            var validate = $('#code'+index).val();

            if(validate != ''){
                $("#qty"+index).removeAttr('readonly');
                $("#price"+index).removeAttr('readonly');
            }

        });

        $("[id^=code]").on('change',function(){

            var index = this.id.match(/\d+/)[0];
            var validate = $('#code'+index).val();

            if(validate == ''){
                $("#qty"+index).prop('readonly', true);
                $("#price"+index).prop('readonly', true);
            }

        });

        //prevent character entering in numeric textbox
        $('[id^=qty],[id^=price],[id=discount]').keydown(function(e){

            var key = e.which;

            // backspace, tab, left arrow, up arrow, right arrow, down arrow, delete, numpad decimal pt, period, enter
            if (key != 8 && key != 9 && key != 37 && key != 38 && key != 39 && key != 40 && key != 46 && key != 110 && key != 190 && key != 13){
                if (key < 48){
                    e.preventDefault();
                }
                else if (key > 57 && key < 96){
                    e.preventDefault();
                }
                else if (key > 105) {
                    e.preventDefault();
                }
            }
        });
         $('[id^=qty],[id^=price],[id=less]').keydown(function(e){

            var key = e.which;

            // backspace, tab, left arrow, up arrow, right arrow, down arrow, delete, numpad decimal pt, period, enter
            if (key != 8 && key != 9 && key != 37 && key != 38 && key != 39 && key != 40 && key != 46 && key != 110 && key != 190 && key != 13){
                if (key < 48){
                    e.preventDefault();
                }
                else if (key > 57 && key < 96){
                    e.preventDefault();
                }
                else if (key > 105) {
                    e.preventDefault();
                }
            }
        });


</script>

这是我的JS列表

 <!--AUTO COMPLETE-->
      <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
      <script src="http://code.jquery.com/jquery-1.9.1.js"></script>
      <script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>



    <!--JQUERY UI -->
    <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>./resources/jquery/themes/base/jquery.ui.all.css" />
    <script type="text/javascript" src="<?php echo base_url(); ?>./resources/jquery/jquery-1.9.1.js"></script>
    <script type="text/javascript" src="<?php echo base_url(); ?>./resources/jquery/ui/jquery.ui.position.js"></script>
    <script type="text/javascript" language="javascript" src="<?php echo base_url(); ?>/resources/datatables/media/js/jquery.js"></script>
    <script type="text/javascript" language="javascript" src="<?php echo base_url('resources/jquery/ui/minified/jquery-ui.min.js'); ?>"></script>
    <script type="text/javascript" language="javascript" src="<?php echo base_url(); ?>/resources/datatables/media/js/jquery.dataTables.js"></script>

    <!-- EASY UI -->
    <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>./resources/easyui/themes/metro-blue/easyui.css" />
    <link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>./resources/easyui/themes/icon.css" />
    <script type="text/javascript" src="<?php echo base_url(); ?>./resources/easyui/jquery.easyui.min.js"></script>

    <!-- AJAX FORM VALIDATION -->
    <script type="text/javascript" language="javascript" src="<?php echo base_url(); ?>/resources/jquery.validate.min.js"></script> 

    <!-- KENDO UI -->
    <link href="<?php echo base_url(); ?>resources/kendo/styles/kendo.common.min.css" rel="stylesheet" />
    <link href="<?php echo base_url(); ?>resources/kendo/styles/kendo.silver.min.css" rel="stylesheet" />
    <script src="<?php echo base_url(); ?>resources/kendo/js/kendo.all.min.js"></script>

1 个答案:

答案 0 :(得分:1)

一个明显的问题是jQuery包括3(!!)次和jquery-ui - 2次。修复此问题可以解决错误。除此之外,我没有看到Kendo UI代码。尝试删除kendo.all.min.js以查看错误是否仍然存在。