ошибка при реализации datapicker jqgrid - PullRequest
Новая
       20

ошибка при реализации datapicker jqgrid

0 голосов
/ 27 июня 2018

я пытаюсь реализовать datapicker, но получаю эту ошибку: 

TypeError: $(...).datepicker is not a function

мои библиотеки: 

  <!-- for datapicker -->
    <script src="{% static 'jquery-ui/jquery-1.12.4.js' %}"></script>
    <script src="{% static 'jquery-ui/jquery-ui.js' %}"></script>
    <script src="{% static 'jquery-ui/datepicker.js' %}"></script>
    <link href="{% static 'jquery-ui/jquery-ui.css' %}" rel="stylesheet">
<!-- for jqgrid-->
<script src="{% static 'jqgrid/js/i18n/grid.locale-es.js' %}"></script>
<script src="{% static 'jqgrid/js/jquery.jqGrid.min.js' %}"></script>
<link href="{% static 'jqgrid/css/ui.jqgrid.css' %}" rel="stylesheet">
<link href="{% static 'jqgrid/css/jquery-ui.css' %}" rel="stylesheet">

мой код сетки: 

    var mydata =
    [
        { detalle: "comprar uniformes", plazo: "2007-10-01", responsable: "Diego Avila" },
    ]

$("#grid_plan_accion").jqGrid({
    datatype: 'json',
    data: mydata,
    colNames: ['example1', 'example2', ' example3'],
    colModel: [
        { label: 'detalle', name: 'detalle', width: 150, sorttype: "string", editable: true },
        { label: 'plazo', name: 'plazo', width: 150, sorttype: "string", editable: true, edittype:"text", 
        editoptions: {
            // dataInit is the client-side event that fires upon initializing the toolbar search field for a column
            // use it to place a third party control to customize the toolbar
            dataInit: function (element) {
                $(element).datepicker({
                    id: 'orderDate_datePicker',
                    //dateFormat: 'M/d/yy',
                    dateFormat: 'yy/M/d',
                    //minDate: new Date(2010, 0, 1),
                    maxDate: new Date(2020, 0, 1),
                    showOn: 'focus'
                });
            }
        }
        },
        { label: 'responsable', name: 'responsable', width: 150, sorttype: "string", editable: true },
    ],
    rowNum: 10,
    width:750,
    height: 100,
    shrinkToFit: true,
    pager: '#pager_plan_accion',
    editurl: "clientArray",
    onSelectRow: function(id){
        var lastSel="";
        if(id && id!==lastSel){ 
           jQuery('#grid_plan_accion').restoreRow(lastSel); 
           lastSel=id; 
        }
        jQuery('#grid_plan_accion').editRow(id, true); 
    },

});
for (var i = 0; i <= mydata.length; i++)
    jQuery("#grid_plan_accion").jqGrid('addRowData', i + 1, mydata[i]);

});

это небольшой отрывок из моей сетки и ошибка: capture

Это моя папка структуры

structure я работаю как местный и редактирую в строке, но не показываю сборщик данных в строке клика пожалуйста, любые предложения .. или в чем моя ошибка, спасибо ??

1 Ответ

0 голосов
/ 28 июня 2018

У вас есть ошибки в коде:

  1. Ваше определение библиотек JS и CSS неверно.

Сначала вы включаете jquery-ui.js, модуль которого уже содержит сборщик данных (если вы используете полную загрузку). Не нужно включать jquery-ui / datepicker.js , это удваивает код. Более того, вы включаете jquery css два раза, и второй путь не существует, как видно. Чтобы решить проблему, убедитесь, что вы загрузили полный jQuery UI и выполните 

<script src="{% static 'jquery-ui/jquery-1.12.4.js' %}"></script>
<script src="{% static 'jquery-ui/jquery-ui.js' %}"></script>
<link href="{% static 'jquery-ui/jquery-ui.css' %}" rel="stylesheet">
<!-- for jqgrid-->
<script src="{% static 'jqgrid/js/i18n/grid.locale-es.js' %}"></script>
<script src="{% static 'jqgrid/js/jquery.jqGrid.min.js' %}"></script>
<link href="{% static 'jqgrid/css/ui.jqgrid.css' %}" rel="stylesheet">
  1. Вторая ошибка заключается в том, что вы используете data параметр сетки с массивом maydata для автоматического заполнения сетки, и второй раз, когда вы вызываете addowdata, чтобы снова вставить эти данные.

Убедитесь, что загружаемые модули имеют правильные пути.

...