dialog弹窗submit后关闭所有弹窗怎么只关闭一级

您可以在dialog弹窗的submit方法中只关闭当前弹窗，而不是所有弹窗。例如：

// 显示第一级弹窗
$('#dialog1').dialog({
  modal: true,
  buttons: {
    Submit: function() {
      // 关闭第一级弹窗
      $(this).dialog('close');
      // 显示第二级弹窗
      $('#dialog2').dialog({
        modal: true,
        buttons: {
          Submit: function() {
            // 关闭第二级弹窗
            $(this).dialog('close');
          }
        }
      });
    }
  }
});

在第一级弹窗的submit方法中只关闭第一级弹窗，然后再显示第二级弹窗。在第二级弹窗的submit方法中只关闭第二级弹窗。这样就可以实现只关闭当前弹窗，而不是所有弹窗。

相关问题

vue3 setup 怎么用dialog做详情弹窗

Vue3中使用dialog弹窗可以按照以下步骤操作：

1. 首先，安装并导入Vuetify或Element等UI库中的Dialog组件。

2. 在组件中定义一个data属性来保存弹窗的状态，例如：

data() {
  return {
    dialogVisible: false
  }
}

3. 在模板中，将Dialog组件添加到需要呈现弹窗的位置，并将其与刚刚定义的data属性进行绑定，例如：

<el-dialog :visible="dialogVisible">
  // 弹窗内容
</el-dialog>

4. 在需要弹出弹窗的地方，设定触发弹窗的事件，并将data属性设置为true，例如：

<button @click="dialogVisible = true">点击我弹出弹窗</button>

5. 最后，在弹窗中添加“确认”和“取消”等按钮，来控制弹窗的展示与隐藏，例如：

<el-dialog :visible="dialogVisible">
  // 弹窗内容

  <el-button @click="dialogVisible = false">取消</el-button>
  <el-button type="primary" @click="submitForm">确认</el-button>
</el-dialog>

以上是一个基本的使用Dialog组件弹出弹窗的方法，希望能对你有所帮助。

dialog 里面的表单提交后，不关闭弹窗再执行reset 清空，方便再次添加表单数据，但是再填写的时候规则验证提示就有问题，正确输入值也验证提示

在JavaScript的dialog表单提交后，如果希望保持弹窗打开以便用户继续输入而不需要每次清空后再重新填写，通常的做法是在表单提交成功后，手动触发`reset()`方法来清除已填入的数据。然而，这可能导致在下次验证新的输入时，由于表单字段的状态未恢复到初始状态，之前的验证规则可能不再适用。

例如，如果你有一个必填项的验证规则，在用户第一次填写并提交后，这个字段可能已经不再是必填了，因为清空后它默认为空。当用户重新开始填写，即使他们正确地填写了内容，如果没有正确处理先前的验证状态，系统可能会误报该字段为空。

解决这个问题的关键在于在`reset()`之前，需要先临时保存用户的输入状态，并在重新验证时检查是否满足这些条件。同时，可以在验证函数内部判断当前输入与之前的状态，如果匹配则跳过相应的错误提示。你可以这样做：

let previousValues = {};

// 表单提交事件处理器
document.getElementById('yourForm').addEventListener('submit', function(e) {
  e.preventDefault();
  
  // 提交表单并保存部分数据
  const formData = new FormData(this);
  previousValues = { ...formData };

  // 验证并提交
  if (validateFormData(formData)) {
    submitForm(formData);
  }
});

// 重置表单并保留之前的部分状态
function resetWithPreviousValues() {
  this.reset();
  for (const key in previousValues) {
    this.elements[key].value = previousValues[key];
  }
}

// 验证函数
function validateFormData(formData) {
  // 检查每个字段是否满足规则
  return Object.keys(previousValues).every(key => formData.get(key) !== '' || !someValidationRule(formData.get(key)));
}

// 当需要重新开始填写时
resetWithPreviousValues.call(document.getElementById('yourForm'));