so there is my problem.
I simply put a form in a dialog, when I open it for the first time it's all good, vuelidate works, errors if my fields are empty works too. I complete the form send it, it close the modal.
But then, when I open it to complete it again,errors are display for no reason :
Image of the error
<v-select
v-model="selectedDoctor"
:items="doctors"
item-text="username"
item-value="id"
:label="$t('components.homeCardTeleconsultation.doctor')"
:error-messages="
fieldErrors($v.selectedDoctor, $t('components.homeCardTeleconsultation.doctor'))"
return-object
/>
addTeleconsultant () {
this.$v.$touch()
if (this.$v.$invalid || this.isSaving) {
} else {
const query = {
xxxxx
}
this.$repositories.teleconsultations.create(query).then((reponse) => {
this.teleconsults = reponse.data
})
this.close()
}
It seems like vuelidate check if my fields are required when I open the modal but never the first time. I really don't understand what's going on so if someone have a solution or something...
Thanks !
Just one line this.$v.$reset()
Related
like I mentions in the topic I want to open code view inside my editor, not on separate modal window. I found similar topic and use some of the code from it:
TinyMCE Code Plugin - don't want to open code view in a modal dialog
I managed to do something like this:
const tinyDomUtils = tinymce.util.Tools.resolve('tinymce.dom.DOMUtils');
const editorBody = editor.getBody();
const toggleCodeView = (isCodeView: string) => {
editorContent = editor.getContent({ source_view: !0 });
editorBody.setAttribute(codeViewAttribute, isCodeView);
if (editorBody.getAttribute(codeViewAttribute) === 'true') {
editor.setContent(tinyDomUtils.DOM.encode(editorContent));
editorBody.blur();
} else {
editor.setContent(tinyDomUtils.DOM.decode(editorContent));
}
};
And it works pretty good, I am able to switch between modes. The problem I have is that currently when I am on the code view, the user can hit "save" and then the content is display with all the html markup. I am trying to fix it just by some event listener to "Save" button and when user click it I am running my function again
toggleCodeView("false");
but then I get console error:
react-dom.development.js:22738 Uncaught TypeError: Cannot read properties of undefined (reading 'createRange')
at c.getRng (tinymce.min.js?5.0.0:6:15446)
at c.getNode (tinymce.min.js?5.0.0:6:16732)
at a.getBookmark (tinymce.min.js?5.0.0:6:8198)
at c.getBookmark (tinymce.min.js?5.0.0:6:13908)
at Object.add (tinymce.min.js?5.0.0:7:12595)
at A.i (tinymce.min.js?5.0.0:7:10860)
at t.i [as fire] (tinymce.min.js?5.0.0:8:4752)
at A.fire (tinymce.min.js?5.0.0:8:6637)
at A.save (tinymce.min.js?5.0.0:11:11915)
at A.remove (tinymce.min.js?5.0.0:11:15152)
I can't find any solution for this. Can anyone help?
I am trying to add some validation logic to the code plugin for tinyMCE.
It seems, however, that when a window's onSubmit function is called, the window closes by default.
The onSubmit function currently looks like this:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
What I would like to do is add some validation logic to the plugin to prevent tinyMCE from reformatting invalid html and, rather, display a message that the html is invalid. Essentially, something like this:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return;
}
}
However, it seems that the onSubmit function closes the text editor window regardless. I was wondering if there is a way to stop it from doing this. I have scoured the documentation which leaves much to be explained and have looked at other plugins as examples. The closest I can find is the searchandreplce plugin. The 'Find' button calls the onSubmit function, but it seems to stay open if the 'find' text field is blank. However, the logic behind it seems very different from what I can use in the Code plugin as it is.
Can anyone who is familiar with the tinyMCE API give me any ideas on how to prevent the window from closing when onSubmit is called? Or do I have to go another route?
As per this question the way to cancel an event is to return false;. This will keep the popup open. Your code would then become:
onSubmit: function (e) {
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return false;
}
}
I figured it out finally. All you need to do is add e.preventDefault(); at the start of the onSubmit function and the window will not close. The documentation was no help, but looking at the searchandreplace plugin as an example lead me to the answer. What I have now is like this:
onSubmit: function (e) {
e.preventDefault();
// We get a lovely "Wrong document" error in IE 11 if we
// don't move the focus to the editor before creating an undo
var isCodeValid = true;
//check if code valid
isCodeValid = ValidateCode(e.data.code);
if (isCodeValid) {
//if code valid, send to tinyMCE to let it do it's thing
editor.focus();
editor.undoManager.transact(function () {
editor.setContent(e.data.code);
});
editor.selection.setCursorLocation();
editor.nodeChanged();
}
else {
//if code invalid, display error message and keep text editor window open
tinyMCE.activeEditor.windowManager.alert("Your HTML is invalid. Please check your code and try submitting again.");
return;
}
}
e.PreventDefault() seems to stop the default behavior of the onSubmit function.
I'm trying to create a popup (new window) that appears when a person clicks anywhere on the page , but the problem is that my script creates a new tab for every click . I created a blogspot account just for test : http://faqetest123.blogspot.al/
what should I do for that ?
(example of a site that is using the popup that im trying to create is :atdhe.so)
Here is my code :
<script type="text/javascript">
document.onclick=function()
{
window.open('http://www.facebook.com');
}
</script>
Thanks
The window.open() function returns a reference to that window. So you should be able to use that reference to navigate to a new URL at a later time. Something like this:
var myPopup;
document.onclick=function()
{
if (!myPopup) {
myPopup = window.open('http://www.facebook.com');
} else if (myPopup.closed) {
myPopup = window.open('http://www.google.com');
} else {
myPopup.location.href = 'http://www.stackoverflow.com';
}
}
Note that this also attempts to check if the user has closed the pop-up and re-opens it.
Edit: Based on your comments below, it looks like I misunderstood. In order to have the popup execute once and then not again, you can simply remove the event handler after processing it. Something like this:
document.onclick=function()
{
window.open('http://www.facebook.com');
document.onclick = null;
}
I am a jQuery newbie and ma trying to use a modal to reveal a constant contact simple form generated by the form generator. I have applied jQuery.validate(), and the validation is working, but I don't know how to submit the form. If there is an action="signup/index.php" in the tag, i land on a new page.
The generated form uses action='signup/index.php' and this file calls for a new page location see file in Github. I commented those last lines out, but still am failing to make the form submit. I cannot see the new email in the Constant Contact email list.
This is my sumbmit handler
submitHandler: function() {
$('#signup').click(function(e) {
$.post('signup/index.php', $().serialize(), function(data) {
$('#output-div').html(data);
});
$('#form-message').fadeIn(300, function() {
$('#form-message').html('<p>Thank you for joining our list. Great offers coming soon.</p>')
});
$('#myModal').delay(1500).trigger('reveal:close');
});
}
solved it.
I had commented out the last several lines of the signup/index.php, including this line
if($postFields['request_type'] == 'ajax'){ $postFields["success_url"]=''; $postFields["failure_url"]=''; }
For some reason, that line is needed for form submittal success. Everything after that line is commented out, from
if ($return_code==201) {
to
</ol>
</p>'; }
}
and my jQuery is handling messages, errors and completion as such
submitHandler: function() {
$.post('/dev/rest/ccphp/signup/index.php', $("#ccsfg").serialize(), function(data) {
$('#results').html(data);
}).success(function() {
$('#ccsfg').html('<h4>Thank you for joining our list. Great offers coming soon.</h4>');
})
.error(function() {
$('#ccsfg').html('<h4>Oops! There was an error. Please try again. </h4>');
})
.complete(function() {
$('#myModal').delay(1500).trigger('reveal:close');
});
}
I am trying to call a jquery ui dialog by attaching the function to the onsuccess property of the ajaxoptions on a ajax.beginform..
<script type="text/javascript">
// Dialog
$(document).ready(function () {
$('#dialog').dialog({
autoOpen: false,
width: 600,
modal: true,
buttons: {
"Ok": function () {
$(this).dialog("close");
}
}
});
});
</script>
In a seperate script file I have this..
function EmailResult() {
$('#dialog').dialog('open');
}
Then I have a contact form that is not actually wired up yet, the controller just responds with one of two string responses.
<% using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "ContactResult", OnSuccess="EmailResult" }))
{ %>
If I take out the OnSuccess="EmailResult" from the Ajax.BeginForm or simply remove $('#dialog').dialog('open'); from my EmailResult function the error goes away so obvisouly this is an issue with the OnSuccess property and a Jquery UI Dialog.
My first question is am I doing something wrong that is causing this not to work and/or if this won't work then is there a better solution.
I am trying to create a dialog that comes up and says whether the message was sent. I do not want to use the alert dialog box.
I guess the error would help, in the IE 8 debugger it comes up with an undefined error in the MicrosoftAjax.js library
The finally block of this code is causing the problem and under the locals tab in IE 8 it says b is undefined.
this._onReadyStateChange = function () {
if (a._xmlHttpRequest.readyState === 4) {
try {
if (typeof a._xmlHttpRequest.status === "undefined") return
} catch (b) {
return
}
a._clearTimer();
a._responseAvailable = true;
try {
a._webRequest.completed(Sys.EventArgs.Empty)
} finally {
if (a._xmlHttpRequest != null) {
a._xmlHttpRequest.onreadystatechange = Function.emptyMethod;
a._xmlHttpRequest = null
}
}
}
};
What it was updating was
<%= Html.Hidden("ContactResult") %>
Which turns out was the whole problem, I changed the Hidden Input to a div and it works perfectly. Not sure why but... if anyone else runs into this there you go...
So I guess this is what I figured out.. I started a new mvc project with two inputs and started just using an alert box as it turns out it was not related to the jquery.ui dialog plugin. I got it to work correctly with the alert box coming up after it was run using the ajax.beginform.
So long story short.. You can't use a Hidden Input for the UpdateTargetID in the Ajax.BeginForm? I guess this is kind of a question and the answer but changing the UpdateTargetID to the ID of a "div" fixed it and it works appropriately. You can even set the Div visibility to hidden and it works.