paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-05 06:23:38 +00:00
Code Issues Packages Projects Releases Wiki Activity

dialog_widget: Add a new optional parameter validate_input.

Browse Source 
This commit extends dialog_widget class by adding a new
optional paramter validate_input which will be a function
to validate the inputs in the dialog and will be called
before showing the spinner and calling the on_click function.

Currently, the password change modal uses this paramter to
validate that the old and new password inputs must not be
empty. Since the spinner will not be initiated in the case
where form is invalid, we need not hide the spinner after
showing the error and thus we can simplify the code to use
ui_report.error to show the error messages of empty fields.
This commit is contained in:
Sahil Batra
2021-11-29 23:12:33 +05:30
committed by Tim Abbott
parent 35f9ed6ebe
commit c20f5a9866
2 changed files with 32 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
static/js/dialog_widget.js
View File

@@ -81,6 +81,7 @@ export function launch(conf) {
// * id: Custom id to the container element to modify styles.
// * single_footer_button: If true, don't include the "Cancel" button.
// * form_id: Id of the form element in the modal if it exists.
// * validate_input: Function to validate the input of the modal.
// * on_show: Callback to run when the modal is triggered to show.
// * on_shown: Callback to run when the modal is shown.
// * on_hide: Callback to run when the modal is triggered to hide.
@@ -125,6 +126,9 @@ export function launch(conf) {
// Set up handlers.
submit_button.on("click", (e) => {
if (conf.validate_input && !conf.validate_input(e)) {
return;
}
if (conf.loading_spinner) {
show_dialog_spinner();
} else if (conf.close_on_submit) {

44
static/js/settings_account.js
View File

@@ -436,6 +436,33 @@ export function set_up() {
$("#change_password").on("click", async (e) => {
e.preventDefault();
e.stopPropagation();
function validate_input(e) {
e.preventDefault();
e.stopPropagation();
const old_password = $("#old_password").val();
const new_password = $("#new_password").val();
if (old_password === "") {
ui_report.error(
$t_html({defaultMessage: "Please enter your password"}),
undefined,
$("#dialog_error"),
);
return false;
}
if (new_password === "") {
ui_report.error(
$t_html({defaultMessage: "Please choose a new password"}),
undefined,
$("#dialog_error"),
);
return false;
}
return true;
}
dialog_widget.launch({
html_heading: $t_html({defaultMessage: "Change password"}),
html_body: render_dialog_change_password(),
@@ -445,6 +472,7 @@ export function set_up() {
form_id: "change_password_container",
post_render: change_password_post_render,
on_click: do_change_password,
validate_input,
});
$("#pw_change_controls").show();
if (page_params.realm_password_auth_enabled !== false) {
@@ -466,22 +494,6 @@ export function set_up() {
new_password: $("#new_password").val(),
};
function show_error_message(rendered_error_msg) {
change_password_error.html(rendered_error_msg);
change_password_error.addClass("alert-error").show();
dialog_widget.hide_dialog_spinner();
}
if (data.old_password === "") {
show_error_message($t_html({defaultMessage: "Please enter your password"}));
return;
}
if (data.new_password === "") {
show_error_message($t_html({defaultMessage: "Please choose a new password"}));
return;
}
const new_pw_field = $("#new_password");
const new_pw = data.new_password;
if (new_pw !== "") {