如何使用jquery-jtable自定义添加/更新记录对话框？

Question

我在我的应用程序中使用了jtable，并创建了8-9个字段。当我尝试打开添加记录对话框时，看起来这个标题覆盖了对话框。 我想更改尺寸或为该对话框提供一些上边距。 我在哪里需要更改对话框的尺寸，或者我需要在哪里设置jtable的上边距。请帮帮我。此处附有输出屏幕。

Answer 1

尝试以下解决方案：

.ui-dialog {
    margin-top: 10px !important;          /*change top margin as you want*/
}

将此添加到您的页面中。这将覆盖ui-dialog jquery-ui.css类Site.css。我假设您只在当前页面中使用它，如果您在ui-dialog中使用它，那么它将影响您使用Vue.component('events', { template: '#events-template', data: function() { return { list: [] } }, created: function() { this.fetchEventsList(); }, methods: { fetchEventsList: function() { this.$http.get('events', function(events) { this.list = events; }).bind(this); } } }); new Vue({ el: 'body', }); 类的每个页面。

Answer 2

这是一个较晚的答案，但可能可以帮助其他人。您可以通过处理“ formcreated”事件来更改jQuery-jTable默认表单的尺寸：

formCreated: function (event, data) {
  $('#jtable-edit-form').css('height', 'auto');
  $('#jtable-edit-form').css('width', '300px');
  $('input[type=text]').each(function () {
    $(this).css('width', '300px');
  });
}