topic Re: How Can I use JS in the Widget.html ? in Web AppBuilder Custom Widgets Questions

How Can I use JS in the Widget.html ?

AliAjami-Bakhtyarvand — Mon, 24 Sep 2018 19:35:51 GMT

<a class="twitter-timeline" href="https://twitter.com/TwitterDev?ref_src=twsrc%5Etfw">Tweets by TwitterDev</a>

I was trying to use this code that is with HTML and JS but it does not work.

Could you please help me to use JS in HTML widget ?

Thanks.

Re: How Can I use JS in the Widget.html ?

GeoprocessamentoCarusoJR — Wed, 26 Sep 2018 00:01:25 GMT

I don't know if you can use script tags but... there's another problem :

You can't have orphan tags in the widget.html

For example, do this :

<div>

<a class="twitter-timeline" href="https://twitter.com/TwitterDev?ref_src=twsrc%5Etfw">Tweets by TwitterDev</a>

</div>

Re: How Can I use JS in the Widget.html ?

AliAjami-Bakhtyarvand — Wed, 26 Sep 2018 01:40:15 GMT

Yes, it does not work, I put script in the lib and upload it on the index.html (head) , then I have this on the source library on my home page when I check debugger. so the html and java code is separate now but still does not work.

Thanks,

Re: How Can I use JS in the Widget.html ?

AliAjami-Bakhtyarvand — Wed, 26 Sep 2018 12:31:06 GMT

My result for use that code and add twitter on lib.

Re: How Can I use JS in the Widget.html ?

AliAjami-Bakhtyarvand — Wed, 26 Sep 2018 12:57:55 GMT

I find solution. I need to add Widget.js without HTML and UI file.

the code is:

define(['dojo/_base/declare', 'jimu/BaseWidget'],

function(declare, BaseWidget){

var TwetterTag = declare(BaseWidget, {

templateString: '<div><a class="twitter-timeline" href="https://twitter.com/TwitterDev?ref_src=twsrc%5Etfw">Tweets by TwitterDev800005</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script></div>' ,

startup: function(){

}

});

return TwetterTag;

});

console.log("This is going to add twitter platfrom into page");

// Attaching jQuery the non-blocking way.

var elmScript = document.createElement('script');

elmScript .src = 'https://platform.twitter.com/widgets.js'; // change file to your jQuery library

elmScript .type = 'text/javascript';

document.getElementsByTagName('head')[0].appendChild( elmScript );

/////////////////////////////////////////////////////////////////////////

///config manifest.json

{

"name": "CustomTwitterDemo",

"platform": "HTML",

"version": "1.0",

"wabVersion": "1.0",

"author": "Ali",

"description": "This widget Weather with JQuery and https://weatherwidget.io/",

"copyright": "",

"license": "",

"properties": {

"hasConfig": false,

"hasStyle": false,

"hasLocale": false ,

"hasUIFile": false,

"hasSettingPage": false

}