Reputation: 3
So I am having difficulty creating a single form that, when updated, updates HTML text.
For example, on page 1 of my site, there is a form with the words TITLE written in it. Now on page 2 the only words on the page are TITLE. Now I want to be able to update that form to now say TITLE 2 and have is update page 2 instantly.
I want to make lots of these forms so what is the way to do this with the least amount of code?
Upvotes: -3
Views: 51
Reputation: 520
If your form and the element showing your text are in different template, you have to use Session.
In your first template (page 1): Attach an event to your input so when you type text you update the Session variable.
In your second template (page 2): Use a simple helper returning the value of the Session variable
Here's the code:
<template name="page1">
<input type="text" class="js-change-text">
</template>
Template.page1.events({
"keyup .js-change-text"(event, instance) {
let inputValue = event.target.value);
Session.set('inputValue', inputValue);
},
});
<template name="page2">
<h1>{{getInputValue}}</h1>
</template>
Template.page2.helpers({
getInputValue() {
return Session.get('inputValue');
},
});
Upvotes: 0