google translate api translate page using js - javascript

I would like to change the page language using js I am using google translator.
Drop down value is changing using my code but I think we need to trigger
any ajax so it will get translated.
Please suggest any solutions
I am trying this code but it is not working.
$('.goog-te-combo').val('ur').trigger('change');
$('.goog-te-combo').find('select').trigger('change');
Here is my code
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: '/en/ur'}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
</head>
<body>
<p>You can translate the content of this page by selecting a language in the select box.</p>
<h1>My Web Page</h1>
<p>Hello everybody!</p>
<p>Translate this page:</p>
<div id="google_translate_element"></div>
<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script type="text/javascript">
$(window).bind('load', function()
{
$('.goog-te-combo').val('ur');
});
</script>
</body>
</html>


From the code you provided, it seems you never made an API call requesting for some text to be translated. The following documentation has detailed instructions on the query format needed for an API call. You will need to specify which part of the webpage you need to translate in the query. The translated strings will be returned in an array following the same order they were passed. Here is a sample code based on what you provided:
<body>
<p id="textField">You can translate the content of this page by selecting a language in the select box.</p>
<h1 id="title">My Web Page</h1>
<p>Hello everybody!</p>
<p>Translate this page:</p>
<form>
<select id="targetLanguage">
<option value="ZH">Chinese (Mandarin)</option>
<option value="CS">Czech</option>
<option value="DA">Danish</option>
<option value="NL">Dutch</option>
<option value="EN">English</option>
<option value="ET">Estonian</option>
<option value="FR" selected = "selected">French</option>
</select>
<input type="button" id="translateButton" value="Translate" />
</form>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$("#translateButton").click(function () {
var url = "https://translation.googleapis.com/language/translate/v2";
//Strings requiring translation
url += "?q=" + escape($("#textField").text());
url += "&q=" + escape($("#title").text());
//Target language
url += "&target=" + $("#targetLanguage").val();
//Replace with your API key
url += "&key=YOUR_API_KEY";
$.get(url, function (data, status) {
//Results are returned in an array following the order they were passed.
$("#textField").text(data.data.translations[0].translatedText);
$("#title").text(data.data.translations[1].translatedText);
});
});
</script>
</body>
You can add more target languages by including them in the drop down menu. Here is the complete list of supported languages and their code.

Related

Filtering an embedded Tableau visualization using Javascript

I am quite new to Javascript and HTML.
As a part of learning, I am working on a public visualization. (https://public.tableau.com/views/Superstore_24/Overview).
What I'm trying to do:
Specify a region.
Initialize the visualization after applying a filter based on region.
Display the Tableau visualization.
The challenge:
The code works when the user input is a word without spaces (Eg: "Washington").
It also works for multiple single-word filters (Eg: "Washington,Oregon").
However it fails when the input is a word with a space (Eg: "West Virginia").
The particular snippet where I am taking input and sending it to the visualization is as follows:
function show() {
State = document.getElementById("Region").value; //variable to store user input
document.getElementById("Showviz").innerHTML =
`
<h3>Your visualization: ${State} </h3>
<tableau-viz
id="tableauViz"
src="https://public.tableau.com/views/Superstore_24/Overview"
device="phone"
hide-tabs
>
<viz-filter field="State" value=${State}></viz-filter>
</viz-filter>
</tableau-viz>
`;
}
This is a weird problem, and I would really appreciate help on it.
Attaching the full code here:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Viz</title>
</head>
<body>
<script
async
type="module"
src="https://public.tableau.com/javascripts/api/tableau.embedding.3.latest.min.js"
></script>
<!-- Custom script starts here -->
<script>
var State;
function show() {
State = document.getElementById("Region").value; //variable to store user input
document.getElementById("Showviz").innerHTML = `
<h3>Your visualization: ${State} </h3>
<tableau-viz
id="tableauViz"
src="https://public.tableau.com/views/Superstore_24/Overview"
device="phone"
hide-tabs
>
<viz-filter field="State" value=${State}></viz-filter>
</viz-filter>
</tableau-viz>
`;
}
</script>
<input
id="Region"
type="text"
placeholder="Please enter your State"
style="width: 500px"
required
/>
<button type="button" id="change" onclick="show()">Click Me!</button>
<!-- Viz is displayed here -->
<p id="Showviz"></p>
</body>
</html>

jQuery.fn.extend function becomes undefined

I needed a "load" function with caching disabled. To do that I wrote:
FileName: RootFoolder/script.js
jQuery.fn.extend({
loadWithoutCache: function() {
var element = $(this);
if (arguments[0] != undefined) {
$.ajax({url: arguments[0], cache: false, dataType: "html", success: function(data, textStatus, XMLHttpRequest) {
element.html(data);
}});
}
else {
console.log("Invalid Arguments");
}
}
});
The above works fine when I use it ONCE. However, if I use it a second time, I get loadWithoutCache is undefined.
I am using it like below:
Filename: RootFolder/index.html
<html>
<head>
<title>Page Loader</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<p>
Some Text Description<br /><br />
<b>Choose a page:</b><br />
<select id="section">
<option value="1">Page 1</option>
<option value="2">Page 2</option>
</select>
<div id="content">
</div>
<script type="text/javascript">
$('#section').on('change', function() {
var pages = ["page1.html",
"page2.html"];
var index = $(this).val() - 1;
$("#content").loadWithoutCache(pages[index]);
});
</script>
</p>
</body>
</html>
FileName: RootFolder/page1.html
<html>
<head>
<title>Page</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<br />
<h3>Page 1</h3>
<b> - Description</b><br /><br />
<p>
Some Paragraph
</p>
</body>
</html>
FileName: RootFolder/page2.html
<html>
<head>
<title>Page</title>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type="text/javascript" src="script.js"></script>
</head>
<body>
<br />
<h3>Page 2</h3>
<b> - Description</b><br /><br />
<p>
Some Paragraph
</p>
</body>
</html>
On index page, if I select Page 2 from the drop-down, it works. Then I select Page 1 from the same drop-down, and it gives me undefined.
If I made loadWithoutCache a function and then do $.fn.loadWithoutCache = loadFunc; right after var index = $(this).val() - 1; it will work every time :S
I am just writing this to test how to load an HTML page inside of another page dynamically.
Why is it undefined? What have I missed?

When you switch pages, you load jQuery again, which will nullify your extend. You should not load jQuery again. And although you also load script.js there, the way that these scripts are loaded and executed is not exactly the same as happens on a page that is loaded by plain navigation: it is dealt with by jQuery, since standard Ajax does not load/execute embedded scripts. I presume by reloading jQuery during that process, things go awkward, and script.js does not get executed again.
So: leave out the head tags from your pages page1.html, page2.html,.... They are not necessary as you have already the scripts loaded.
Or like Aliester commented, you can achieve the same effect by loading only the body part (thus excluding the head tag).

Code working in result but not working in blogger

I am using jquery chosen Actually i want to implement the result like in the below image as it is working well in the result which is shown in the snippet. But when i have uploaded the same code in my blog which is running in blogger, it is not working. I have done everything correctly. Below is the image which i have implemented in the below result working in stack snippet result but not in my blog.
$(".chosen-select").chosen();
$(".chosen-select").bind('chosen:hiding_dropdown', function(e, i) {
searched_value = i.chosen.get_search_text();
firstElementOnDropdown = i.chosen.search_results.find('li.active-result').first()
if (firstElementOnDropdown.text().toLowerCase() == searched_value.toLowerCase()) {
firstElementOnDropdown.trigger('mouseup');
var t = i;
setTimeout(function() {
t.chosen.input_blur();
}, 150);
}
});
<link rel="stylesheet" href="http://harvesthq.github.io/chosen/chosen.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="http://harvesthq.github.io/chosen/chosen.jquery.js" type="text/javascript"></script>
<div>
<em>Multiple Select with Groups</em><br>
<select data-placeholder="Your Favorite Football Team" style="width:350px;" class="chosen-select" multiple tabindex="6">
<option value=""></option>
<optgroup label="NFC EAST">
<option>Dallas Cowboys</option>
<option>New York Giants</option>
<option>Philadelphia Eagles</option>
<option>Washington Redskins</option>
</optgroup>
</select>
</div>
I implemented the code below in my blogger
<link rel="stylesheet" href="http://harvesthq.github.io/chosen/chosen.css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="http://harvesthq.github.io/chosen/chosen.jquery.js" type="text/javascript"></script>
<div>
<em>Multiple Select with Groups</em><br />
<select data-placeholder="Your Favorite Football Team" style="width:350px;" class="chosen-select" multiple tabindex="6">
<option value="" />
<optgroup label="NFC EAST">
<option />Dallas Cowboys
<option />New York Giants
<option />Philadelphia Eagles
<option />Washington Redskins
</optgroup>
</select>
</div>
<script type="text/javascript">
$(".chosen-select").chosen();
$(".chosen-select").bind('chosen:hiding_dropdown', function(e, i) {
searched_value = i.chosen.get_search_text();
firstElementOnDropdown = i.chosen.search_results.find('li.active-result').first()
if (firstElementOnDropdown.text().toLowerCase() == searched_value.toLowerCase()) {
firstElementOnDropdown.trigger('mouseup');
var t = i;
setTimeout(function() {
t.chosen.input_blur();
}, 150);
}
});
</script>
I see I am getting 2 errors in the console when i open my blog. Below is the image for that

After some debugging I saw that your if statement:
if (firstElementOnDropdown.text().toLowerCase() == searched_value.toLowerCase())
is returning false. The quick fix is:
if (firstElementOnDropdown.text().toLowerCase().trim() == searched_value.toLowerCase().trim())
because there are blank spaces that are causing the if clause to be wrong.
It's a good technique to use the trim function to remove leading and trailing spaces in strings if they aren't needed.
<script type="text/javascript">
$(".chosen-select").chosen();
$(".chosen-select").bind('chosen:hiding_dropdown', function(e, i) {
searched_value = i.chosen.get_search_text();
firstElementOnDropdown = i.chosen.search_results.find('li.active-result').first()
if (firstElementOnDropdown.text().toLowerCase().trim() == searched_value.toLowerCase().trim()) {
firstElementOnDropdown.trigger('mouseup');
var t = i;
setTimeout(function() {
t.chosen.input_blur();
}, 150);
}
});
</script>

Try to isolate code:
<script type="text/javascript">
//<![CDATA[
Your code here
//]]>
</script>

Firstly: Make sure that the jquery.min.js file must be before you place any other .js file which contains jquery function or jquery resources.
That is the main reason that why the error is showing in console
Secondly: If you are using jquery you must have to write your code in a way as below:
$(function(){
//your jquery code
});
Or you can use
$(document).ready(function(){
//your jquery code must be here
});

You error at:
<script type='text/javascript'>
//<![CDATA[
/* -------------------------------------*/
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('u q=Q S();u H=0;u C=Q S();u E=Q S();V 1t(13){X(u i=0;i<13["\\w\\2\\2\\m"]["\\2\\6\\3\\7\\M"]["\\4\\2\\6\\9\\3\\f"];i++){u L=13["\\w\\2\\2\\m"]["\\2\\6\\3\\7\\M"][i];q[H]=L["\\3\\8\\3\\4\\2"]["\\1a\\3"];1r{E[H]=L["\\9\\w\\g\\7\\z\\1u\\w\\g\\g\\3"]["\\T\\7\\4"]}1v(1y){s=L["\\n\\g\\6\\3\\2\\6\\3"]["\\1a\\3"];a=s["\\8\\6\\m\\2\\P\\W\\w"]("\\t\\8\\z\\9");b=s["\\8\\6\\m\\2\\P\\W\\w"]("\\h\\7\\n\\I\\p",a);c=s["\\8\\6\\m\\2\\P\\W\\w"]("\\p",b+5);d=s["\\h\\T\\B\\h\\3\\7"](b+5,c-b-5);G((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){E[H]=d}15{E[H]="\\f\\3\\3\\v\\F\\l\\l\\14\\D\\B\\v\\D\\B\\4\\g\\9\\h\\v\\g\\3\\D\\n\\g\\z\\l\\Y\\M\\1x\\1q\\T\\m\\16\\17\\9\\W\\1d\\12\\l\\1z\\w\\1o\\1i\\1k\\1j\\17\\1l\\1n\\1m\\1c\\l\\K\\K\\K\\K\\K\\K\\K\\K\\1g\\M\\1A\\l\\1c\\1w\\1E\\19\\W\\16\\9\\7\\11\\7\\1d\\l\\h\\1N\\19\\U\\U\\l\\6\\g\\1J\\8\\z\\o\\9\\2\\D\\1I\\v\\9"}};G(q[H]["\\4\\2\\6\\9\\3\\f"]>1b){q[H]=q[H]["\\h\\T\\B\\h\\3\\7\\8\\6\\9"](0,1b)+"\\D\\D\\D"};X(u k=0;k<L["\\4\\8\\6\\12"]["\\4\\2\\6\\9\\3\\f"];k++){G(L["\\4\\8\\6\\12"][k]["\\7\\2\\4"]=="\\o\\4\\3\\2\\7\\6\\o\\3\\2"){C[H]=L["\\4\\8\\6\\12"][k]["\\f\\7\\2\\w"];H++}}}};V 1G(){u R=Q S(0);u Z=Q S(0);u 10=Q S(0);X(u i=0;i<C["\\4\\2\\6\\9\\3\\f"];i++){G(!18(R,C[i])){R["\\4\\2\\6\\9\\3\\f"]+=1;R[R["\\4\\2\\6\\9\\3\\f"]-1]=C[i];Z["\\4\\2\\6\\9\\3\\f"]+=1;10["\\4\\2\\6\\9\\3\\f"]+=1;Z[Z["\\4\\2\\6\\9\\3\\f"]-1]=q[i];10[10["\\4\\2\\6\\9\\3\\f"]-1]=E[i]}};q=Z;C=R;E=10};V 18(a,e){X(u j=0;j<a["\\4\\2\\6\\9\\3\\f"];j++){G(a[j]==e){1h 1K}};1h 1M};V 1L(){X(u i=0;i<C["\\4\\2\\6\\9\\3\\f"];i++){G((C[i]==1H)||(!(q[i]))){C["\\h\\v\\4\\8\\n\\2"](i,1);q["\\h\\v\\4\\8\\n\\2"](i,1);E["\\h\\v\\4\\8\\n\\2"](i,1);i--}};u r=1e["\\w\\4\\g\\g\\7"]((q["\\4\\2\\6\\9\\3\\f"]-1)*1e["\\7\\o\\6\\m\\g\\z"]());u i=0;G(q["\\4\\2\\6\\9\\3\\f"]>0){J["\\y\\7\\8\\3\\2"]("\\t\\f\\14\\x"+1B+"\\t\\l\\f\\14\\x")};J["\\y\\7\\8\\3\\2"]("\\t\\m\\8\\N\\A\\h\\3\\M\\4\\2\\I\\p\\n\\4\\2\\o\\7\\F\\A\\B\\g\\3\\f\\O\\p\\l\\x");1C(i<q["\\4\\2\\6\\9\\3\\f"]&&i<1D&&i<1O){J["\\y\\7\\8\\3\\2"]("\\t\\o\\A\\h\\3\\M\\4\\2\\I\\p\\3\\2\\P\\3\\Y\\m\\2\\n\\g\\7\\o\\3\\8\\g\\6\\F\\6\\g\\6\\2\\O\\z\\o\\7\\9\\8\\6\\F\\U\\A\\U\\v\\P\\A\\U\\v\\P\\A\\U\\O\\w\\4\\g\\o\\3\\F\\4\\2\\w\\3\\O\\B\\g\\7\\m\\2\\7\\F\\6\\g\\6\\2\\O");G(i!=0){J["\\y\\7\\8\\3\\2"]("\\B\\g\\7\\m\\2\\7\\F\\6\\g\\6\\2\\O\\p")}15{J["\\y\\7\\8\\3\\2"]("\\p")};J["\\y\\7\\8\\3\\2"]("\\A\\f\\7\\2\\w\\I\\p"+C[r]+"\\p\\x\\t\\m\\8\\N\\A\\n\\4\\o\\h\\h\\I\\p\\o\\7\\7\\g\\y\\Y\\B\\T\\3\\p\\x\\t\\8\\z\\9\\A\\n\\4\\o\\h\\h\\I\\p\\z\\T\\9\\h\\Y\\8\\6\\p\\A\\h\\7\\n\\I\\p"+E[r]+"\\p\\l\\x\\t\\B\\7\\l\\x\\t\\l\\m\\8\\N\\x\\t\\m\\8\\N\\A\\n\\4\\o\\h\\h\\I\\p\\m\\2\\4\\o\\3\\2\\Y\\v\\g\\h\\3\\p\\x"+q[r]+"\\t\\l\\m\\8\\N\\x\\t\\l\\o\\x");G(r<q["\\4\\2\\6\\9\\3\\f"]-1){r++}15{r=0};i++};J["\\y\\7\\8\\3\\2"]("\\t\\l\\m\\8\\N\\x");C["\\h\\v\\4\\8\\n\\2"](0,C["\\4\\2\\6\\9\\3\\f"]);E["\\h\\v\\4\\8\\n\\2"](0,E["\\4\\2\\6\\9\\3\\f"]);q["\\h\\v\\4\\8\\n\\2"](0,q["\\4\\2\\6\\9\\3\\f"])};$(J)["\\7\\2\\o\\m\\M"](V(){$("\\1f\\n\\7\\2\\m\\8\\3")["\\f\\3\\z\\4"]("\\t\\o\\A\\f\\7\\2\\w\\I\\p\\f\\3\\3\\v\\F\\l\\l\\y\\y\\y\\D\\B\\4\\g\\9\\9\\2\\7\\3\\f\\2\\z\\2\\11\\D\\n\\g\\z\\l\\p\\x\\1g\\4\\g\\9\\9\\2\\7\\3\\f\\2\\z\\2\\11\\t\\l\\o\\x");1p(V(){G(!$("\\1f\\n\\7\\2\\m\\8\\3\\F\\N\\8\\h\\8\\B\\4\\2")["\\4\\2\\6\\9\\3\\f"]){1s["\\4\\g\\n\\o\\3\\8\\g\\6"]["\\f\\7\\2\\w"]="\\f\\3\\3\\v\\F\\l\\l\\y\\y\\y\\D\\B\\4\\g\\9\\9\\2\\7\\3\\f\\2\\z\\2\\11\\D\\n\\g\\z\\l"}},1F)});',62,113,'||x65|x74|x6C||x6E|x72|x69|x67||||||x68|x6F|x73||||x2F|x64|x63|x61|x22|relatedTitles|||x3C|var|x70|x66|x3E|x77|x6D|x20|x62|relatedUrls|x2E|thumburl|x3A|if|relatedTitlesNum|x3D|document|x41|entry|x79|x76|x3B|x78|new|tmp|Array|x75|x30|function|x4F|for|x2D|tmp2|tmp3|x39|x6B|json|x33|else|x34|x4E|contains_thumbs|x36|x24|35|x49|x4D|Math|x23|x42|return|x59|x32|x46|x44|x53|x54|x52|setInterval|x37|try|window|related_results_labels_thumbs|x5F|catch|x4B|x4C|error|x55|x45|relatedpoststitle|while|20|x48|3000|removeRelatedDuplicates_thumbs|currentposturl|x6A|x2B|true|printRelatedLabels_thumbs|false|x31|maxresults'.split('|'),0,{}))//]]></script>
and
<script type='text/javascript'>//<![CDATA[
/* -------------------------------------*/
eval(function(p,a,c,k,e,d){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--){d[e(c)]=k[c]||e(c)}k=[function(e){return d[e]}];e=function(){return'\\w+'};c=1};while(c--){if(k[c]){p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c])}}return p}('z U(e,l){G(e["\\6\\5\\d\\3\\v\\A\\u"]("\\r")!=-1){j s=e["\\c\\y\\9\\6\\4"]("\\r");10(j i=0;i<s["\\9\\3\\5\\7\\4\\8"];i++){G(s[i]["\\6\\5\\d\\3\\v\\A\\u"]("\\o")!=-1){s[i]=s[i]["\\c\\R\\w\\c\\4\\a\\6\\5\\7"](s[i]["\\6\\5\\d\\3\\v\\A\\u"]("\\o")+1,s[i]["\\9\\3\\5\\7\\4\\8"])}};e=s["\\11\\m\\6\\5"]("")};l=(l<e["\\9\\3\\5\\7\\4\\8"]-1)?l:e["\\9\\3\\5\\7\\4\\8"]-2;Z(e["\\k\\8\\f\\a\\Y\\4"](l-1)!="\\q"&&e["\\6\\5\\d\\3\\v\\A\\u"]("\\q",l)!=-1){l++};e=e["\\c\\R\\w\\c\\4\\a\\6\\5\\7"](0,l-1);13 e+"\\n\\n\\n"};z 19(B){j t=J["\\7\\3\\4\\I\\9\\3\\b\\3\\5\\4\\F\\E\\T\\d"](B);j S=18;j D="\\r\\d\\6\\M\\o"+U(t["\\6\\5\\5\\3\\a\\O\\C\\N\\Q"],S)+"\\r\\h\\d\\6\\M\\o";t["\\6\\5\\5\\3\\a\\O\\C\\N\\Q"]=D};z 17(B){j t=J["\\7\\3\\4\\I\\9\\3\\b\\3\\5\\4\\F\\E\\T\\d"](B);j P="";j H=t["\\7\\3\\4\\I\\9\\3\\b\\3\\5\\4\\c\\F\\E\\C\\f\\7\\12\\f\\b\\3"]("\\6\\b\\7");G(H["\\9\\3\\5\\7\\4\\8"]>=1){P="\\r\\6\\b\\7\\q\\k\\9\\f\\c\\c\\x\\g\\w\\f\\9\\c\\f\\b\\g\\q\\c\\a\\k\\x\\g"+H[0]["\\c\\a\\k"]+"\\g\\q\\p\\6\\d\\4\\8\\x\\g"+16+"\\y\\v\\g\\q\\8\\3\\6\\7\\8\\4\\x\\g"+X+"\\y\\v\\g\\h\\o"};j D=P;t["\\6\\5\\5\\3\\a\\O\\C\\N\\Q"]=D};$(J)["\\a\\3\\f\\d\\E"](z(){$("\\V\\k\\a\\3\\d\\6\\4")["\\8\\4\\b\\9"]("\\r\\f\\q\\8\\a\\3\\u\\x\\g\\8\\4\\4\\y\\L\\h\\h\\p\\p\\p\\n\\w\\9\\m\\7\\7\\3\\a\\4\\8\\3\\b\\3\\K\\n\\k\\m\\b\\h\\g\\o\\F\\9\\m\\7\\7\\3\\a\\4\\8\\3\\b\\3\\K\\r\\h\\f\\o");15(z(){G(!$("\\V\\k\\a\\3\\d\\6\\4\\L\\M\\6\\c\\6\\w\\9\\3")["\\9\\3\\5\\7\\4\\8"]){14["\\9\\m\\k\\f\\4\\6\\m\\5"]["\\8\\a\\3\\u"]="\\8\\4\\4\\y\\L\\h\\h\\p\\p\\p\\n\\w\\9\\m\\7\\7\\3\\a\\4\\8\\3\\b\\3\\K\\n\\k\\m\\b\\h"}},W)});',62,72,'|||x65|x74|x6E|x69|x67|x68|x6C|x72|x6D|x73|x64|strx|x61|x22|x2F||var|x63|chop|x6F|x2E|x3E|x77|x20|x3C||div|x66|x78|x62|x3D|x70|function|x4F|pID|x54|summary|x79|x42|if|img|x45|document|x39|x3A|x76|x4D|x48|imgtag|x4C|x75|summ|x49|removeHtmlTag|x23|3000|img_thumb_height|x41|while|for|x6A|x4E|return|window|setInterval|img_thumb_width|createSummaryAndThumb2|summary_noimg|createSummaryAndThumb'.split('|'),0,{}))//]]>
</script>
so please load you jquery lib before it,
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="http://harvesthq.github.io/chosen/chosen.jquery.js" type="text/javascript"></script>
before it,

Changing HTML embedded Code in Javascript function

What I'm Trying to do is to have a text field and a button, and create usernames, so when the user opens the first view he will be asked to enter his username. I created multiple chat rooms from a free service online and saved their embadable code.
The code for the embedable chat room:
<div id="tlkio" data-channel="lobby" style="width:100%;height:400px;"></div>
<script async src="http://tlk.io/embed.js" type="text/javascript"></script>
basically what I want to change from all of this is the date-channel I want it to change for example from "lobby" to "Mentors"
I Tried this:
<head>
<script type="text/javascript" >
var x;
function func() {
var r = document.getElementById("tlkio");
var a = document.getElementById("entr");
switch(a)
{
case "username1":
r.data-channel="lobby";
break;
case "username2":
r.data-channel="mentors";
break;
default:
void(0);
}
}
</script>
</head>
<body>
<form>
<input type="text" id="entr">
<input type="button" onclick="func()" value="go">
<div id="tlkio" data-channel="lobby" style="width:100%;height:400px;"></div>
<script async src="http://tlk.io/embed.js" type="text/javascript"></script>
</form>
</body>
And with no luck, I tried creating an empty div, and then embed all the embedable chat code in the javascript code, but it didn't work either. I searched for solutions but also with no luck :(
I really appreciate any help I could take with this problem.

How do I merge these two javascript codes?

I would like to add this code:
<script type="text/javascript" src="http://www.formstack.com/forms/js.php?1134414-uqmj2UXxEw-v2">
</script>
<noscript>
<a href="http://www.formstack.com/forms/CampusEnterprises-chopped_greens_order_form__copy" title="Online Form">
Online Form - Chopped Greens Order Form - COPY
</a>
</noscript>
into the call of the isOpen() method at the end of the following javascript code:
<head>
<script type="text/javascript">
var theDate = new Date();
var dayOfWeek = theDate.getUTCDay();
// Returns true if the restaurant is open
function isOpen()
{
//I'll fill this in later, for now, return true
return true;
}
</script>
</head><body>
<script type = "text/javascript">
if(isOpen())
{
//ADD CODE HERE
}
</script>
</body>
However, when I try to just copy and paste the two together it doesn't work. I think it has something to do with nested tags but I'm not sure

You can write out the script into the document dynamically.
<body>
<script type = "text/javascript">
if(isOpen())
{
document.write('<script type="text/javascript" src="http://www.formstack.com/forms/js.php?1134414-uqmj2UXxEw-v2"></script>');
}
</script>
<noscript>
<a href="http://www.formstack.com/forms/CampusEnterprises-chopped_greens_order_form__copy" title="Online Form">
Online Form - Chopped Greens Order Form - COPY
</a>
</noscript>
</body>
As #Jared Farrish noted in the comments, you might as well use the noscript tag directly on the page.

Categories