i have this interface :
When the "Add Another One" button is clicked, i will have to add another interface that looks the same as this one, so that the whole interface would look something like this :
I had the attribute onfocus for the textarea in order to clear it content when in focus, and it is working prefectly, this is the code for it :
<textarea name="educationDescription1" id="educationDescription1" rows="5" cols="33" onfocus="clearContents(this);">Describe your studying experience in a couple of sentences.</textarea>
Now I'm having problems doing the same for the created textarea, although i have used the same syntax! This is the code used for creating the new text area :
var node6 = document.createElement("textarea");
node6.rows="5";
node6.cols="33";
node6.onfocus="clearContents(this);";
node6.value="Describe your working experience in a couple of sentences.";
node6.name="experienceDescription"+experiences;
node6.id="experienceDescription"+experiences;
Any idea what could be the problem?
Thanks
In node6.onfocus , onfocus needs a function reference. You are assigning a string. It should be something like,
node6.onfocus=function(){clearContents(this);};
Or you can use addeventListner function
node6.addEventListener('onfocus',function(){clearContents(this);});
Or if you want to add onfocus into the html you have to create a new attribute and set it like this.
var attr = document.createAttribute('onfocus');
attr.value="clearContents(this)";
node6.setAttributeNode(attr);
This:
node6.onfocus="clearContents(this);";
Should be replaced by this:
node6.onfocus=function(){clearContents(this);};
I guess you might want to use placeholder attribute instead of onfocus.
If you use onfocus, the textarea would be cleared everytime the user make a focus on it even after the user input valid data.
The code to set placeholder with jQuery could be something like this:
var node6 = $("<textarea></textarea>");
...
node6.attr('placeholder','Describe your working ...');
Here is the fiddle.
http://jsfiddle.net/naokiota/j687tg80/2/
Hope this helps.
Related
I'm trying to use 2Captcha service to solve an h captcha V2.
Works like this:
you get a value to solve the captcha
Then you find a textarea element in the HTML code to insert that value (here's my problem)
you insert the value in that element
You press submit button and the captcha is solved
First I'm going to present a working example, then I'll present where I have the problem.
This is the HTML code to find and insert the obtained value:
textarea id="h-captcha-response" name="h-captcha-response" style="display: none;"></textarea>
This is the python code used to insert the value:
value = get_value()
insert_solution = 'document.getElementById("h-captcha-response").innerHTML="' + value + '";'
driver.execute_script(insert_solution)
What this exactly does is taking you from this:
and this is the result:
Finally you press the submit button and it's done. This example works
This is my problem:
In my case the HTML document has a variable ID, like this one:
<textarea id="h-captcha-response-0tesbrpxsk8" name="h-captcha-response" style="display: none;"></textarea>
Notice that the id has an alphanumerical part (0tesbrpxsk8) that always changes making it more difficult to select.
I tried to find some regular expression to use inside of document.getElementById()
With no success
I also tried to use:
document.getElementByTagName("textarea").innerHTML=".....
I'm stucked here and tried other approaches with no success because I probably because I don't implement well those solutions or they just don't work.
I'll appreciate some insights, thanks
This will fill out all of those (recaptcha / hcaptcha):
driver.execute_script('''
let [captcha] = arguments
[...document.querySelectorAll('[name="h-captcha-response"],[name="g-recaptcha-response"]')].map(el => {
el.innerHTML = captcha
})
''', value)
Try this:
const textarea = document.querySelector('[id^="h-captcha-response-"]')
textarea.value = "This is inside the textarea!"
<textarea id="h-captcha-response-0tesbrpxsk8" name="h-captcha-response"></textarea>
First of all: You set the value of an textarea with textarea.value = "some value"
You should use document.querySelector() to select elements. (You have much more abilities there)
You can select id starting with, with this query: [id^="start"]
I would like to add some html to my page using Medium Editor addElements() function. I don't really know how to use it. For now it just adds an editable blank line...
My code:
var editor = new MediumEditor('.changeable');
elements = "<section id='"+new_id+"' class='changeable'><h1 class='title_section'>"+newTitle+"</h1><p>This is a new paragraph.</p></section>";
editor.addElements(".container_content",elements);
My selector is the element with a "container_content" class. I would like to add the html of the var "elements" in it.
Thanks.
Ok, I found the problem.
You have to create your element you want to add first. Then you call .addElements(yourElement)
I want to make Textarea Disable (Grayed out) in my JS Method
function myfun(status){
if(status=='Yes'){
$('input[id$="txtareaID"]').attr('disabled','disabled');
}
The above code is not working for this.
You should use prop instead of attr:
$('input[id$="txtareaID"]').prop('disabled', true);
jQuery docs
If your selector is correct, than you need only to change attr to prop:
function myfun(status){
if(status === 'Yes'){ // more suitable for comparing
$('input[id$="txtareaID"]').prop('disabled',true);
}
}
Related post:
Disable/enable an input with jQuery?
Considering textarea as
<textarea id='txt'>Something</textarea>
Using jQuery, you can achieve like this
$("#txt").attr('disabled', true);
Using plain javascript
document.getElementById("txt").disabled=true;
Your problem is with CSS not JS. As far I can tell your code is working, but there's no way of changing this specific style. You could try workarounds: Change Font Color For Disabled Input
<textarea> is what you should be looking for not the <input> tag with id = textareaid.
$('input[id$="txtareaID"]').attr('disabled','disabled');
change the above code to the below one and see the magic by clicking the link at the bottom.
$('textarea[id$="txtareaID"]').attr('disabled','disabled');
http://jsfiddle.net/5s9ge7d6/1/
none of the below answers worked.
Then I found something amazing trick which solved my problem ---
Here it is --- JUST REMOVE "input" word from that line in if block -
WORKED CODE :
function myfun(status){
if(status=='Yes'){
$('[id$="txtareaID"]').attr('disabled','disabled');
}
Previous CODE :
function myfun(status){
if(status=='Yes'){
$('input[id$="txtareaID"]').attr('disabled','disabled');
$('input[id$="txtareaID"]').prop('disabled',true); //Didn't worked either
}
I would like to change the value of a textarea when hovering over a link. I am not very proficient at javascript and do not quite understand the intricacies of 'this.' and 'document.' etc..
Currently I have a textarea 'info' that on page load is unpopulated and two links that should change its value. I can not seem to get it to work..
<textarea name="info"></textarea>
Foo.com
Bar.com
I'm sure there is a way to accomplish what I need to do but I can't find it.
Thanks in advance.
Create a function, that accepts the string you want, and sets the textarea:
// Select the textarea by its ID (that you need to give it)
var textarea = document.getElementById('info');
// Define the function that sets the value passed
function changeTextarea( str ) {
textarea.value = str;
}
Assign an ID to the textarea, and call the function in the onmouseover, passing the string you want to set:
<textarea name="info" id='info'></textarea>
Foo.com
Bar.com
Example: http://jsfiddle.net/nmZb9/
I'm working on a Firefox-plugin which searches a webpage for all textareas and places a warning before the submit button.
my code looks like this
var submitWarning = content.document.createElement("div");
submitWarning.innerHTML = "Fancy Message";
$('textarea', window.content.document).each(function() {
var form = $(this, window.content.document).parents('form:first');
$(form, window.content.document).children('input[type=submit]').each(function() {
form.insertBefore(submitWarning, this);
});
});
if i search all submits with $('input[type=submit]'.each it works fine but since i added the thing with the textarea and the form:first i got problems (nothing happens)
p.s. i use the window.content.document thingy because its a ff-plugin and it won't work nothing without it
You need to change it a bit, like this:
var submitWarning = content.document.createElement("div");
submitWarning.innerHTML = "Fancy Message";
$('textarea', window.content.document)
.closest('form')
.find('input[type=submit]')
.before(submitWarning);
The argument syntax is $(selector, context), when finding the form, first there's .closest() which makes this easier, also when you have an element, you can just use $(this) inside it's .each(), no need to search for it again. Also, you can use .before() to make it easier :)
The :has() selector is the best choice for me. Get rid of your extensive code and use this instead.
var buttons = $("form:has(textarea) input[type=submit]", window.content.document);
$("<div>").html("Fancy Message").insertBefore(buttons);
Try var form = $(this, window.content.document).closest('form');. Not sure if that's the ticket, but it's the first thing off my head.