I use with the event "okCancelEvents" for validating my form in meteor.
But now, I want to use a textarea. The event "ok" don't work :(
Have you an idea of event with meteor for validate textarea ? :)
Thanks
I assume you're referring to the okCancelEvents function written in the Meteor Todos example, per this SO question. This function is designed to handle the events for an <input>, which is why its trigger for "ok/submit" is the user pressing enter (or blurring the <input>). See lines 59-61:
} else if (evt.type === "keyup" && evt.which === 13 ||
evt.type === "focusout") {
// blur/return/enter = ok/submit if non-empty
This won't work for a <textarea> because as a multiline input a <textarea> accepts enter presses because that's how a user types a new line. Submitting the form based on an enter press would be surprising to your users, to put it mildly. The focusout trigger should still work fine, however.
Related
I have an Ionic React app that uses react-router 5 to display various pages.
The app defaults to a login form, but if users go to the support page, there is a contact form.
I'm trying to test the contact form in Playwright with code like this:
await page.fill('input[name=mail]', 'playwright#example.com');
However, I'm getting an error:
=========================== logs ===========================
waiting for selector "input[name=mail]"
selector resolved to 2 elements. Proceeding with the first one.
selector resolved to hidden <input name="mail" type="email" placeholder="" autocorr…/>
elementHandle.fill("playwright#example.com")
waiting for element to be visible, enabled and editable
element is not visible - waiting...
The problem is that Playwright is seeing the first email address input on the login form, which is not visible, and then trying to fill that in instead of the visible email address input on the contact page.
Obviously, I never want to fill in an element that isn't visible, so how can I force playwright to only try to fill in visible elements?
You can use page.locator to check for visibility first and then fill in the value.
await page.locator('input[name=mail] >> visible=true').fill('playwright#example.com');
To make tests easier to write, wrap this in a helper function:
async fillFormElement(
inputType: 'input' | 'textarea',
name: string,
value: string,
) {
await this.page
.locator(`${inputType}[name=${name}] >> visible=true`)
.fill(value);
}
It can be done in this way, if you are trying to check is element visible. Even you have two same elements with one selector one hidden one visible.
const element = await page.waitForSelector(selector, {state:visible});
await element.fill(yourString);
Is there any specific way to add shortcut Listener for the Enter Key on a specific TextField element in Vaadin Flow. The documentation is silent about this.
I guess you are not actually looking for a ”shortcut” key but to react to enter presses when the focus is inside the field? If so, see KeyNotifier and e.g. addKeyPressListener.
It is also possible to listen to any DOM event using the element API, e.g.
textField.getElement().addEventListener("keyup", e -> {
System.out.println("Value is now: " +
e.getEventData().getString("element.value"));
}).addEventData("element.value").setFilter("event.keyCode == 13");
In the Vaadin Directory there is a UI Web Component for Vaadin 10. It's called shortcut. The usage is very simple:
Shortcut.add(messageField, Key.ENTER, sendButton::click);
You also can also add modifier keys like that:
Shortcut.add(messageField, Key.ENTER, sendButton::click, Key.SHIFT);
I have a workflow that adds a button "Open Link" and a field on the record called "URL" that contains a hyperlink to an attachment in NetSuite. I want to add a workflow action script that opens this url in a different page. I have added the script and the workflow action to the workflow. My script:
function openURL() {
var url = nlapiGetFieldValue('custbody_url');
window.open(url);
}
I get this script error after clicking the button: "TypeError: Cannot find function open in object [object Object].
How can I change my script so it opens the URL in the field?
(This function works when I try it in the console)
Thanks!
Do you want it to work when the record is being viewed or edited? They have slightly different scripts. I'm going to assume you want the button to work when the record is being viewed, but I'll write it so it works even when the document is being edited as well.
The hard part about the way Netsuite has set it up is that it requires two scripts, a user event script, and a client script. The way #michoel suggests may work too... I've never inserted the script by text before personally though.
I'll try that sometime today perhaps.
Here's a user event you could use (haven't tested it myself though, so you should run it through a test before deploying it to everyone).
function userEvent_beforeLoad(type, form, request)
{
/*
Add the specified client script to the document that is being shown
It looks it up by id, so you'll want to make sure the id is correct
*/
form.setScript("customscript_my_client_script");
/*
Add a button to the page which calls the openURL() method from a client script
*/
form.addButton("custpage_open_url", "Open URL", "openURL()");
}
Use this as the Suitescript file for a User Event script. Set the Before Load function in the Script Page to userEvent_beforeLoad. Make sure to deploy it to the record you want it to run on.
Here's the client script to go with it.
function openURL()
{
/*
nlapiGetFieldValue() gets the url client side in a changeable field, which nlapiLookupField (which looks it up server side) can't do
if your url is hidden/unchanging or you only care about view mode, you can just get rid of the below and use nlapiLookupField() instead
*/
var url = nlapiGetFieldValue('custbody_url');
/*
nlapiGetFieldValue() doesn't work in view mode (it returns null), so we need to use nlapiLookupField() instead
if you only care about edit mode, you don't need to use nlapiLookupField so you can ignore this
*/
if(url == null)
{
var myType = nlapiGetRecordType();
var myId = nlapiGetRecordId();
url = nlapiLookupField(myType, myId,'custbody_url');
}
//opening up the url
window.open(url);
}
Add it as a Client Script, but don't make any deployments (the User Event Script will attach it to the form for you). Make sure this script has the id customscript_my_client_script (or whatever script id you used in the user event script in form.setScript()) or else this won't work.
Another thing to keep in mind is that each record can only have one script appended to it using form.setScript() (I think?) so you may want to title the user event script and client script something related to the form you are deploying it on. Using form.setScript is equivalent to setting the script value when you are in the Customize Form menu.
If you can get #michoel's answer working, that may end up being better because you're keeping the logic all in one script which (from my point of view) makes it easier to manage your Suitescripts.
The problem you are running into is that Workflow Action Scripts execute on the server side, so you are not able to perform client side actions like opening up a new tab. I would suggest using a User Event Script which can "inject" client code into the button onclick function.
function beforeLoad(type, form) {
var script = "window.open(nlapiGetFieldValue('custbody_url'))";
form.addButton('custpage_custom_button', 'Open URL', script);
}
I am developing a jQuery Mobile website and am using the jQuery validation plugin to validate my forms. On some forms I have set data-ajax="false", but still wanted to show the loading spinner when the submit button is clicked.
To display the spinner I use the following code
// Display spinner
$(document).delegate('.ajaxSpinner', 'click', function () {
if($(".ajaxValidate").length == 0 || $(".ajaxValidate").valid()) { // Show spinner if no validation or form is valid
$.mobile.showPageLoadingMsg();
}
});
The form submit button has a class of 'ajaxSpinner', and the form itself has a class of 'ajaxValidate'.
On most forms this works great, if the form is invalid when submit is clicked you don't see the spinner, whereas if the form is valid, the spinner is displayed.
I have just one single form that isn't playing nice....the spinner shows regardless of whether the form is valid or not. The form is quite long, so I'm wondering if the validation hasn't completed before my manual display spinner code fires.
I'm not very proficient with jQuery so can anyone spot the flaw in my code?
Could it be a timing issue? If it is, is there a good way to make sure the validation has completed before the click function fires?
I think you need to call the spinner inside your validation function.
So, using the validation plugin, you may normally have something like this:
$(".ajaxValidate").validate({
submitHandler : function(form) {
// START YOUR SPINNER HERE
$.mobile.showPageLoadingMsg();
$(form).ajaxSubmit({
success: function() { // YOUR FORM WAS SUBMITTED SUCCESSFULLY
// DO SOMETHING WHEN THE FORM WAS SUBMITTED SCESSFULLY ...
// ...
// STOP THE SPINNER EVENTUALLY
//$.mobile.hidePageLoadingMsg()
}
});
}
});
Hope this helps. Let me know if this works for you.
I have two g:textfields
in the first one I should write a number lets say 12 and in the g:textfield next to it it should load the predetermined name for number 12.
The first one is named 'shipper' and the other 'shipperName'
Whenever I write the code 12 in the 'shipper' txtfield, it should return the name of the shipper in the 'shipperName' box.
Thanks in advance!
Examples:
If I write the number 12 it should return USPS
http://i53.tinypic.com/2i90mc.jpg
And every number should have a different 'shipperName'
Thanks again!
That's quite easy if you'll use jQuery. Check out the event handlers ("blur" is the one you want which occurs when the user leaves the numerical box).
For example:
$("#shipper").blur(function() {
$("#shipperName").load(
"${createLink(controller: 'shipper', action: 'resolveShipper')}?id=" +
$("#shipper").val()
);
});
The $(this).val() at the end is the value of the input field the user just left.
And the "ShipperController.resolveShipper" action would look something like this:
def resolveShipper = {
render text: Shipper.get(params.id).name, contentType: "text/plain"
}
There are other things you might want to do, like automatically filling in the shipperName field as the user types without leaving the edit field, probably after a delay. However the event handler stays the same, just the event is changing (from "blur" to "change" or something like this)
To relate two strings, it's easiest to use an object to create a dictionary/ map, as shown below;
$('#input1').bind('keyup',function() {
var map = {
"1":"One",
"2":"Fish",
"3":"Bar"
};
$('#input2').val(map[$(this).val()]);
});
You can see this in action here: http://www.jsfiddle.net/dCy6f/
If you want the second value only to update when the user has finished typing into the first input field, change "keyup" to "change".