JqG​​rid，工具栏搜索栏添加清除按钮

Question

我有一个启用工具栏搜索的 JqGrid。我的专栏之一是日期时间列，搜索字段是 jquery 日期选择器。日期选择器的问题是不能有空值，但由于该字段是过滤器，因此可以为空。所以我想做的是在日期选择器附近添加一个小按钮，这将清除该字段。 有没有办法做到这一点，或者能够从客户端清除日期选择器。

这是该专栏的代码

{ name: 'Period', index: 'Period', align: 'center', formatter: 'date', formatoptions: { newformat: 'F, Y' }, width: '70px', search: true,
                        searchoptions: {
                            dataInit: function (el) {
                                $(el).datepicker({
                                    yearRange: "-5:+1",
                                    changeMonth: true,
                                    changeYear: true,
                                    showButtonPanel: true,
                                    dateFormat: 'MM, yy',
                                    onClose: function (dateText, inst) {
                                        var month = $("#ui-datepicker-div .ui-datepicker-month :selected").val();
                                        var year = $("#ui-datepicker-div .ui-datepicker-year :selected").val();
                                        $(this).datepicker('disable');
                                        $(this).datepicker('setDate', new Date(year, month, 1));
                                        $(this).datepicker('enable');
                                        $("#jqgCompLine")[0].triggerToolbar();
                                    },
                                    beforeShow: function (input, inst) {
                                        if ((datestr = $(this).val()).length > 0) {
                                            year = datestr.substring(datestr.length - 4, datestr.length);
                                            month = jQuery.inArray(datestr.substring(0, datestr.length - 6), $(this).datepicker('option', 'monthNames'));
                                            $(this).datepicker('option', 'defaultDate', new Date(year, month, 1));
                                            $(this).datepicker('setDate', new Date(year, month, 1));
                                        }
                                    }
                                });
                            }
                        },

提前感谢您的帮助！

Answer 1

datepicker 对于空字段没有问题。估计是你的定制的问题。

我不知道您有哪些数据作为网格中的日期值。格式 'F, Y' （以及日期选择器的 'MM, yy'）似乎有点奇怪，因为搜索将按完整日期完成，但您显示只有口和年。也许一切都可以正确地处理您的数据，也可能不会。

我创建了演示来演示使用日期选择器进行搜索。在创建演示期间，我使用了 'j, F, Y' 格式（对于日期选择器 'd, MM, yy' 格式），并发现了两个错误<一href="https://github.com/tonytomov/jqGrid/blob/v4.3.1/js/grid.base.js#L84-130" rel="nofollow">parseDate jqGrid内部使用的方法。

第一个问题在行 其中 date[k] 值将被正确计算，但不会分配给 tsp.m。应在两个 if 语句中插入赋值 tsp.m = date[k];。所以'F'和'M'格式在jqGrid的当前代码中工作不正确。因为您使用“F”格式，所以它对您来说可能很重要。

下一个问题是当天的 'j' 格式将以错误的方式处理。在解析日期期间，tsp.j 将被正确分配，但 tsp.d 将在 该行将不会被修改并保持等于1。修复代码我建议添加 行

if(tsp.j !== undefined) { tsp.d = tsp.j; }

for 循环之后某处的 。 演示使用修改后的版本jquery.jqGrid.src.js 的 rel="nofollow">jquery.jqGrid.src-parseDate.js。

我稍后会向 trirand 报告该错误和我的修复。