Working with TinyIMCE, I am looking to incorporate a border around all images within the textarea whenever a user submits the form.
$("form").submit(function() {
var content = $("#edit-message1-value").val();
// Afterwards, I want to manipulate the content of the textarea (which is in HTML format)
content.find("img")...
// or
$(content).find("img")...
...
})
Any suggestions?
$('textarea img').css('border', '2px dashed #00FF00');
This code will apply a green dashed border to all images within a textarea element (feel free to modify the target element).
Here is the solution: wrap the textarea value with <div> tags.
var newHtml = $('<div>' + $("#edit-message1-value").val() + '</div>');
// Adjust image styles
$.each(newHtml.find("img"), function() {
if ($(this).css("border") != "3px solid rgb(99, 99, 99)") {
if ($(this).attr("style")) {
$(this).attr("style", $(this).attr("style") + " border:3px solid rgb(99, 99, 99);");
} else {
$(this).attr("style", "border:3px solid rgb(99, 99, 99);");
}
}
});
// Update textarea content
$("#edit-message1-value").val(newHtml.html());
Check out this HTML code snippet: <div style="border: 1px solid #000; width: 700px; line-height: 38px; display: block"> <div style="margin-left:10px;width: 222px; float: left; margin-right: 10px;"> Enter your question </div& ...
Currently working on implementing a submit function from within a jQuery dialog (inspired by this query). Utilizing codeigniter and jquery for this task. I am aiming to connect the ajax POST action to the click event of a button within the jQuery dialog, ...
The for loop I have is functioning properly: <div id="page1div"></div> <script> list = " "; for (var i = 0 ; i < length ; i++) { list = "<h1 class='entriesdisplayed'>" + item(i) + ...
Welcome to my side menu <template> <div class="p-3 text-bg-dark shadow"> <div class="dropdown"> <a href="#" class=" align-items-center text-white text-d ...
{% for plant in plants %} {% if forloop.counter0|divisibleby:3 %} <div class="row row-cols-3"> {% endif %} {% include 'included/_plant_cell.html' %} {% if forloop.counter|divisibleby:3 %} </div&g ...
I have encountered some difficulty in stopping a crossfade animation on the last nth-child element. Although I am aware of using animation-fill-mode: forwards, implementing it in different places such as in the initial .crossfade declaration did not yield ...
I'm trying to figure out how to pass parameters (values and functions) to an Angular directive. It seems like there should be a way to do this in Angular, but I haven't been able to locate the necessary information. Perhaps I'm not using th ...
Whenever I click the Start button, my function is supposed to run a cycle for 10 iterations. Each iteration generates a number between 1 and 7, which then triggers a series of functions on different objects. The problem is that these functions are not runn ...
Below is an example of code that demonstrates what I'm trying to accomplish: <nav className="flex flex-row justify-between items-center w-full h-[100px]"> <div className="flex flex-row items-center sm:pl-0 ml-auto"> ...
Within my div, I have included an Extjs panel using the renderTo configuration option. Can someone please advise on how to adjust the panel size dynamically when the div is resized? Appreciate any help! Thank you. ...
I have a website with a scrollable div. It works well, but I also need an absolutely positioned div on top of it - and it still needs to scroll smoothly without any hindrance. You can check out a basic JSFiddle demonstration here: http://jsfiddle.net/41ra ...
I am looking for a way to handle a form's submit action using JavaScript. My goal is to hide the form when it is submitted and then be able to reuse it later. However, the code I currently have seems to have a hidden state that prevents the submit act ...
After setting up Lightbox gallery on my website, I noticed that the closing icon is not showing up correctly. Everything else works fine and nothing was changed in the code or Lightbox CSS. The z-index seems to be in order as well. I'm unsure what cou ...
In my current project, I have a table that displays details fetched from the database. if(mysql_num_rows($sql) > 0) { $row_count_n = 1; while($rows = mysql_fetch_assoc($sql)) { extract($rows); $options1 = select_data_as_options( ...
When the browser is resized, the mobile menu appears at 568x320, which is the default breakpoint. I would like to create a breakpoint around 900px to address the issue with the menu being too large as shown in the image below. However, I am unsure of how ...
Struggling with converting an input value into a string. HTML: <input type="text" placeholder="Email Ex: john123" id="emailinput"> <input type="text" placeholder="Domain Ex: @gmail.com" id="domaininput"> JS: let emailVal = document.getElem ...
I have set up a bootstrap carousel to showcase numerous images, with the carousel indicators serving as image icons. I am looking to add horizontal lines above and below these icons. How can I achieve this? Currently, the icons functioning as carousel ind ...
It's frustrating to constantly have to ask questions. I've been struggling to implement code on my website, but every time I try to add something new, it just doesn't work. I even tried changing the CSS names, thinking that might solve the i ...
Currently, I am implementing the border-image property using a PNG image that contains a transparent section. The issue arises when the background-color of the div is set to black. Upon applying the border-radius, the transparent section of the pattern dis ...
Having trouble getting the image to move in the canvas. Have tried multiple methods with no success. Please assist! var canvas = document.getElementById("mainCanvas"); canvas.width = document.body.clientWidth; canvas.height = document.body.clientHeight; ...