Remove HTML before insertBefore jQuery - javascript

I have a field that inserts HTML when a user submits my form. If there is an error it inserts the error message before the form field. However, if the user submits multiple times it inserts multiple error messages, I would like to simply replace the error message so that it only appears once. I've tried to use replace but I couldn't get this way to work.
The form works via ajax so we don't reload the page to remove the errors, I need a way of replacing / removing them using jQuery.
Here is my jQuery code.
$('<p class="form-error" id="' + errorKey + 'ErrorMessage">' + json.errors[errorKey] + '</p>')
.insertBefore(('[name="' + errorKey + '"]'))

Select by id and remove:
$('#' + errorKey + 'ErrorMessage').remove();

Related

Add "Reply" to Twitter Reply Box Using jQuery

I am trying to add predefined text to the Twitter "reply" box:
but for some reason no matter what I try it won't work. Here is my code:
const element = document.querySelector("div.public-DraftEditorPlaceholder-root");
element.remove();
span.innerHTML = '<span data-text="true">' + s + '</span>';
it adds in the reply e.g.
But it does it in a way where the reply stays "disabled" until I key in text, but then it deletes the message my script added.
This is for a google chrome extension

Selenium Python Shadow DOM input text

The website I am interacting with uses shadow DOMs. I can successfully interact with them for clicking buttons and in some cases can input text but I am currently stumped on this one.
The HTML looks like this
firefox html inspector view of one shadow dom input text box
I can input in the text fields with the following but the continue button doesn't enable for me to go to the next screen and if I manually click and place a space in the first box I get an error saying that to continue to the next page I need to fill in the second and third boxes (which have text but for some reason the webpage doesn't recognize that text is present). table with shadow dom inputs
shadowDOM1 = driver_local.execute_script("return document.querySelector('WN-input').shadowRoot.querySelector('input')")
str_valToSet = "arguments[0].value = '" + partNum + "';"
driver_local.execute_script(str_valToSet, shadowDOM1)
shadowDOM2 = driver_local.execute_script("return document.querySelectorAll('WN-input')[2].shadowRoot.querySelector('input')")
str_valToSet = "arguments[0].value = '" + str(num2buy) + "';"
driver_local.execute_script(str_valToSet, shadowDOM2)
shadowDOM3 = driver_local.execute_script("return document.querySelectorAll('WN-input')[1].shadowRoot.querySelector('input')")
str_valToSet = "arguments[0].value = '" + "CUSTX" + "';"
driver_local.execute_script(str_valToSet, shadowDOM3)
I was also able to click the text box input that is in the shadow root but when i go to send keys i get an error that "element is not reachable by keyboard". There is not a temporary overlay preventing me from typing, as far as i can tell there is not a permanent overlay, and I see no evidence of any attributes that would make it invisible to selenium (org.openqa.selenium.ElementNotInteractableException: Element is not reachable by keyboard: while sending text to FirstName field in Facebook)
fields = driver.find_elements(By.XPATH, '//tbody/tr/td/WN-input')
print("fields", fields)
print("field", fields[0])
shadowEl = expand_shadow_element(driver_local, fields[0])
print("shadowEl", shadowEl)
isVisible = WebDriverWait(shadowEl[1], maxDelay).until(EC.visibility_of_element_located((By.XPATH, "//input")))
print("isVisible", isVisible)
shadowEl[1].click()
time.sleep(2)
shadowEl[1].send_keys("blahblah")
In a different location within my code I successfully interact with a similar object this this (WN-input tag name) and was able to get it to open up the "next" button by typing some garbage text in a different input field that wasn't within a shadow DOM. When I try that technique for this case it blows away my text within my shadow DOM text input fields. I am not sure why this case seems to work and the case in question doesn't.
shadowDOM1 = driver_local.execute_script("return document.querySelector('WN-add-to-cart').shadowRoot.querySelector('WN-input')")
str_valToSet = "arguments[0].value = '" + str(num2buy) + "';"
driver_local.execute_script(str_valToSet, shadowDOM1)
try:
inputBox = WebDriverWait(driver_local, maxDelay).until(EC.element_to_be_clickable((By.XPATH, "//input[#placeholder='Search']")))
#inputBox = local_driver.find_element_by_xpath("//input[#placeholder='Search']")
inputBox.click()
inputBox.send_keys("text")
time.sleep(3)
After days of failed attempts and google search after google search I am finally ready to ask for help. Any thoughts?

Cefsharp to enter data to form

I need Cefsharp to do a small bit of automation. What I want to do is enter data into two textfield and then press a button. To do this I'm using javascript.
browser.ExecuteScriptAsync("var elems = document.getElementsByClassName('_fcn8k');");
browser.ExecuteScriptAsync("elems[0].click();");
Thread.Sleep(5000);
browser.ExecuteScriptAsync("var elems2 = document.getElementsByClassName('_kp5f7');");
browser.ExecuteScriptAsync("var elems3 = document.getElementsByClassName('_taytv');");
browser.ExecuteScriptAsync("elems2[0].value='" + userName + "';");
browser.ExecuteScriptAsync("elems2[1].value='" + userPassword + "';");
browser.ExecuteScriptAsync("elems[3].click();");
The code works, except for the fact that when I click the button the textfields are emptied and I get an error saying the data is wrong (since the fields are empty).
If I do it manually the data remains when the button is pressed. I really don't get why it disappears when I try to do this programmaticly.
Any ideas?

JavaScript, HTML, JSP onClick statement

Is there a way to use the value from a text field as the parameter value in an onclick statement for a button. For example if you have some text field named "name" and you have another button named "button" when clicked will go to the same page "page.jsp" with a parameter "par" equal to the text field value. This is what I am currently doing:
out.print("<input type = 'button' name = 'noName' value = 'Click Me' onclick =" + '"' + "window.location.href = 'http://page.jsp?par=" + document.form.name.value + "'" + '"');
But for some reason it doesn't like the par=" + document.form.name.value
Any suggestions?
Like this?
<script>
function doSomething(txt){
alert(txt); //alert the text maybe?
//do more things...
}
</script>
<input onClick="doSomething(this.value)">
this.value means the value in the textfield.
String s = "<input type='button' name='noName' value='Click Me' onclick="
+ "\"window.location.href='http://page.jsp?par="
+ document.form.name.value + "'\"";
Well, that's pretty confusing.
document etc. has zero meaning on the server side. Why aren't you doing this in JavaScript, where it would be a lot easier? Why isn't this in the JSP, where it would be trivial?
If you want to access a form value from a servlet, (a) that form value must have been submitted, and (b) you access it via request.getParameter("parameterName"). But I find it impossible to believe that's the easiest way to do it.

How to get Form Values from Javascript-added Checkboxes in ASP.NET?

I am adding checkboxes to a by setting the innerHtml property as below.
function ShowCheckbox(uid) {
document.getElementById("samplediv").innerHTML += "<input type='checkbox' value='on' name='box_" + uid + "' id='box_" + uid + "'/> Some Text Here";
}
This is on a .aspx page
I am trying to retrieve the values of the dynamic checkboxes from the codebehind in c# but am not finding them being posted back. I've read on the IE issue (pre-IE8) about it not handling the name attribute well however I'm in IE9 and apparently it's not a problem if you use the innerHtml approach rather than directly adding to the DOM.
I tried requesting values in codebehind via Request.Form and Request.Params with no luck either way.
Any idea why the dynamic checkboxes aren't getting posted back?
You may consider using jQuery. Appending element into DOM is quite easy and it works.
function ShowCheckbox(uid) {
$("<input type='checkbox' value='on' name='box_" + uid + "' id='box_" + uid + "'/>")
.appendTo($("#sample");
}
Once you do a form submit, all the data will be sent to the server. Then ASP.NET engine will try to create server-side "representation" of your HTML controls. It will try to match it's Controls collection with the data from the client, by using id's or names. So you need to create server-side inputs before page start map data and controls. In other words you need to make the page to find the same controls in Controls collection of the page on the server. So, I believe you need to do the control's creation on Page_Init or something...
Here is a good explanation of dynamic controls in ASP.NET: http://geekswithblogs.net/shahed/archive/2008/06/26/123391.aspx

Categories