我正在尝试在带有 Nova Light 主题的角度应用程序上使用 PrimeNG。我添加了依赖项并将 theme.css 文件添加到 styles.scss 文件中，如下所示。问题来了，PrimeNG 主题结束了
我在 PrimeNg 项目中使用 FileUploadModule，并且编写了以下代码： 我尝试过不同的移动浏览器（在...
PrimeNg 有 您可以像这样设置日历的日期格式： 日期格式=“时:分” 在这种情况下，您可以输入 11:53 即可。 不过，我想进入...
我在我的 Angular 项目中使用 PrimeNG 组件。我之前在屏幕上选择了日期，我需要通过在日历上填充颜色来显示选定的日期。 我需要显示您选择的日期...
大家好，我正在使用 PrimeNg 和 p-calendar 模块。我的日历显示两个名为“今天”和“清除”的按钮。我的问题是我只想显示一个按钮而不是两个按钮。我不显示的按钮...
先生们！ 我遇到了一个问题，希望您能提出建议！ 我将 Angular 与 PrimeNG GUI 结合使用。 我使用 p 表创建了表并填充域对象。 我可以编辑单元格和行，但我只能写，我不能...
我在使用 Shadcn Dialog 组件时在 Next.js 项目中遇到水合错误。错误信息是： “水合失败，因为初始 UI 与渲染的内容不匹配......
我正在尝试使用 Vue 以编程方式阻止 HTML 对话框元素的关闭事件关闭对话框。这是我正在使用的代码： 从“vue”导入{ref}； const 对话框模板Re...
我有一个带有 p-dropdown 和 p-table 的组件。当我在下拉列表中选择项目时，我想延迟加载此组件中 p 表中的数据。有可能吗？当我尝试时，我只是懒惰......
Primeng：使用 setValue() 时，分配给 p-inputNumber 的 FormControl 会忽略 [max]-属性
我在 FormGroup 中有一个 FormControl，我可以在其中手动输入一个值，或者它会根据其他值为我计算一个值。我在 ngOnit() 中调用函数来计算
Primeng：使用 setValue() 时，分配给 p-inputNumber 的 FormControl 会忽略 [max]-属性
我在 FormGroup 中有一个 FormControl，我可以在其中手动输入一个值，或者它会根据其他值为我计算一个值。我在 ngOnit() 中调用函数来计算
在 prime ng 的 tabview 文档的可关闭部分中，我看到当我删除最后一个选项卡时，它会转到第一个选项卡。我的问题是：我怎样才能让它转到左侧的选项卡而不是......
为什么我在GWT中无法隐藏UiBinder中的DialogBox？
在 Test.ui.xml 中 测试 一些小部件.. 在Test.ui.xml <g:DialogBox ui:field="wishlistDialogBox" autoHide="true"> <g:caption>Test</g:caption> <g:HTMLPanel> some widgets..</g:HTMLPanel> </g:DialogBox> 运行后，应用程序仍然显示DialogBox，所以我尝试在TestView.java中为“wishlistDialogBox”设置隐藏，但没有成功。 @UiField DialogBox wishlistDialogBox; @Inject public TestView(final Binder binder) { widget = binder.createAndBindUi(this); wishlistDialogBox.hide(); } 然后我在TestPresenter.java中为它设置了隐藏，但仍然不起作用 @Override protected void onBind() { super.onBind(); getView().getWishlistDialogBox().hide(); } 怎么了，古德尔根本没有解释。 另外，DialogBox如何重复使用？ 当谈论将它们添加到 DOM 时，DialogBox（以及一般的 PopupPanel）不像任何其他小部件那样工作。您永远不应该像以前那样将它们直接附加到它（即 panel.add(yourDialogBox) 或在 UiBinder XML 文件中）。相反，您应该创建它们，然后简单地调用 hide()/show() 以及类似的方法，以使其显示/隐藏（即，在 DOM 的末尾附加/分离）。 对我有用的是与任何其他小部件分开创建一个对话框。所以它有自己的 Java 文件和自己的 ui.xml 文件： UiBinder xml文件： <ui:UiBinder xmlns:ui="urn:ui:com.google.gwt.uibinder" xmlns:g="urn:import:com.google.gwt.user.client.ui"> <g:DialogBox ui:field="dialog"> <g:caption>My Dialog</g:caption> <g:HTMLPanel> <g:Button ui:field="closeButton" text="close" /> </g:HTMLPanel> </g:DialogBox> </ui:UiBinder> Java 文件： public class MyDialog { // here you do not inherit anything private static MyDialogUiBinder uiBinder = GWT.create(MyDialogUiBinder.class); interface MyDialogUiBinder extends UiBinder<Widget, MyDialog> { } @UiField DialogBox dialog; @UiField Button closeButton; public MyDialog() { // make cast to DialogBox dialog = (DialogBox) (uiBinder.createAndBindUi(this)); } public void hide() { dialog.hide(); } public void show() { dialog.center(); } @UiHandler("closeButton") public void onClick(ClickEvent event) { hide(); } } 最后我想出了一个办法，那就是把DialogBox放到一个看不见的HTMLPanel <g:HTMLPanel visible="false"> <g:DialogBox ui:field="wishlistDialogBox" autoHide="true"> <g:caption>Test</g:caption> <g:HTMLPanel> some widgets..</g:HTMLPanel> </g:DialogBox> </g:HTMLPanel> 然后像往常一样调用 show & hide DialogBox，即使 DialogBox 被包裹在一个看不见的 DialogBox 中，它也会显示 HTMLPanel。 getView().getWishlistDialogBox().show();
希望这不是一个愚蠢的问题，但我已经没有主意了...... 所以我有这个模式： 1.scala.html 希望这不是一个愚蠢的问题，但我已经没有主意了...... 所以我有这个模式： 1.scala.html <div class="feat" id="cor" data-toggle="tooltip" data-placement="bottom" title="add conference role"><div data-toggle="modal" data-target="#conf-role-menu-modal">Conference Role</div></div> <div class="modal fade" id="conf-role-menu-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button> <h4 class="modal-title" id="myModalLabel">Modal title</h4> </div> <div class="modal-body-conf-role-menu"> <script type="text/javascript"> $(function(){ $(".modal-body-conf-role-menu").load("@routes.Application.areaConferenceRole(id,idenv)"); }); </script> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">Close</button> </div> </div> </div> </div> 使用模态主体中的脚本，我尝试加载此页面： 2.scala.html @(id:String, idenv:String) @Main("Add area") { <form action="@routes.Application.areaPostConferenceRole(id,idenv)" method="POST"> First Name: <input type="text" name="first_name" id="first" class="form-control"> Last Name : <input name="last_name" class="form-control"> <script type="text/javascript"> $( document ).ready(function() { // Handler for .ready() called. $( "#first" ).focus(function() { alert( "Handler for .focus() called." ); }); }); </script> </form> } 页面加载正常。我在我的模态中看到它...... 问题是我的页面 2.scala.html 中的脚本无法运行。我不明白为什么......如果我从我尝试在模态中加载的页面之外尝试它们，它们就会起作用...... $( document ).ready(function(){}); 永远不会在模态中到达，因为加载页面时已经触发了此事件（模态在之后加载...） 尝试直接插入脚本，如下所示： <script type="text/javascript"> $( "#first" ).focus(function() { alert( "Handler for .focus() called." ); }); </script> 当引导模式弹出时，shown.bs.modal事件将被触发。这是例子。 $('#myModal').on('shown.bs.modal', function () { $('#myInput').trigger('focus') }) Full documentation. https://getbootstrap.com/docs/4.0/components/modal/ 试试这个我已经准备好这个功能了 $('#myModal').on('shown.bs.modal', function () { // Your script here }); $(document).on('shown.bs.modal', '#myModal', function () { // Your script here });
我如何根据状态更改按钮颜色（绿色表示“接受”，红色表示“删除”）
如何根据状态更改按钮颜色（绿色表示“接受”，红色表示“删除”） 我是新人，为此使用 Laravel 框架。 这是我的观点 如何根据状态更改按钮颜色（绿色表示“接受”，红色表示“删除”） 我是新人，为此使用 Laravel 框架。 这是我的看法 <table class="table table-striped" id="example"> <thead> <tr> <th>ID no</th> <th>Form Name</th> <th style="text-align: center">Update</th> <th>Delete</th> <th>Status</th> </tr> </thead> @foreach($form as $show) {{--modal--}} <div class="modal fade mj_popupdesign mj_checkoutpopup" id="myModal2" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-body"> <div class="col-lg-8 col-md-8 col-sm-12 col-xs-12 col-lg-offset-2 col-md-offset-2"> <div class="row"> <div class="mj_pricingtable mj_greentable mj_login_form_wrapper"> <form> <div class="mj_login_form"> <p>Are you sure you want to delete this post?</p> <br> <a href="" class="mj_btn btn btn-default pull-right glyphicon glyphicon-remove "> No</a> <a href="{{url('deleteForm',$show->id)}}" class=" pull-right mj_btn btn btn-danger glyphicon glyphicon-ok"> Yes</a> </div> </form> </div> </div> </div> </div> </div> </div> </div> {{--end modal--}} <tbody> <tr> <td> <p> {{$show->id}}</p> </td> <td> <h6><a href="{{url('JobDetails',$show->id)}}"style="color: rgb(0, 191, 243);font-size:18px;float: left;margin: 0;text-align: left">{{$show->jobTitle}}</a> </h6> <p> {{$show->created_at}} </p> </td> <td> <a href="{{url('UpdateFormView',$show->id)}}"> <span class="mj_btn btn btn-success">Update</span> </a> </td> <td> <span class="mj_btn btn btn-danger" data-toggle="modal" data-target="#myModal2">Delete</span> </td> <td><span class="mj_btn btn btn-warning">pending</span> </td> </tr> </tbody> @endforeach </table> </div> </div> </div> </div> 在我的控制器中public function AcquiredForm() { $acquired="Requirement Form"; $acquireForm=Job::where('jobType','LIKE','%'.$acquired.'%'); $form = $acquireForm->get(); return view('private-pages.company.aquire-form',compact('form')); } 数据库状态默认为待处理 数据库状态默认为pending 我在代码中没有看到 status 属性，但显示状态为待处理的纯字符串 <span class="mj_btn btn btn-warning">pending</span> <!-- while it suppose to be --> <span class="mj_btn btn btn-warning">{{ $show->status }}</span> 假设它确实存在，你可以做 <td> @if ($show->status === 'Accept') <span class="mj_btn btn btn-green">Accepted</span> @elseif ($show->status === 'Delete') <span class="mj_btn btn btn-danger">Deleted</span> @else <span class="mj_btn btn btn-warning">Pending</span> @endif </td> 参见：https://laravel.com/docs/5.1/blade#displaying-data <td> @if ($show->jobstatus === "Accepted") <span class="mj_btn btn btn-success">Accepted</span> @elseif ($show->jobstatus === "Rejected") <span class="mj_btn btn btn-danger">Rejected</span> @else <span class="mj_btn btn btn-warning">Pending</span> @endif </td> 或者当你使用 1. laravel esialy customaize this code nad add automatic refresh in the page to more interactive @php if($da->status == "requested") { echo "<td><button class='btn btn-primary'>Requested</button></td>"; } else { echo "<td><button class='btn btn-success'>Ordered</button></td>"; } @endphp
我正在尝试将路由添加到我的 tabView 但它不起作用，请问有什么建议吗？我尝试添加 routerLink="组件路径" 但没有运气 这是 HTML 我正在尝试将路由添加到我的 tabView 但它不起作用，请问有什么建议吗？我尝试添加 routerLink="组件路径" 但没有运气 这是html <p-tabView> <p-tabPanel header="Weather Data" routerLink="/weather-data"> <app-weather-data></app-weather-data> </p-tabPanel> <p-tabPanel header="Chart"> <app-chart></app-chart> </p-tabPanel> <p-tabPanel header="Heat index calculator" closable="true"> <app-heat-index></app-heat-index> </p-tabPanel> </p-tabView> 这是 module.ts import { RouterModule, Routes } from '@angular/router'; const appRoutes: Routes = [ { path: 'weather-data', component: WeatherDataComponent }, { path: 'chart', component: ChartComponent }, { path: 'heat-index', component: HeatIndexComponent }, ]; @NgModule({ declarations: [ AppComponent, WeatherDataComponent, ChartComponent, HeatIndexComponent, ], imports: [ BrowserModule, TabViewModule, ButtonModule, ChartModule, TableModule, HttpClientModule, InputNumberModule, FormsModule, SelectButtonModule, DropdownModule, BrowserAnimationsModule, FontAwesomeModule, InputSwitchModule, PaginatorModule, ReactiveFormsModule, RouterModule.forRoot(appRoutes), ], providers: [DatePipe], bootstrap: [AppComponent], }) export class AppModule {} 我找不到有关 tabView 组件的任何有关如何实现路由的文档，感谢任何帮助 我按以下方式使用了 TabMenu 组件。 <p-tabMenu [model]="items"> </p-tabMenu> <router-outlet></router-outlet> MenuItem 类型有一个命令属性，在命令上您可以实现自定义操作，在您的情况下可以是路由。 this.items = [ { label: "Map", icon: "pi pi-fw pi-map", command: () => { this.router.navigate(["./map"]) }, }, ];
ClosedXML 导出数据网格到 Excel 仅 10 行
我有一个包含 60 行数据的数据网格和一个将其导入 Excel 的按钮： 我有一个包含 60 行数据的数据网格和一个将其导入 Excel 的按钮： <DataGrid AutoGenerateColumns="False" ItemsSource="{Binding Source}" CanUserAddRows="False" HeadersVisibility="All" Name="dgDisplay"> <DataGrid.Columns> <DataGridTextColumn Header="Day" Binding="{Binding Day}"/> <DataGridTextColumn Header="Data" Binding="{Binding Data}"/> </DataGrid.Columns> </DataGrid> <Button Command="{Binding SaveDataGridToExcelCommand}" CommandParameter="{Binding ElementName=dgDisplay}"/> 其中 Day 和 Data 只是一些随机生成的 int 数据。 我的代码使用 ClosedXML 将数据从中导出到 Excel，它使用 MainWindowViewModel: ObservableObject 调用 MVVM.Toolkit。 [RelayCommand] public void SaveDataGridToExcel(DataGrid dataGrid) { DataTable dt = new DataTable(); foreach (DataGridColumn column in dataGrid.Columns) { dt.Columns.Add(column.Header.ToString()); } foreach (var item in dataGrid.Items) { DataRow dr = dt.NewRow(); bool rowHasData = false; for (int i = 0; i < dataGrid.Columns.Count; i++) { var cellContent = dataGrid.Columns[i].GetCellContent(item); if (cellContent is TextBlock textBlock) { //check if row empty, dont add this row.I add it on purpose to check //if the datagrid recognite the rest 50 rows not have data. It actually //dont save those data dr[i] = textBlock.Text; if (!string.IsNullOrEmpty(textBlock.Text)) { rowHasData = true; } } } if (rowHasData) { dt.Rows.Add(dr); } } SaveFileDialog saveFileDialog = new SaveFileDialog(); saveFileDialog.Filter = "Excel files (*.xlsx)|*.xlsx"; if (saveFileDialog.ShowDialog() == DialogResult.OK) { using (XLWorkbook wb = new XLWorkbook()) { wb.Worksheets.Add(dt, "Sheet1"); wb.SaveAs(saveFileDialog.FileName); } } } 但是保存的60行结果只显示了10行数据，其余50行都是空的。如果疑问为什么不使用Microsoft.Interop.Excel，那是因为该包不适合我的 Excel 版本。我没有在 ClosedXML 中看到任何对此有限制或许可的地方，所以我想知道为什么。如有任何帮助，我们将不胜感激。 在浏览 github 几个小时后，我自己找到了答案。 我没有访问单元格内容，而是直接从 DataGrid 的 ItemsSource 访问数据： public void SaveDataGridToExcel(DataGrid dataGrid) { DataTable dataTable = new DataTable(); foreach (DataGridColumn column in dataGrid.Columns) { dataTable.Columns.Add(column.Header.ToString()); } var itemsSource = dataGrid.ItemsSource as IEnumerable; if (itemsSource != null) { foreach (var item in itemsSource) { var properties = item.GetType().GetProperties(); var row = dataTable.NewRow(); foreach (var property in properties) { row[property.Name] = property.GetValue(item); } dataTable.Rows.Add(row); } } //show dialog... }
我正在使用 Vue 3 和 Vuetify 3。我正在尝试让我当前的应用程序显示 中的一行 我正在使用 Vue 3 和 Vuetify 3。我试图让我当前的应用程序在其自己的组件中的对话框中显示 <v-data-table 中的一行，但它无法正常工作：将出现对话框如果我单击表第一行的 Actions3 列中的删除图标，但不单击 Actions3 列中的任何其他删除按钮。这个游乐场说明了问题。 一点背景信息，这个应用程序的初始版本只有一个删除按钮，即“操作”列中的按钮。它的工作是立即删除表中已按下删除按钮的行。这很有效，但有点危险，因为用户可能没有意识到这是一个删除按钮，并且可能对用它删除一行感到不满意，所以我添加了 Actions2 列，该列也为每行都有一个删除按钮。 Actions2 列中的按钮会显示一个对话框，其中显示该行的内容，并让用户选择确认删除或取消删除。这完全按照设计工作。但我对我使用的方法并不着迷，因为我必须为可组合项编写一个额外的模块来控制对话框的打开和关闭，所以我添加了 Actions3 按钮并编写它，以便它将使用目标激活显示该行内容并提供相同的两个按钮的对话框，一个用于确认删除，另一个用于取消删除。 这就是麻烦所在。Actions3 列中的按钮仅显示表格第一行的对话框，因此这是我唯一可以删除的行。我需要为 Actions3 列中的每个删除按钮显示对话框，而不仅仅是第一个。 重要提示：所有三列中实际删除行中数据的代码已被删除，因此按对话框中的任何红色垃圾桶或红色删除按钮都是完全安全的；不会丢失任何实际数据。 如果我能让所有 Actions3 按钮正常工作，我计划从表中删除 Actions 和 Actions2 列。我希望你能帮忙。 更新： 我尝试按照莫里茨在评论中建议的方式进行编码，但显然我做错了，因为 ConfirmDelete2 列中的任何按钮都没有出现 Actions3 对话框。这是我修改后的playground，以防有人可以帮助我找出哪里出了问题。 我建议使用该项目来触发对话框： 激活器仅将 selectedItem 设置为当前项目（我会使用 VBtn 而不是 VIcon）： <v-btn icon="mdi-delete" variant="plain" @click="event => selectedItem = item" /> ConfirmDelete2 以一个 item 作为模型，其余的 props 被删除，因为数据可以直接通过 item 访问： // in ConfirmDelete2 setup type Item = {...} const model = defineModel<Item|null>() 无论何时设置模型，VDialog 都应该出现。由于对话框中使用了项目数据，因此使用 v-if 而不是 :modelValue="Boolean(model)" 可以避免 model is null 错误： <v-dialog v-if="model" :modelValue="true" ... 删除后，取消设置model以关闭模态框： const deleteRecord = () => { ... model.value = null // <--- defineModel emits `update:modelValue` } 现在父级可以简单地使用 v-model 来传递 selectedItem，当对话框关闭时它将被取消设置（由 v-model 更新） <ConfirmDelete2 v-model="selectedItem" /> 这里是更新后的游乐场。 希望有帮助！如果有不清楚的地方请告诉我。