if i have
Polymer({
is: 'whatever',
myFunction: function () {
alert("ok");
}
});
How do run myFunction from outside Polymer({ .. });
Is that possible?
the normal java-script way would be myFunction() but i understand Polymer works differently.
Thanks
Just reference the module on the page and call the method.
document.querySelector("whatever").myFunction();
Related
Uncaught DOMException: Failed to execute 'define' on 'CustomElementRegistry': "undefined" is not a valid custom element name...
My Custom Element is named resume-app
Someone mentioned on a different post that that may be the reason why it failed so I am wondering what else I could have done wrong?
The webpage loads all the elements correctly just the console is littered with these exceptions.
Maybe you don't have the function name in the script:
<script>
Polymer({
is: 'logout-element',
logout: function() {
this.$.logoutEndpoint.go();
},
logoutResponse: function() {
this.fire("logout");
},
logoutError: function() {
this.$.errorToast.text="Logout Service Error";
this.$.errorToast.show();
}
});
</script>
Reinstalling the webcomponents package, older versions are not supported.
I'd like to set up my default task to run with watch task if environment is set production. I can't find solution to make my gulp-if conditional work in a tasks stack. Here's my code:
gulp.task('default', ['styles', 'scripts', 'video' ], function() {
gulpif(isProduction, gulp.task('watch'));
});
Instead of gulp.task('watch') use gulp.start('watch') although you usually don't want to call a task from another task. A better way would be for you to create a function and call the function instead.
Also note: the gulp.start() method will no longer work with gulp4
Update:
Here is an example of how to use functions within gulp:
var someFile = require('./someFile.js');
gulp.task('my-custom-task', function () {
someFile.doSomething('foo', 'bar');
});
If your function does something asynchronously, it should call a callback at the end, so gulp is able to know when it’s done:
var someFile = require('./someFile.js');
gulp.task('my-custom-task', function (callback) {
someFile.doSomething('foo', 'bar', callback);
});
I'm really new at BB10, but I need to update a HTML app for BB10 where I need to call a function when the app opens. I have no idea where to begin and I can't find anything on Google. Can anyone give me some direction?
EDIT: I found a file called app.js with a function App.init = function(){..}
Safe to assume this is where I call the function?
OK I guess I was a noob, but I just put it in the <script> tag where I declare the js file.
<script type="text/javascript" src="js/BlackBerry-Test.js">
$(document).ready(function () {
updateFeed(true);
});
</script>
you can use IIFE(Immediately Invoke Function Expression)
(function(){
App.init();
})()
In the Firefox developer tools I get the following log output:
GET XHR http://localhost:8080/localhost:8080/journal_tag
even though I want to go to:
http://localhost:8080/journal_tag
I try to data bind the server location from which the xhr response should come to the variable 'this.the_server_url'. But I am stumped because when I do either of
console.log(document.location.protocol+document.location.host+"/journal_tag")
console.log(this.the_server_url)
I get
"http:localhost:8080/journal_tag"
which is where server side go code should respond to the xhr request. So the Firefox developer tools log tells me that iron-ajax, or iron-ajax in conjunction with page.js from polymer-starter-kit is misbehaving even though it has the right xhr destination in the the_server_url variable. If anyone has any thoughts on this I would appreciate an answer.
This is my js code:
<dom-module id="journal-tag">
<template>
<paper-input value={{the_new_tag}}>
Enter the new tag
</paper-input>
<paper-button raised on-tap="tap_new_tag">
Submit tag
</paper-button>
<iron-ajax
auto
url={{the_server_url}}
params={{ajax_new_tag}}
handle-as="json"
on-response="new_tag_response"
last-response={{the_xhr_response}}
debounce-duration="300">
</iron-ajax>
</template>
<script>
(function() {
'use strict';
Polymer({
is: 'journal-tag',
properties:{
the_new_tag:{
type:String,
notify:true
},
the_server_url:{
type:String,
notify:true
},
ajax_new_tag:{
type:String,
notify:true
},
the_xhr_response:{
type:String,
notify:true
}
},
ready : function(){
this.the_server_url=document.location.protocol+document.location.host+"/journal_tag";
},
tap_new_tag : function(){
//parameter format for{{ajax_new_tag}}:
//'{"alt":"json", "q":"chrome"}'
// this.the_new_tag="tadu";
this.ajax_new_tag={"tag" : this.the_new_tag};
},
new_tag_response : function(){
console.log("tada")
console.log(this.the_xhr_response)
alert(this.the_xhr_response)
}
});
})();
</script>
</dom-module>
Here is my server side go code, but it seems it never gets called:
...
http.HandleFunc("/journal_tag",journal_tag)
...
func journal_tag(w http.ResponseWriter, r *http.Request){
c := appengine.NewContext(r)
u := user.Current(c)
if u == nil {
io.WriteString(w, "strange_matter")
return
}
// var tag=r.FormValue("tag")
// io.WriteString(w, "{\"tag\":\"" + tag + "\"}")
io.WriteString(w, "{\"tag\":\"tada\"}")
}
A couple of things. You are missing the slashes in http:localhost:8080/journal_tag It should be http://localhost:8080/journal_tag. Also, you can use the Developer tools for the browser you are in to see all the XHR requests that you are sending. Check there to see what the request headers being sent are.
Seems like doing
document.location.protocol+
"//"+
document.location.host+
"/journal_tag"
fixes everything.
I've been struggling with this for a while and can't figure it out. Hopefully it's something obvious that I missed.
Here's the code:
$(document).ready(function() {
$('#clickbox').load('eventpage/clicks.html.php #click2', function () {
console.log('click2 loaded');
$(this).hide()
.fadeIn(3000);
$('#click2').click(function(e) {
e.preventDefault();
console.log('click2 clicked');
$('#bizdev').load('pagewithscripttags.php', function (data) {
console.log(data);
console.log('#bizdev is loaded, but scripts are not run');
$('#bizdev').hide();
console.log('bizdev hidden');
});
$('#content').hide();
$('#bizdev').show();
});
});
When I run this (from an external js file), the file 'pagewithscripttags.php' is loaded into the DOM on the click event, but the scripts are not executed and I can't figure out why. HELP!
However, when I move the load method into the callback function of the first load, the file is inserted into the DOM and the scripts are run:
$(document).ready(function() {
$('#clickbox').load('eventpage/clicks.html.php #click2', function () {
console.log('click2 loaded');
$(this).hide()
.fadeIn(3000);
$('#bizdev').load('pagewithscripttags.php', function (data) {
console.log(data);
console.log('#bizdev loaded and scripts are run');
$('#bizdev').hide();
console.log('#bizdev hidden');
});
$('#click2').click(function(e) {
e.preventDefault();
console.log('click2 clicked');
$('#content').hide();
$('#bizdev').show();
});
});
Why do the scripts run as part of the callback function, but not on the click event (which is when I need them to run)?
Here are the contents of pagewithscripts.php:
<script>console.log('this script was run');</script>
<script type="IN/MemberProfile" data-id="http://linkedin.com/publicprofileurl" data-format="inline" width='106px' data-related="false"></script>
The first script is run and appears on the console.log, but the second is just inserted into the DOM without being run, except when I place the .load() method outside of the click handler.
(I need to load the scripts on the click event because they take several seconds to run (they call the LinkedIn API) and there's freezing/lag when I run them on document ready.)
You probably need to tell the LinkedIn framework to re-scan the page.
IN.parse(domNode)
This is covered on the JavaScript API reference document on events here:
https://developer.linkedin.com/documents/inauth-inevent-and-inui
Load the script datatype
http://api.jquery.com/jQuery.getScript/
Actually jQuery 'click()' function will not handle the 'click' event of dynamic elements, so try on() or live() functions to make your code working fine, using these functions you can move the click handler code out of the first load() callback.
FYI: Try to replace your $('#click2').click(function(e) { code with this $('#click2').live("click", function(e) { code.
Note: 'live()' function is deprecated from the jQuery version 1.7 onwards.
If you are not clear to use these functions then just provide your full page source so that I can check and adjust your code accordingly.