I want to translate this jquery code :
$('#zone').prepend('<p><strong>' + login + '</strong> ' + message + '</p>');
I tried that:
document.getElementById('zone').innerHTML = '<p><strong>' + login + '</strong> ' + message + '</p>';
but the problem is i don't know where i can put ".prepend".
thank you for your help
If you want to stick to innerHTML, you can just do this:
const zone = document.getElementById('zone');
zone.innerHTML = '<p><strong>' + login + '</strong> ' + message + '</p>' + zone.innerHTML;
Another idea is to use dynamic element and avoid rewriting your #zone HTML (that's important when you have things like inputs there, because the first example will clear them out):
const p = document.createElement('p');
const strong = document.createElement('strong');
strong.textContent = login;
p.append(strong, ' ' + message);
document.getElementById('zone').prepend(p);
You should add it to the beginning of the string as follows:
var zone = document.getElementById('zone');
const content = zone.innerHTML;
zone.innerHTML = `<p><strong>${login}</strong>${message}</p>` + content;
You can use Node#firstChild property and Node#inserBefore method, so it won't recreate existing child elements.
// create the `p` tag and set its HTML content
const p = document.createElemnt('p');
p.innerHTML = '<strong>' + login + '</strong> ' + message ;
const ele = document.getElementById('zone');
// insert the created p tag element before the first element
ele.insertBefore(p, ele.firstChild) ;
Related
All the \n are removed from the string when the text is put inside mail body .
var valuess = Object.entries(feedBackText);
valuess.forEach(function (key) {
responseText = responseText.concat(' ' + key[0] + ':' + key[1] + '\n');
});
var parsedString = responseText.toString();
window.location = "mailto:myid#gmail.com"+"?subject="+subjectmail+"&body=" +
parsedString;
The following demonstrates how you can solve this using the built-in encodeURIComponent function:
var parsedString = "text on the" + "\n" + "next line";
var link = "mailto:myid#gmail.com" + "?subject=Example&body=" +
encodeURIComponent(parsedString);
console.log(link);
I am trying to make a dynamic HTML which I'll append using jquery before append if I'll console the HTML everything looks fine but after append in browser The whole structure messed up.
Here is my HTML :
<script>
var title = "my title";
var toolbar ='<hm_toolbar user="current_user " upp="hm" index="hmIndex "></hm><synapse_toolbar uuid=" hm.hm_pk " my-method="get_linked_facts" ng-if=" flag == true "></synapse_toolbar>';
var map_html = '<a onclick="panToMarker(' + lat + ',' + long + ')"> ' + title +'"</a>' + toolbar ;
var li_html = "$('#" + title + "').append('<li class=\"list-group-item\"><div dynamic=\" " + map_html + " \"></div></li> ')" ;
var g =title.replace(/ /g,"_");;
var fn = "function "+ g +"(){ console.log('--working--'); "+ li_html +"; }";
console.log(fn)
eval(fn);
}
</script>
When the above li_HTML does its work means append the HTML the appended is all messed up
Appended HTML :
<li class="list-group-item"><div pantomarker(49.711083,6.251445)"="" dynamic=" <a onclick="> Test"<hm_toolbar index="hmIndex " upp="hm" user="current_user "></hm_toolbar><synapse_toolbar ng-if=" flag == true " my-method="get_linked_facts" uuid=" hm.hm_pk "></synapse_toolbar> "></div></li>
I know I have messed up the concatenation using with quotes but I am not able to fixed the bug .
You said that the console.log() looks OK but you have eval() after that which means that you have to escape some quotes twice.
Try this:
var toolbar ='<hm_toolbar user=\\\'current_user \\\' upp=\\\'hm\\\' index=\\\'hmIndex \\\'></hm><synapse_toolbar uuid=\\\' hm.hm_pk \\\' my-method=\\\'get_linked_facts\\\' ng-if=\\\' flag == true \\\'></synapse_toolbar>';
var map_html = '<a onclick=\\\'panToMarker(' + lat + ',' + long + ')\\\'> ' + title +'</a>' + toolbar ;
I have js code that opens a mailto dialog when pressing on link, it is working as "share with a friend" function:
setTimeout( function(){
var subject, body, email_string;
subject = oScript_x.post_title;
body = "you got mail from";
//body += "link: " + "<a href='" + location.href + "'>" + location.href + " </a>";
body += "link " + location.href;
email_string = "mailto:?subject=" + subject + "&body=" + body;
email_string = email_string.replace(/ /g, "%20" ).replace(/\n/g, "%0A");
I tried to use this :
body += "link: " + "" + location.href + " ";
But no luck...
So now I am only showing the link as text with no link.
I would appreciate help to have the link clickable and under an anchor text.
Thanks
The problem is that you are not escaping things properly. Instead of manually replacing certain patterns, you should use encodeURIComponent for each of the parameters that you add.
In other words, your code should look like this:
var subject = ... // whatever you do to create this string
var body = ... // whatever you do to create this string
var encodedSubject = encodeURIComponent(subject);
var encodedBody = encodeURIComponent(body);
var emailLink = 'mailto:?subject=' + encodedSubject + '&body=' + encodedBody;
// ... use emailLink
The following code is currently being generated and produces 'LastName, FirstName'
<div id="welcomeMenuBox">
<spanid="zz4_Menu_t" class="ms-menu-althov ms-welcome-root">
<a id="zz4_Menu" class="ms-core-menu-root" title="Open Menu" href="javascript:;">LastName, FirstName</a>
</span>
</div>
I would like to swap the text on page load so that it says Welcome FirstName, LastName in either JQuery or JavaScript.
You can use:
var text = $('#zz4_Menu').text().split(',');
$('#zz4_Menu').text('Welcome ' + text[1] + ', ' + text[0]);
Fiddle Demo
Here is one method -
var currentText = $('.ms-core-menu-root').text();
var arrayText = currentText.split(',');
var newText = 'Welcome ' + arrayText[1] + ' ' + arrayText[0];
$('.ms-core-menu-root').text(newText);
JavaScript :
var a = document.getElementById('zz4_Menu')
var res = a.innerHTML.split(",")
a.innerHTML = "Welcome " + res[1] + "," + res[0]
Example
function drawLabel(labelsIndex) {
// Check not deleted Label data:(DBID, text, styling, x, y, isDeleted)
if (!labelData[labelsIndex][5]) {
// Create
var newLabel = $('<div id="label' + labelsIndex + '" style="font-size:' + (labelData[labelsIndex][6] * currentScale) + 'px;z-index:9999;position:absolute;left:' + labelData[labelsIndex][3] + 'px;top:' + labelData[labelsIndex][4] + 'px;' + labelData[labelsIndex][2] + '">' + labelData[labelsIndex][1] + '</div>');
$('#thePage').append(newLabel);
// Click edit
$('#label' + labelsIndex).dblclick(function() {
if (!isDraggingMedia) {
var labelText = $('#label' + labelsIndex).html();
$('#label' + labelsIndex).html('<input type="text" id="labelTxtBox' + labelsIndex + '" value="' + labelText + '" />');
document.getElementById('#label' + labelsIndex).blur = (function(index) {
return function() {
var labelText = $('#labelTxtBox' + index).val();
$('#label' + index).html(labelText);
};
})(labelsIndex);
}
});
The code is meant to replace a div's text with a textbox, then when focus is lost, the textbox dissapears and the divs html becomes the textbox value.
Uncaught TypeError: Cannot set property 'blur' of null
$.draggable.start.isDraggingMediaresources.js:27
c.event.handlejquery1.4.4.js:63
I think I'm getting a tad confused with the scope, if anyone could give me some points I'd appreciate it. It would also be good if someone could show me how to remove the blur function after it has been executed (unbind?)
document.getElementById('#label' + labelsIndex).blur is a javascript function and less jquery :) therefore the # hash there is just irrelevant.
$('#label'+labelsIndex).bind('blur',function (){
//labelText value goes here //
});
EDIT
to be honest ur over complicating it :)
<div id="txt1">I am div</div>
<textarea id="txt2">I am text</textarea>
$('#edit_button').click(function (){
var val = $('#txt1').hide().html();// hide the div,then get value,
$('#txt2').show().val(val);//show txtarea then put value of div into it
});
Do the opposite for $('#save_button');