Rivets.js: When button is clicked, call a function with an argument from a data binding
7
This is so infuriating. It seems like it should be so simple, but I can't find the magic incantation.
Here's the gist of what I need to do:
<div rv-each-thing="data.things">
<input type=button value="Click" onclick="abc( {thing} )">
</div>
That should illustrate what I need to do. I've tried many different things, but nothing seems to work.
javascript rivets.js
asked Sep 21 '15 at 10:56
paulwal222paulwal222
603414
add a comment |
7
This is so infuriating. It seems like it should be so simple, but I can't find the magic incantation.
Here's the gist of what I need to do:
<div rv-each-thing="data.things">
<input type=button value="Click" onclick="abc( {thing} )">
</div>
That should illustrate what I need to do. I've tried many different things, but nothing seems to work.
javascript rivets.js
asked Sep 21 '15 at 10:56
paulwal222paulwal222
603414
rv-on-click="abc( {thing} )"rivetsjs.com/docs/reference/#on-[event] You need to read what 2 way binding is, and use the documentation of the binding library.
– Pogrindis
Sep 21 '15 at 11:46
Nope. I definitely tried that, and it doesn't work. Gives this error: Uncaught TypeError: this.call is not a function / t.public.handler @ rivets.bundled.min.js:6 / t.Binding.e.eventHandler @ rivets.bundled.min.js:6 / n.event.dispatch @ jquery-2.1.4.min.js:3 / n.event.add.r.handle @ jquery-2.1.4.min.js:3
– paulwal222
Sep 21 '15 at 13:11
The only working solution I found is using a function that is a member of {thing}, which seems ridiculous to me. So:rv-on-click="thing.my_function"
– paulwal222
Sep 21 '15 at 13:14
add a comment |
7
7
7
This is so infuriating. It seems like it should be so simple, but I can't find the magic incantation.
Here's the gist of what I need to do:
<div rv-each-thing="data.things">
<input type=button value="Click" onclick="abc( {thing} )">
</div>
That should illustrate what I need to do. I've tried many different things, but nothing seems to work.
javascript rivets.js
asked Sep 21 '15 at 10:56
paulwal222paulwal222
603414
This is so infuriating. It seems like it should be so simple, but I can't find the magic incantation.
Here's the gist of what I need to do:
<div rv-each-thing="data.things">
<input type=button value="Click" onclick="abc( {thing} )">
</div>
That should illustrate what I need to do. I've tried many different things, but nothing seems to work.
javascript rivets.js
javascript rivets.js
asked Sep 21 '15 at 10:56
paulwal222paulwal222
603414
asked Sep 21 '15 at 10:56
paulwal222paulwal222
603414
asked Sep 21 '15 at 10:56
paulwal222paulwal222
603414
asked Sep 21 '15 at 10:56
paulwal222paulwal222
603414
asked Sep 21 '15 at 10:56
paulwal222paulwal222
603414
603414
rv-on-click="abc( {thing} )"rivetsjs.com/docs/reference/#on-[event] You need to read what 2 way binding is, and use the documentation of the binding library.
– Pogrindis
Sep 21 '15 at 11:46
Nope. I definitely tried that, and it doesn't work. Gives this error: Uncaught TypeError: this.call is not a function / t.public.handler @ rivets.bundled.min.js:6 / t.Binding.e.eventHandler @ rivets.bundled.min.js:6 / n.event.dispatch @ jquery-2.1.4.min.js:3 / n.event.add.r.handle @ jquery-2.1.4.min.js:3
– paulwal222
Sep 21 '15 at 13:11
The only working solution I found is using a function that is a member of {thing}, which seems ridiculous to me. So:rv-on-click="thing.my_function"
– paulwal222
Sep 21 '15 at 13:14
add a comment |
rv-on-click="abc( {thing} )"rivetsjs.com/docs/reference/#on-[event] You need to read what 2 way binding is, and use the documentation of the binding library.
– Pogrindis
Sep 21 '15 at 11:46
Nope. I definitely tried that, and it doesn't work. Gives this error: Uncaught TypeError: this.call is not a function / t.public.handler @ rivets.bundled.min.js:6 / t.Binding.e.eventHandler @ rivets.bundled.min.js:6 / n.event.dispatch @ jquery-2.1.4.min.js:3 / n.event.add.r.handle @ jquery-2.1.4.min.js:3
– paulwal222
Sep 21 '15 at 13:11
The only working solution I found is using a function that is a member of {thing}, which seems ridiculous to me. So:rv-on-click="thing.my_function"
– paulwal222
Sep 21 '15 at 13:14
rv-on-click="abc( {thing} )" rivetsjs.com/docs/reference/#on-[event] You need to read what 2 way binding is, and use the documentation of the binding library.– Pogrindis
Sep 21 '15 at 11:46
rv-on-click="abc( {thing} )" rivetsjs.com/docs/reference/#on-[event] You need to read what 2 way binding is, and use the documentation of the binding library.– Pogrindis
Sep 21 '15 at 11:46
Nope. I definitely tried that, and it doesn't work. Gives this error: Uncaught TypeError: this.call is not a function / t.public.handler @ rivets.bundled.min.js:6 / t.Binding.e.eventHandler @ rivets.bundled.min.js:6 / n.event.dispatch @ jquery-2.1.4.min.js:3 / n.event.add.r.handle @ jquery-2.1.4.min.js:3
– paulwal222
Sep 21 '15 at 13:11
Nope. I definitely tried that, and it doesn't work. Gives this error: Uncaught TypeError: this.call is not a function / t.public.handler @ rivets.bundled.min.js:6 / t.Binding.e.eventHandler @ rivets.bundled.min.js:6 / n.event.dispatch @ jquery-2.1.4.min.js:3 / n.event.add.r.handle @ jquery-2.1.4.min.js:3
– paulwal222
Sep 21 '15 at 13:11
The only working solution I found is using a function that is a member of {thing}, which seems ridiculous to me. So:
rv-on-click="thing.my_function"– paulwal222
Sep 21 '15 at 13:14
The only working solution I found is using a function that is a member of {thing}, which seems ridiculous to me. So:
rv-on-click="thing.my_function"– paulwal222
Sep 21 '15 at 13:14
add a comment |
3 Answers
3
active
oldest
votes
5
Below is the default configuration of event handler from rivets website:
// Augment the event handler of the on-* binder
handler: function(target, event, binding) {
this.call(target, event, binding.view.models)
}
So apart from the event object, you can also get a reference to the models related to the particular binding as second argument.
Using which you can access the particular object
For example
<div rv-each-thing="data.things">
<input type=button value="Click" rv-on-click="abc">
</div>
function abc(event,rivetsBinding){
rivetsBinding.thing //heres your thing :)
}
answered Oct 11 '15 at 12:02
T JT J
32.7k957111
did not work for me,
– sairfan
Sep 26 '17 at 20:40
@sairfan for this to work the event should be bound with rivets event binder. Answer had the copy pasted js binding from question. If rivets binding doesn't work please share an Minimal, Complete, and Verifiable example
– T J
Sep 29 '17 at 10:04
add a comment |
0
Here is something how i gone through this. Just copy and paste working examples below
<body>
<div rv-each-book="model.books">
<button rv-on-click="model.selectedBook | args book">
Read the book {book}
</button>
</div>
</body>
<script type="text/javascript">
rivets.formatters["args"] = function (fn) {
var args = Array.prototype.slice.call(arguments, 1);
return function () {
return fn.apply(null, args);
};
};
rvBinder = rivets.bind(document.body, {
model: {
selectedBook: function (book) {
alert("Selected book is " + book);
},
books: ["Asp.Net", "Javascript"]
}
});
</script>
Or an alternate approach is binding event
<body>
<div rv-each-book="books">
<a rv-cust-href="book">
Read the book {book}
</a>
</div>
</body>
<script type="text/javascript">
rivets.binders['cust-href'] = function (el, value) {
//el.href = '/Books/Find/' + value;
//OR
el.onclick = function () { alert(value); };
}
rvBinder = rivets.bind(document.body, {
books: ["Asp.Net", "Javascript"]
});
</script>
answered Sep 28 '17 at 16:18
sairfansairfan
1501411
This is not the right way to do it, unless something broke in a version update of rivets, in that case you should report a bug rather than using poor work arounds
– T J
Sep 29 '17 at 10:01
1
should i stop my project until i get solution?? we have to comeout of situation, we will update when its updated in rivetsjs. this issue is already reported, solution something like above is discussed on rivetsjs related page, you did not even bother to verify what I'm trying to say.
– sairfan
Sep 29 '17 at 15:23
I did check the source of rivets before posting the comment, and the existing answer should still work with minor change to arguments. The answer is 6 years old, JS libraries update very fast. The answer contains the code for invoking event handler from rivet's source at the time of writing. It seems you did not do any investigation on why existing solution doesn't work...
– T J
Sep 29 '17 at 15:39
you did not described your answer well, I asked question on it, that its not working for me, but no reply, I further searched around and reached issue at link I found the solution, and i posted so that it can help others, I also provided the link where event is binded which is still better explained and working example.
– sairfan
Sep 29 '17 at 15:39
add a comment |
0
Sorry if I'm late, just started using Rivets and had come across the same problem.
Solution: Bind your function first
For example you have a function:
function customOnClickCallback(event, item) {
console.log(event);
console.log(item);
console.log(item.thing); // Instead of {{ thing }}
}
First you bind your function to be called (I'll be binding it to the Body for now):
rivets.bind(document.getElementsByTagName("body")[0], {
customOnClick: customOnClickCallback
});
Then you can use customOnClick as your rv-on-click
<input type=button value="Click" rv-on-click="customOnClick">
As for accessing your variable thing, it should be accessible as item.thing.
answered Jan 1 at 23:20
Rishav ThakkerRishav Thakker
83
add a comment |
Your Answer
StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");
StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);
StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});
function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});
}
});
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f32693453%2frivets-js-when-button-is-clicked-call-a-function-with-an-argument-from-a-data%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
3 Answers
3
active
oldest
votes
3 Answers
3
active
oldest
votes
active
oldest
votes
active
oldest
votes
5
Below is the default configuration of event handler from rivets website:
// Augment the event handler of the on-* binder
handler: function(target, event, binding) {
this.call(target, event, binding.view.models)
}
So apart from the event object, you can also get a reference to the models related to the particular binding as second argument.
Using which you can access the particular object
For example
<div rv-each-thing="data.things">
<input type=button value="Click" rv-on-click="abc">
</div>
function abc(event,rivetsBinding){
rivetsBinding.thing //heres your thing :)
}
answered Oct 11 '15 at 12:02
T JT J
32.7k957111
did not work for me,
– sairfan
Sep 26 '17 at 20:40
@sairfan for this to work the event should be bound with rivets event binder. Answer had the copy pasted js binding from question. If rivets binding doesn't work please share an Minimal, Complete, and Verifiable example
– T J
Sep 29 '17 at 10:04
add a comment |
5
Below is the default configuration of event handler from rivets website:
// Augment the event handler of the on-* binder
handler: function(target, event, binding) {
this.call(target, event, binding.view.models)
}
So apart from the event object, you can also get a reference to the models related to the particular binding as second argument.
Using which you can access the particular object
For example
<div rv-each-thing="data.things">
<input type=button value="Click" rv-on-click="abc">
</div>
function abc(event,rivetsBinding){
rivetsBinding.thing //heres your thing :)
}
answered Oct 11 '15 at 12:02
T JT J
32.7k957111
did not work for me,
– sairfan
Sep 26 '17 at 20:40
@sairfan for this to work the event should be bound with rivets event binder. Answer had the copy pasted js binding from question. If rivets binding doesn't work please share an Minimal, Complete, and Verifiable example
– T J
Sep 29 '17 at 10:04
add a comment |
5
5
5
Below is the default configuration of event handler from rivets website:
// Augment the event handler of the on-* binder
handler: function(target, event, binding) {
this.call(target, event, binding.view.models)
}
So apart from the event object, you can also get a reference to the models related to the particular binding as second argument.
Using which you can access the particular object
For example
<div rv-each-thing="data.things">
<input type=button value="Click" rv-on-click="abc">
</div>
function abc(event,rivetsBinding){
rivetsBinding.thing //heres your thing :)
}
answered Oct 11 '15 at 12:02
T JT J
32.7k957111
Below is the default configuration of event handler from rivets website:
// Augment the event handler of the on-* binder
handler: function(target, event, binding) {
this.call(target, event, binding.view.models)
}
So apart from the event object, you can also get a reference to the models related to the particular binding as second argument.
Using which you can access the particular object
For example
<div rv-each-thing="data.things">
<input type=button value="Click" rv-on-click="abc">
</div>
function abc(event,rivetsBinding){
rivetsBinding.thing //heres your thing :)
}
answered Oct 11 '15 at 12:02
T JT J
32.7k957111
edited Sep 29 '17 at 9:58
answered Oct 11 '15 at 12:02
T JT J
32.7k957111
answered Oct 11 '15 at 12:02
T JT J
32.7k957111
answered Oct 11 '15 at 12:02
T JT J
32.7k957111
32.7k957111
did not work for me,
– sairfan
Sep 26 '17 at 20:40
@sairfan for this to work the event should be bound with rivets event binder. Answer had the copy pasted js binding from question. If rivets binding doesn't work please share an Minimal, Complete, and Verifiable example
– T J
Sep 29 '17 at 10:04
add a comment |
did not work for me,
– sairfan
Sep 26 '17 at 20:40
@sairfan for this to work the event should be bound with rivets event binder. Answer had the copy pasted js binding from question. If rivets binding doesn't work please share an Minimal, Complete, and Verifiable example
– T J
Sep 29 '17 at 10:04
did not work for me,
– sairfan
Sep 26 '17 at 20:40
did not work for me,
– sairfan
Sep 26 '17 at 20:40
@sairfan for this to work the event should be bound with rivets event binder. Answer had the copy pasted js binding from question. If rivets binding doesn't work please share an Minimal, Complete, and Verifiable example
– T J
Sep 29 '17 at 10:04
@sairfan for this to work the event should be bound with rivets event binder. Answer had the copy pasted js binding from question. If rivets binding doesn't work please share an Minimal, Complete, and Verifiable example
– T J
Sep 29 '17 at 10:04
add a comment |
0
Here is something how i gone through this. Just copy and paste working examples below
<body>
<div rv-each-book="model.books">
<button rv-on-click="model.selectedBook | args book">
Read the book {book}
</button>
</div>
</body>
<script type="text/javascript">
rivets.formatters["args"] = function (fn) {
var args = Array.prototype.slice.call(arguments, 1);
return function () {
return fn.apply(null, args);
};
};
rvBinder = rivets.bind(document.body, {
model: {
selectedBook: function (book) {
alert("Selected book is " + book);
},
books: ["Asp.Net", "Javascript"]
}
});
</script>
Or an alternate approach is binding event
<body>
<div rv-each-book="books">
<a rv-cust-href="book">
Read the book {book}
</a>
</div>
</body>
<script type="text/javascript">
rivets.binders['cust-href'] = function (el, value) {
//el.href = '/Books/Find/' + value;
//OR
el.onclick = function () { alert(value); };
}
rvBinder = rivets.bind(document.body, {
books: ["Asp.Net", "Javascript"]
});
</script>
answered Sep 28 '17 at 16:18
sairfansairfan
1501411
This is not the right way to do it, unless something broke in a version update of rivets, in that case you should report a bug rather than using poor work arounds
– T J
Sep 29 '17 at 10:01
1
should i stop my project until i get solution?? we have to comeout of situation, we will update when its updated in rivetsjs. this issue is already reported, solution something like above is discussed on rivetsjs related page, you did not even bother to verify what I'm trying to say.
– sairfan
Sep 29 '17 at 15:23
I did check the source of rivets before posting the comment, and the existing answer should still work with minor change to arguments. The answer is 6 years old, JS libraries update very fast. The answer contains the code for invoking event handler from rivet's source at the time of writing. It seems you did not do any investigation on why existing solution doesn't work...
– T J
Sep 29 '17 at 15:39
you did not described your answer well, I asked question on it, that its not working for me, but no reply, I further searched around and reached issue at link I found the solution, and i posted so that it can help others, I also provided the link where event is binded which is still better explained and working example.
– sairfan
Sep 29 '17 at 15:39
add a comment |
0
Here is something how i gone through this. Just copy and paste working examples below
<body>
<div rv-each-book="model.books">
<button rv-on-click="model.selectedBook | args book">
Read the book {book}
</button>
</div>
</body>
<script type="text/javascript">
rivets.formatters["args"] = function (fn) {
var args = Array.prototype.slice.call(arguments, 1);
return function () {
return fn.apply(null, args);
};
};
rvBinder = rivets.bind(document.body, {
model: {
selectedBook: function (book) {
alert("Selected book is " + book);
},
books: ["Asp.Net", "Javascript"]
}
});
</script>
Or an alternate approach is binding event
<body>
<div rv-each-book="books">
<a rv-cust-href="book">
Read the book {book}
</a>
</div>
</body>
<script type="text/javascript">
rivets.binders['cust-href'] = function (el, value) {
//el.href = '/Books/Find/' + value;
//OR
el.onclick = function () { alert(value); };
}
rvBinder = rivets.bind(document.body, {
books: ["Asp.Net", "Javascript"]
});
</script>
answered Sep 28 '17 at 16:18
sairfansairfan
1501411
This is not the right way to do it, unless something broke in a version update of rivets, in that case you should report a bug rather than using poor work arounds
– T J
Sep 29 '17 at 10:01
1
should i stop my project until i get solution?? we have to comeout of situation, we will update when its updated in rivetsjs. this issue is already reported, solution something like above is discussed on rivetsjs related page, you did not even bother to verify what I'm trying to say.
– sairfan
Sep 29 '17 at 15:23
I did check the source of rivets before posting the comment, and the existing answer should still work with minor change to arguments. The answer is 6 years old, JS libraries update very fast. The answer contains the code for invoking event handler from rivet's source at the time of writing. It seems you did not do any investigation on why existing solution doesn't work...
– T J
Sep 29 '17 at 15:39
you did not described your answer well, I asked question on it, that its not working for me, but no reply, I further searched around and reached issue at link I found the solution, and i posted so that it can help others, I also provided the link where event is binded which is still better explained and working example.
– sairfan
Sep 29 '17 at 15:39
add a comment |
0
0
0
Here is something how i gone through this. Just copy and paste working examples below
<body>
<div rv-each-book="model.books">
<button rv-on-click="model.selectedBook | args book">
Read the book {book}
</button>
</div>
</body>
<script type="text/javascript">
rivets.formatters["args"] = function (fn) {
var args = Array.prototype.slice.call(arguments, 1);
return function () {
return fn.apply(null, args);
};
};
rvBinder = rivets.bind(document.body, {
model: {
selectedBook: function (book) {
alert("Selected book is " + book);
},
books: ["Asp.Net", "Javascript"]
}
});
</script>
Or an alternate approach is binding event
<body>
<div rv-each-book="books">
<a rv-cust-href="book">
Read the book {book}
</a>
</div>
</body>
<script type="text/javascript">
rivets.binders['cust-href'] = function (el, value) {
//el.href = '/Books/Find/' + value;
//OR
el.onclick = function () { alert(value); };
}
rvBinder = rivets.bind(document.body, {
books: ["Asp.Net", "Javascript"]
});
</script>
answered Sep 28 '17 at 16:18
sairfansairfan
1501411
Here is something how i gone through this. Just copy and paste working examples below
<body>
<div rv-each-book="model.books">
<button rv-on-click="model.selectedBook | args book">
Read the book {book}
</button>
</div>
</body>
<script type="text/javascript">
rivets.formatters["args"] = function (fn) {
var args = Array.prototype.slice.call(arguments, 1);
return function () {
return fn.apply(null, args);
};
};
rvBinder = rivets.bind(document.body, {
model: {
selectedBook: function (book) {
alert("Selected book is " + book);
},
books: ["Asp.Net", "Javascript"]
}
});
</script>
Or an alternate approach is binding event
<body>
<div rv-each-book="books">
<a rv-cust-href="book">
Read the book {book}
</a>
</div>
</body>
<script type="text/javascript">
rivets.binders['cust-href'] = function (el, value) {
//el.href = '/Books/Find/' + value;
//OR
el.onclick = function () { alert(value); };
}
rvBinder = rivets.bind(document.body, {
books: ["Asp.Net", "Javascript"]
});
</script>
answered Sep 28 '17 at 16:18
sairfansairfan
1501411
edited Oct 2 '17 at 17:05
answered Sep 28 '17 at 16:18
sairfansairfan
1501411
answered Sep 28 '17 at 16:18
sairfansairfan
1501411
answered Sep 28 '17 at 16:18
sairfansairfan
1501411
1501411
This is not the right way to do it, unless something broke in a version update of rivets, in that case you should report a bug rather than using poor work arounds
– T J
Sep 29 '17 at 10:01
1
should i stop my project until i get solution?? we have to comeout of situation, we will update when its updated in rivetsjs. this issue is already reported, solution something like above is discussed on rivetsjs related page, you did not even bother to verify what I'm trying to say.
– sairfan
Sep 29 '17 at 15:23
I did check the source of rivets before posting the comment, and the existing answer should still work with minor change to arguments. The answer is 6 years old, JS libraries update very fast. The answer contains the code for invoking event handler from rivet's source at the time of writing. It seems you did not do any investigation on why existing solution doesn't work...
– T J
Sep 29 '17 at 15:39
you did not described your answer well, I asked question on it, that its not working for me, but no reply, I further searched around and reached issue at link I found the solution, and i posted so that it can help others, I also provided the link where event is binded which is still better explained and working example.
– sairfan
Sep 29 '17 at 15:39
add a comment |
This is not the right way to do it, unless something broke in a version update of rivets, in that case you should report a bug rather than using poor work arounds
– T J
Sep 29 '17 at 10:01
1
should i stop my project until i get solution?? we have to comeout of situation, we will update when its updated in rivetsjs. this issue is already reported, solution something like above is discussed on rivetsjs related page, you did not even bother to verify what I'm trying to say.
– sairfan
Sep 29 '17 at 15:23
I did check the source of rivets before posting the comment, and the existing answer should still work with minor change to arguments. The answer is 6 years old, JS libraries update very fast. The answer contains the code for invoking event handler from rivet's source at the time of writing. It seems you did not do any investigation on why existing solution doesn't work...
– T J
Sep 29 '17 at 15:39
you did not described your answer well, I asked question on it, that its not working for me, but no reply, I further searched around and reached issue at link I found the solution, and i posted so that it can help others, I also provided the link where event is binded which is still better explained and working example.
– sairfan
Sep 29 '17 at 15:39
This is not the right way to do it, unless something broke in a version update of rivets, in that case you should report a bug rather than using poor work arounds
– T J
Sep 29 '17 at 10:01
This is not the right way to do it, unless something broke in a version update of rivets, in that case you should report a bug rather than using poor work arounds
– T J
Sep 29 '17 at 10:01
1
1
should i stop my project until i get solution?? we have to comeout of situation, we will update when its updated in rivetsjs. this issue is already reported, solution something like above is discussed on rivetsjs related page, you did not even bother to verify what I'm trying to say.
– sairfan
Sep 29 '17 at 15:23
should i stop my project until i get solution?? we have to comeout of situation, we will update when its updated in rivetsjs. this issue is already reported, solution something like above is discussed on rivetsjs related page, you did not even bother to verify what I'm trying to say.
– sairfan
Sep 29 '17 at 15:23
I did check the source of rivets before posting the comment, and the existing answer should still work with minor change to arguments. The answer is 6 years old, JS libraries update very fast. The answer contains the code for invoking event handler from rivet's source at the time of writing. It seems you did not do any investigation on why existing solution doesn't work...
– T J
Sep 29 '17 at 15:39
I did check the source of rivets before posting the comment, and the existing answer should still work with minor change to arguments. The answer is 6 years old, JS libraries update very fast. The answer contains the code for invoking event handler from rivet's source at the time of writing. It seems you did not do any investigation on why existing solution doesn't work...
– T J
Sep 29 '17 at 15:39
you did not described your answer well, I asked question on it, that its not working for me, but no reply, I further searched around and reached issue at link I found the solution, and i posted so that it can help others, I also provided the link where event is binded which is still better explained and working example.
– sairfan
Sep 29 '17 at 15:39
you did not described your answer well, I asked question on it, that its not working for me, but no reply, I further searched around and reached issue at link I found the solution, and i posted so that it can help others, I also provided the link where event is binded which is still better explained and working example.
– sairfan
Sep 29 '17 at 15:39
add a comment |
0
Sorry if I'm late, just started using Rivets and had come across the same problem.
Solution: Bind your function first
For example you have a function:
function customOnClickCallback(event, item) {
console.log(event);
console.log(item);
console.log(item.thing); // Instead of {{ thing }}
}
First you bind your function to be called (I'll be binding it to the Body for now):
rivets.bind(document.getElementsByTagName("body")[0], {
customOnClick: customOnClickCallback
});
Then you can use customOnClick as your rv-on-click
<input type=button value="Click" rv-on-click="customOnClick">
As for accessing your variable thing, it should be accessible as item.thing.
answered Jan 1 at 23:20
Rishav ThakkerRishav Thakker
83
add a comment |
0
Sorry if I'm late, just started using Rivets and had come across the same problem.
Solution: Bind your function first
For example you have a function:
function customOnClickCallback(event, item) {
console.log(event);
console.log(item);
console.log(item.thing); // Instead of {{ thing }}
}
First you bind your function to be called (I'll be binding it to the Body for now):
rivets.bind(document.getElementsByTagName("body")[0], {
customOnClick: customOnClickCallback
});
Then you can use customOnClick as your rv-on-click
<input type=button value="Click" rv-on-click="customOnClick">
As for accessing your variable thing, it should be accessible as item.thing.
answered Jan 1 at 23:20
Rishav ThakkerRishav Thakker
83
add a comment |
0
0
0
Sorry if I'm late, just started using Rivets and had come across the same problem.
Solution: Bind your function first
For example you have a function:
function customOnClickCallback(event, item) {
console.log(event);
console.log(item);
console.log(item.thing); // Instead of {{ thing }}
}
First you bind your function to be called (I'll be binding it to the Body for now):
rivets.bind(document.getElementsByTagName("body")[0], {
customOnClick: customOnClickCallback
});
Then you can use customOnClick as your rv-on-click
<input type=button value="Click" rv-on-click="customOnClick">
As for accessing your variable thing, it should be accessible as item.thing.
answered Jan 1 at 23:20
Rishav ThakkerRishav Thakker
83
Sorry if I'm late, just started using Rivets and had come across the same problem.
Solution: Bind your function first
For example you have a function:
function customOnClickCallback(event, item) {
console.log(event);
console.log(item);
console.log(item.thing); // Instead of {{ thing }}
}
First you bind your function to be called (I'll be binding it to the Body for now):
rivets.bind(document.getElementsByTagName("body")[0], {
customOnClick: customOnClickCallback
});
Then you can use customOnClick as your rv-on-click
<input type=button value="Click" rv-on-click="customOnClick">
As for accessing your variable thing, it should be accessible as item.thing.
answered Jan 1 at 23:20
Rishav ThakkerRishav Thakker
83
answered Jan 1 at 23:20
Rishav ThakkerRishav Thakker
83
answered Jan 1 at 23:20
Rishav ThakkerRishav Thakker
83
answered Jan 1 at 23:20
Rishav ThakkerRishav Thakker
83
83
add a comment |
add a comment |
draft saved
draft discarded
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
draft saved
draft discarded
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f32693453%2frivets-js-when-button-is-clicked-call-a-function-with-an-argument-from-a-data%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
rv-on-click="abc( {thing} )"rivetsjs.com/docs/reference/#on-[event] You need to read what 2 way binding is, and use the documentation of the binding library.– Pogrindis
Sep 21 '15 at 11:46
Nope. I definitely tried that, and it doesn't work. Gives this error: Uncaught TypeError: this.call is not a function / t.public.handler @ rivets.bundled.min.js:6 / t.Binding.e.eventHandler @ rivets.bundled.min.js:6 / n.event.dispatch @ jquery-2.1.4.min.js:3 / n.event.add.r.handle @ jquery-2.1.4.min.js:3
– paulwal222
Sep 21 '15 at 13:11
The only working solution I found is using a function that is a member of {thing}, which seems ridiculous to me. So:
rv-on-click="thing.my_function"– paulwal222
Sep 21 '15 at 13:14