JavaScript in PDF: TextField onAction Listener - javascript

How can I achieve an event-call in JavaScript by the PDF when you hit enter on a specific TextField? (alternatively: on every key stroke in that specific TextField)
I've tried
this.getField("field1").addEventListener('input', myMethod);
and
this.getField("field1").events.add(
{
onEveryEvent: function()
{
myMethod();
}
});
but they both do not work.

I found the solution (as described here):
First you have to set a partial name for the field with the PDField.setPartialName(String name)-method, for example myField.setPartialName("myField1");. Then you can access the field via JavaScript in the PDF.
Now use the setAction(..., ...)-method to set your action/event/listener. For example: this.getField("myField1").setAction("Validate", "myMethod()");
Please notice how the second argument is indeed a string and not a method. Also: "Validate" is not just a name and probably only one of many action/event-strings. Unfortunately I do not know what those other strings are. "Validate" is from the docs example and triggers (at least) when
the field loses focus and has changed value in the last focus
you change its value and press enter

Related

Why does React pre-populate input tags with the last keyboard input?

I have created a list of input tags wrapped in a div to produce an editable text list.
However, when I add a new element to this list by hitting Enter, the new empty element is automatically populated with the last keyboard input, instead of being blank.
Here is a link the JsBin describing the issue:
https://jsbin.com/kovipurace/edit?html,output
I am expecting an empty input instead.
Is there a way to implement the expected behaviour correctly?
I initially based my code off of the CommentForm in the react tutorial, but I have deliberately not used a form tag to give cleaner use of the hitting the Enter key (don't want to mess around with e.preventDefault() etc.) I have also put in additional functionality in the actual version to allow updating existing values using an onBlur event.
What I have tried:
I have (correctly, hopefully!) implemented controlled components as stated in the docs.
I have experimented with using defaultValue and instead of value but the effect is the same. In both cases I am using {this.props.value}
You create new textentries with textEntry text.
keyHasBeenPressed : function(e) {
if (e.keyCode == 13) {
var textEntry = this.refs.textEntry.value;
this.props.createEntry(textEntry);
}
},
All you need is to make the args of createEntry blank.
this.props.createEntry();
https://jsbin.com/daqura/1/edit?html,output
I found help on #reactjs IRC channel and commenters here.
In the keyHasBeenPressed function, the state needs to be set explicitly again, as it is in handleChange.
getInitialState is just used to intialize state once in a component's life cycle.

Unexpected JS behavior when clearing input field value - STCombobox

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('');

How to disable Sharepoint textbox?

I am trying to disable a textbox in SharePoint WSS3 and force a specific value (given by another JavaScript function) but I can't seem to find the right way of doing it. I have come across different issues. Let's say I have a normal single line text value named prova and another one named Description. Description is required, prova is not.
First Issue: If the field IS required, even if there is something in the textbox, SharePoint says otherwise and does not allow me to insert the entry.
$(document).ready(function(){
//var value = someFunction(...);
var value = "test";
$("input[title='Description']").attr("disabled", "disabled");
$("input[title='Description']").val(value);
});
Second Issue: If the field IS NOT required SharePoint doesn't say anything but it inserts a blank value instead of the one given.
$(document).ready(function(){
//var value = someFunction(...);
var value = "test";
$("input[title='prova']").attr("disabled", "disabled");
$("input[title='prova']").val(value);
});
I have a feeling that tells me that there is some kind of SharePoint JavaScript function somewhere that listens for KeyUp or something. I have really no idea what to do now...
EDIT: It looks like the problem is related to disabling the textbox, if I comment the line where I disable the textbox it works in both scenarios. Maybe if I catch the insert request I can re-enable the textbox before SharePoint do the actual post. No idea how to do it though...
Your problem really is related to disabling the textbox first. By default disabled textboxes are not contained in the POST request in IE.
See this post: Disabled form inputs do not appear in the request or this one: how to save data by disabled text box?
What you actually want to do is set the readonly attribute of the field, not disable it (readonly="readonly"). The problem with that is that the readonly state sometimes looks the same as the default state, so you also have to add some CSS to make it look greyed out.

html input field "value id" combination

I am trying to understand what exactly the combination
... value id= ...
in
<input type="text" name="session_key" value id="session-key-login">
does. Note, that the value is immediately followed by id.
My problem is whenever such a combination occurs in an input field (for example in Facebook login page "email or phone" field (only) and everywhere in the LinkedIn login page), the
document.getElementById(..).focus()
method fails. I am sure the "value id" combination does something non-trivial, since Facebook uses it only for one field, while all other fields come without that empty value field preceeding id.
Thanks in advance.
They are two totally different attributes. Note that attributes are separated by spaces, so even when specified with no = afterwards, as in your example, it's a distinct attribute, and not combined with the following one.
value defines the value of the input (the value that will be prefilled when the page is rendered). If left empty (as in your example), it does nothing. If you did, say, value="hi", however, the text box would be prefilled with "hi"
id specifies the unique identifying name of the input. It is used to access the element in the DOM, using JavaScript, e.g. document.getElementById('session-key-login')
I think I found the answer to my focus() problem.
What I found was on a page, invoking focus() once focuses on the required element. However, a second invocation on the same element fails, unless one make the page lose the previous focus explicitly, for e.g. by invoking the blur() method on the same element.
I might be wrong, but my guess is that Facebook focuses on the "email" field implicitly/automatically on load and thus my second focus does not do anything. Though it works on other fields.
So, explanation by Steven Moseley holds tight :)
Thanks,
Nikhil

Grab text input as the user types

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/

Categories

Resources