I have a text file that is modified by different python scripts, and I want to create a jquery function that detects each change in that file and to display that change in an initially empty html div
<div id="logtext"> </div>
using
document.getElementById('logtext').innerHTML= new_content_of_the_file;
( something similar to displaying a logfile )
how can I do that?
You can also use HTML like this:
var content = data_from_python;
$("#logtext").html(content);
The difference between HTML and append() function is that HTML replaces the content of your div. It's the equivalent of innerHTML while append just adds content to the end of an element.
Here is a reference on this topic:
.append()
.html()
Is this what you are looking for?
$('#logtext').append('<p>' + resultMessage + '</p>');
you can use append or html like this:
$("#logtext").append("to do");
Related
I have a tinymce textarea (TinyMCE 3.5.11) that contains an element like
<span id="lastreplytimeee">...</span>
I need to access and change the content of this element using the span id as selector.
I have tried things like
tinyMCE.DOM.setHTML('lastreplytime', $input.val());
None worked.
Any suggestions?
this line is within .ready:
$().ready(function() {
jQuery('.flexy_datepicker_input').datetimepicker({
lang:'tr',
format:'Y-m-d H:i:s',
dayOfWeekStart:1,
onChangeDateTime:function(dp,$input){
document.getElementById("lastreplytimeee").innerHTML = $input.val();
}
});
});
1.Maybe try it,this code gets TinyMCE content and then replace some elements (TinyMCE 5)
tinymce.get('TinyMceID').setContent(
tinymce.get('TinyMceID').getContent().replace(
$(tinymce.get('TinyMceID').dom.doc.getElementById('lastreplytimeee')).get(0).outerHTML,
`<span id="lastreplytimeee">` + newValue + `</span>`)
)
2.or use this
tinymce.get('TinyMceID').dom.setHTML("lastreplytimeee", "newValue");
document.getElementById("id") gets the reference to that particular tag.
.innerHTML is to say assign value or display values in the HTML at that particular div you are referring to above.
Try to use-
document.getElementById("lastreplytimeee").innerHTML = $input.val();
If you are using jQuery, try this-
$("#lastreplytimeee").html = $input.val();
Hope it helps :) Happy Coding!
Found the solution, tinymce requires its dom utility to access and play with an element inside it, like:
tinyMCE.activeEditor.dom.setHTML(tinyMCE.activeEditor.dom.select('selector'), 'some inner html');
I am pretty new in JQuery and I have the following problem.
I have create this JQuery function that when the user select a file into an input tag having id=rendicontoAllegato it put the name of this file into an hidden div having id=nomeDocumentoRendicontazione into my page
$(document).ready(function() {
$("#rendicontoAllegato").change(function() {
alert("DOCUMENTO dopo selezione: " + $("#nomeDocumentoRendicontazione").text());
var selectedFileName = $("#rendicontoAllegato").val();
$('#nomeDocumentoRendicontazione').append(selectedFileName);
});
});
It works fine but the only problem is that if I first select something asfile1.txt and then select another file as file2.txt into the div having id=nomeDocumentoRendicontazione I will have the concatenation of the 2 files name.
So I will have something like file1.txtfile2.txt and it is not good for me.
How can I replace the value of the div having id=nomeDocumentoRendicontazione instead to append a new value inside it?
You can use the .text() fn if you are dealing with with your data to be inserted as text or .html() fn if you are dealing with html to be replaced
$('#nomeDocumentoRendicontazione').text(selectedFileName);
Or
$('#nomeDocumentoRendicontazione').html(selectedFileName);
Use html() instead of append().
$(document).ready(function() {
$("#rendicontoAllegato").change(function() {
alert("DOCUMENTO dopo selezione: " + $("#nomeDocumentoRendicontazione").text());
var selectedFileName = $("#rendicontoAllegato").val();
$('#nomeDocumentoRendicontazione').html(selectedFileName);
});
});
You have to use
$('#nomeDocumentoRendicontazione').html(selectedFileName);
it will replace the already present HTML of that. OR you can use
$('#nomeDocumentoRendicontazione').text(selectedFileName);
it will do the same but append your data as text.
I have been looking on the internet, but I failed to find the correct solution.
What I have here erases the text content with the html, and I need both there.
On the markup I need something like this:
<h1 class="stock-count">54<span class="stock-count-info">In Stock</span></h1>
But I keep getting something this (without 54):
<h1 class="stock-count"><span class="stock-count-info">In Stock</span></h1>
This is the jQuery code I have tried:
$(".stock-count").text(count);
$(".stock-count").html("<span class='stock-count-info'></span>");
$(".stock-count-info").text("In Stock");
Has anyone got any suggestions?
PS. The span tag HAS to be within the h1 tag.
Try this : You can add count and stock-count-info span directly to html of stock-count span in a single call.
$(".stock-count").html(count+"<span class='stock-count-info'>In Stock</span>");
You can use .append():
$(".stock-count").append("<span class='stock-count-info'>In Stock</span>");
use prepend to insert the element before
$(".stock-count").html("<span class='stock-count-info'></span>").prepend(count);
I'm trying to get nodes containing text from html file using Javascript and jQuery.
if I have a node like
`
<div>txt0
<span>txt1</span>
txt2
</div>
How can I select elements that meets this criteria??
Meaning, I need to retrieve thedivand thespan` , and it would be even better to know location of the text.
I'm trying to get the text to replace it with images in a later function.
I tried this
`
$('*').each(function(indx, elm){
var txt = $(elm).text();
// my code to replace text with images here
});
`
but it does not get the required results.. it does all the parsing in the first element, and changes the html totally.
I don't know exactly what you're trying to solve, but perhaps you can be a bit more specific with your selector?
$("div span").text(); // returns 'txt1'
$("div").text(); // returns 'txt0txt1txt2'
By adding ids and/or classes to your html, you can be very specific:
<div class="name">Aidan <span class="middlename">Geoffrey</span> Fraser</div>
...
// returns all spans with class
// "middlename" inside divs with class "name"
$("div.name span.middlename").text();
// returns the first span with class
// "middlename" inside the fourth div
// with class "name"
$("div.name[3] span.middlename[0]").text();
JQuery has pretty good documentation of these selectors.
If this doesn't help, consider explaining the problem you're trying to solve.
Your markup structure is a bit uneasy. Consider changing to something like this
<div>
<span>txt0</span>
<span>txt1</span>
<span>txt2</span>
</div>
Then using jQuery
$("div span").each(function(k,v) {
$(this).html("<img src=\""+v+".jpg\" />"); //replace with the image
});
My HTML and JavaScript code look like this:
<html>
<!--...
many code
...-->
<button onclick="alert($('#mytable').html().wrap('<html/>') );">Show HTML Table</button>
<table id="myTable">
<tr's and td's>
</table>
<!--...
many code
...-->
</html>
I want my javascript to return the table wrapped by the HTML tags but I do not want the table itself to be changed.
You could take a copy of the table first:
$('#mytable').clone()...
To get the actual HTML of the tag you'd need something like this plugin which I posted in another answer yesterday:
(function($) {
$.fn.outerhtml = function() {
return $('<div/>').append(this.clone()).html();
};
})(jQuery);
So you can then do:
alert('<html>' + $('#myTable').outerhtml() + '</html>');
See http://jsfiddle.net/alnitak/2y988/ for a working demo.
This does not work. .html() returns a string, not a jQuery object. So you cannot call wrap on it.
The other problem is that .html() only returns the inner HTML, it does not include the table tag.
You could .clone() the node, attach it to some dummy element and return the .html():
var html = ['<html><body>',
$('<div/>').append($('#mytable').clone()).html(),
'</body></html>'].join('');
Maybe this jQuery outerHTML plugin will help you. It will give you the code for the table, including the enclosing <table> tags. You can maybe do something like alert("<html>" + $("#myTable").outerHtml() + "</html>").
Why not just do the following?:
alert('<html>'+$('#mytable').html()+'</html>');
$("#myTable").wrap("...");
That will wrap the table in the tag supplied to the wrap function, without altering the table itself.
For more information, see the jQuery API for the wrap function.