I am working on nightwatch.js, i want to update existing data so i need to remove old date and need to set new data, i tried two way to get my result.
1) set empty text using following nightwatch function.
browser.setValue('.MyClass', 'text',' ');
2) here i tried to use backspace but unfortunately nightwatch.js api documentation is not so good, so i tried following with the help of this link but not worked.
client.keys([client.Keys.COMMAND, "Backspace", client.Keys.NULL]);
above code not pressed mouse backspace but append 'Backspace'.
If you have any best idea, please let me know.
You can use .clearValue('selector') now :
http://nightwatchjs.org/api/clearValue.html
Check the nightwatch api for setValue
http://nightwatchjs.org/api#setValue
browser.setValue('input[type=text]', 'nightwatch');
Check the class you are entering, i guess somehow nightwatch is not able to find your element.
What follows is not optimal, I am sure. Either of the following lines of code will work for removing the last character of the string currently in the input field. It's just setting a backspace; sometimes that's what's works.
.useXpath().setValue(selector, "\u0008")
.useCss().setValue(selector, "\u0008")
If you get the string in the input field, then get the length of the string you can sent this command that many times to remove the text in the input field. I'm not including it here as a suggestion, more as a workaround.
Related
I have a pre element that has a bunch of read-only text in it and I now have spell-checking working on the pre. However, if I right-click on the text that has the spelling error, I am able to change the value in the pre element. Is there any way to prevent the auto-suggestion from populating for this element?
Edit: I want to keep the spell-checking. I don't want the user to be able to right-click to auto-correct the mis-spelled word. I do want them to be able to add the mis-spelled word to their dictionary though.
You can use spellcheck=false with textarea and input.
Here is a fiddle with and without spellcheck property it: https://stackblitz.com/edit/react-kmyptb
EDIT:
More info at : https://www.tutorialrepublic.com/faq/how-to-disable-spell-checking-in-html-forms.php
I am using some JQuery Combobox that you can check out here: https://simpletutorials.com/uploads/1860/demo/index.html
As you can see, you can start typing and get the results filtered.
However, once you have selected a value, when clicking on the arrow to open the list, no other values are shown anymore. So, if I want to change college/state, I need to manually clear the input value. I don't like this, so I want to modify it.
I changed that code and added this JS on the click event of the list:
onclick="document.getElementById('statesCombo-ddi').value='';"
This line basically finds the input by id and sets its value to an empty string.
You can try out by looking for the td element having class "stc-button" (with Chrome, just focus on the arrow of the second combo box) and add my code to the tag.
===EDIT===
You can obtain the same results by adding this code directly to the input:
onclick="this.value=''"
===END EDIT===
This has a weird behavior:
If I SELECT an element from the list, it clears the value and everything works correctly.
If I TYPE some letters and then select a value from the list, no item is shown in the list after clicking.
What's wrong with it?
You can override one of the combo box methods to accomplish this:
STComboBox.prototype.filterAndResetSelected = function() {
this.$('ddi').val('');
this.filterList('');
this.selectRow(0);
this.$('ddl').scrollTop(0);
};
Does this help?
The unminified code is provided, is relatively small (12kb) and is fairly well commented, so you could make this modification directly to the source if you'd like.
Edit: Fixed to clear the input value (as indicated in the comment below)
By reading the source and doing a little debugging with Chrome's inspector (Control+Shift+i), you can find the particular ID of the element you need to clear (#collegesCombo-ddi) in order to clear the input box. Once you've found the element's ID you need to clear (and being very careful with plugins that assign multiple elements with the same ID, which is not allowed in the standard, and an indicator of poorly-written code):
$('#collegesCombo-ddi').val('');
I am new to Titanium. I am developing an ipap app using titanium. My app needs a textbox that allow only 1234AA or 1234 AA format.(AA/aa). i want to display a message under textbox "Invalid format: 1234 AA" while entering text in texbox.it should disappear after correct format is entered. I searched on google but i didn't find anything.
how to write the code for this?
Thanks!
I tried in another way that: I added a eventlistener 'click' to a button with code
submit.addeventlistener('click',function(){
pattern="[0-9]{4}\s?[A-Za-z]{2}";
var textfieldvalue=textfield.value;
if(!textfieldvalue.match(pattern))
{
var errorlabel=Ti.UI.createlabel({color:'black',text:'Invalid format:
1234AB'...});
win.add(error);
}
else{
//opening other window
}
});
its working but text box allowing more than 4 digits and more than 2 char (I given exact number in pattern)..what's wrong in my pattern?
Still I want this code for textfield (showing error message while typing in textfield until correct format is entered ) what event i have to use for textfield?
You can set "pattern" (regex) to the input field. In this case it'd be something like pattern="[0-9Aa]{4}\s?[0-9Aa]{2}".
Then you must set oninvalid event listener to the input field. This will fire when pattern match is not met. e.g oninvalid="showInvalidFormatMsg()" or preferrably fieldElem.addEventListener("invalid", showInvalidFormatMsg);
After this you can either use built-in tooltip with setCustomValidity function or just display as a text in DOM in that showInvalidFormatMsg
I'm unable to write working code atm. But if you're unable to follow these instructions and no-one has answered with full code, I try to find some free spot to help you with this.
I have the following helper method to input a string into an input field and press the enter key, but it seems the enter key is never pressed. I see the string entered into the input field, but the events that take place upon hitting enter never happened.
I've tested in an actual browser that the enter key correctly fires the expected events. I'm not sure what I'm missing.
def fill_and_trigger_enter_keypress(selector, value)
page.execute_script %Q(
var input = $('#{selector}');
input.val('#{value}');
input.trigger("keypress", [13]);
)
end
EDIT:
I've also tried the following to no avail:
find('#q_name').native.send_keys(:return)
find('#q_name').native.send_keys(:enter)
They don't cause any error, but still no enter key pressed.
find('#q_name').native.send_keys(:return)
works for me. I dont have a name or id for my field but the type is input so i used something like
find('.myselector_name>input').native.send_keys(:return)
works perfectly fine!
These days (Capybara version 2.5+) you can simulate the <enter> key in the following way:
find('.selector').set("text\n")
The \n (new line) is the very important bit here.
Usually when you run page.execute_script, you get the same results as if you were running that in the page console. Try running that manually in the console and see if you get the expected results. That is usually what I do.. craft the needed js code in the browser console window and paste it into the capybara code when it is working, using execute_script.
Capybara doesn't have native support for a send_keys type event. You might be able to go down to selenium to do it, or you can try this gem https://github.com/markgandolfo/send-keys
It works for me
page.execute_script("$('form.css-class/#form_id').submit()")
#Page.selector.send_keys :return
This works for me, where selector is the element in your page object
element :selector, '<css selector>'
I'm trying to update a span tag on the fly with data from an input text field. Basically I have a text field and I'd like to be able to grab the user's input as they type it and show it to them in a span tag below the field.
Code:
<input id="profileurl" type="text">
<p class="url">http://www.randomsite.com/<span id="url-displayname">username</span></p>
JQuery:
var username;
$('#profileurl').keyup(function(username);
$("#url-displayname").html(username);
See it in JS Fiddle: http://jsfiddle.net/pQ3j9/
I'm guessing the keyup function is not the best way to do this. Since checking the key wouldn't be able to grab prefilled or pasted form input.
Ideally there is some magical jQuery function that can just output whatever info is in the box whenever it detects a key up but if that method exists I haven't found it yet.
EDIT: You guys are fricken amazing. It looks like .val() is that magic method.
Second question: How would you restrict input? Looking at the modified jsfiddle's, when a user inputs an html tag like < hr > the browser interprets it and breaks the form. Do you specify an array and then check against that? Does jquery have anything like PHP's strip_tags function?
$('#profileurl').keyup(function(e) {
$("#url-displayname").html($(this).val());
}).keypress(function(e) {
return /[a-z0-9.-]/i.test(String.fromCharCode(e.which));
});
check out the modified jsfiddle:
http://jsfiddle.net/roberkules/pQ3j9/5/
Update: As #GregL points out, keyup indeed is better, (otherwise e.g. backspaces are not handled at all).
Similar to roberkules' answer, but using keyup() like you proposed seems to work better for me in a Chrome-based browser:
$('#profileurl').keyup(function(e) {
$("#url-displayname").html($(this).val());
});
Updated jsFiddle: http://jsfiddle.net/pQ3j9/3/
For the second question, if you wish to maintain characters and not have them parsed as html entities then you should do this instead :
$('#profileurl').keyup(function(key) {
$("#url-displayname").text($(this).val());
});
Check it out at - http://jsfiddle.net/dhruvasagar/pQ3j9/6/
You can bind multiple events with bind
http://jsfiddle.net/dwick/DszV9/