I have an onSubmit method.
onSubmit() {
let user = this.form.value
this._userService.postUser(user)
this.form.reset();
this._router.navigate(['users'])
}
I'm using
this.form.reset();
to prevent dirty tracking but when I use this line it seems to disable
this._router.navigate(['users'])
If I don't reset the form I have a dirty tracking alert message.
Is there any way I can have my cake and eat it?
I should have used
this.form.markAsPristine()
instead of
this.form.reset()
Related
I am sending a custom event ("ebook") with a parameter ("titolo") to GA4. After that, I have set the parameter as a Custom Dimension in GA UI.
I am sending the event from my website with this code:
function ebooksGA4new(title) {
gtag('event', 'ebooks', {
'titolo': title
});
}
Then I have set an Exploration on the custom dimension, but after 3 days it still reports "not_set. If I fire the event, I can see it in the real-time report.
Here are 2 ways to find out why
Modify the code a bit, make sure it won't trigger the event if it doesn't have title parameter.
But please make sure this is what you want. You need to decide it is ok or not to receive the event without title parameter.
function ebooksGA4new(title) {
if(!title || title=="")
return false;
gtag('event', 'ebooks', {
'titolo': title
});
}
Open the chrome devtool or something similar with it. Here is the screenshot about how to check it. This should appear on your GA4 real time report as well.
I need to prevent Contact Form 7 WordPress plugin from clearing form on successful submission. I want user to be able to keep editing the form (and possibly to resubmit it again).
Thanks.
I actually found a solution. You can just attach an event handler to reset event and then do e.preventDefault().
setTimeout( function(){
$( '.my-form form' ).on( 'reset', function(e) {
e.preventDefault();
});
},500)
It didn't work without the timeout, but this should be safe enough. Not many users can fill a form in under 0.5 second :-)
Maybe not a perfect solution but it works for my case.
EDIT: Here is a new version without the setTimeout (thanks to #Jan Myszkier)
$(document).on('reset', '.my-form form', function(e) {
e.preventDefault();
});
In JS wp-content/plugins/contact-form-7/includes/js/scripts.js around line 300 there's ajaxSuccess function described with the following piece:
if ( 'mail_sent' == data.status ) {
$form.each( function() {
this.reset();
} );
wpcf7.toggleSubmit( $form );
}
which might be just what you're looking for because this.reset(); resets the field one by one within the form after successful status.
EDIT: Following your information you want to modify the behaviour but not change the plugin, you can use the events that come with CF7.
https://contactform7.com/dom-events/
add wpcf7submit watcher to store the data in the localstorage and add another watcher (wpcf7mailsent this time ) to write the data back to the form.
I am trying to set a Session variable to the text that a user clicks on when they click a link. For example if the link is The Link.
I would like to Session.set('clickedLink', <<The Link>>); but with "The Link" obviously replaced with the text string that the user has clicked on.
Is this possible? Am I going about this all wrong?
I figured I might be able to use something like:
Template.SingleQuote.events({
"click .link": function (event) {
Session.set("currentPageName", event.a.text);
}
});
Use event.target.text.
Template.SingleQuote.events({
'click .link'(event) {
Session.set('currentPageName', event.target.text);
}
});
Edit:
Instead of what has been posted, it has been suggested by reviewers that I update this answer to make use of the following syntax:
'click .link': function(event) { /* ... */ }
Both of these are perfectly valid syntax for a Meteor Template Event, use whichever you feel most comfortable with.
Would modify the action of Contact Form 7 once sent the mail.
I follow this post and woks fine. But my fom is in a Bootstrap Modal, and I wish they would keep open on submit.
My code is.
In function PHP
add_filter('wpcf7_form_action_url', 'wpcf7_custom_form_action_url'); function wpcf7_custom_form_action_url() { return 'http://saviacomunicacion.com.ar/test2014#sala-de-prensa'; }
And in the Aditional Settings field
add_filter('wpcf7_form_action_url', 'wpcf7_custom_form_action_url');
This redirect the URL, but it´s not sending the mail.
I wish i could send the mail and keep the modal open to show the response: Your mail was send correctly.
Thanks
According to the doc there is another way to accomplish the redirect. Just add some piece of code to the plugin dashboard.
Or you can do custom js function
in the plugin options
on_sent_ok: "customFunction();"
and somewhere in the code
<script>
function customFunction() {
// show your modal here
$('#myModal').modal();
}
</script>
I found my solution with this code. When form submit, the Modal closes after 1 second.
Instead of keeping Modal open, i wait 1 second after close, to show the response of the sending.
j(".form-horizontal").live("submit", function(){
j.post(this.action, j(this).serialize(), function(){
//this callback is executed upon success full form submission close modal here
}, "script");
//this is to wait 1 second until close
setTimeout(function() {j('.modal').modal('hide');}, 1000);
return false;
});
anyone using framework7 to create mobile website? I found it was great and tried to learn it by myself, now I meet this problem, after I create my App, I want to do something on the starter page initialization, here, my starter page is index.html, and I set data-page="index", now I write this below:
$$(document).on('pageInit', function (e) {
var page = e.detail.page;
// in my browser console, no "index page" logged
if (page.name === 'index') {
console.log("index page");
});
// but I changed to any other page other than index, it works
// my browser logged "another page"
if(page.name === 'login') {
console.log('another page');
}
});
Anyone can help? Thank you so much.
I have also encountered with the same problem before.
PageInit event doesn't work for initial page, only for pages that you navigate to, it will only work for index page if you navigate to some other page and then go back to index page.
So I see two options here:
Just not use pageInit event for index page - make its initialization just once (just make sure you put this javascript after all its html is ready, or e.g. use jquery's on document ready event)
Leave index page empty initially and load it dynamically via Framework7's mainView.loadContent method, then pageInit event would work for it (that was a good option for me as I had different index page each time, and I already loaded all other pages dynamically from underscore templates)
I am facing same issue and tried all solutions in various forums.. nothing actually worked. But after lot of RnD i stumbled upon following solution ...
var $$ = Dom7;
$$(document).on('page:init', function (e) {
if(e.detail.page.name === "index"){
//do whatever.. remember "page" is now e.detail.page..
$$(e.detail.page.container).find('#latest').html("my html here..");
}
});
var me = new Framework7({material: true});
var mainview = me.addView('.view-main', {});
.... and whatever else JS here..
this works perfectly..
surprisingly you can use "me" before initializing it..
for using for first page u better use document ready event. and for reloading page event you better use Reinit event.
if jquery has used.
$(document).on('ready', function (e) {
// ... mainView.activePage.name = "index"
});
$(document).on('pageReinit', function (e) {
//... this event occur on reloading anypage.
});