I have an input field of type = "text". At the time of entering the details into the input, I can enter a long input. The value is getting stored appropriately in DB as well. After clicking on a submit button, I am disabling the field.
So input is still visible but with only the value (noneditable). The problem arises here as only the length of text box input is being displayed.
Is there any way in which the entire input will be displayed?
One way to do this is instead of disabling the input box, you just remove the onChange event on the inout field and style the text to look like its disabled. if onChange event is something like this:
onChange={() => ()}
It won't be able to change the value of the input field, as it has an anonymous function.
That's one of way of doing it.
Related
I usualy don't work with HTML, however I have a input textbox where a number can be enterd but I need the value to be in milimeters. Is it possible to have a textbox input field where the user can type in a value and the textbox will always show whatever number is typed in the textbox and mm apears after the number even as it is typed...
So as example the user enters the textbox types in 1000 and when they leave that textbox the text changes automatically from 1000 to 1000mm?
I am using number format internationalization for input field.
e.g.my input field will take input values as 12,555.8 but when I submit form, I want to use value 12555.8 without comma.
I am using library react-number-format which is taking care of both the formats.
My question is how can I attach the 12555.8 number without comma to input field so that when I submit form, I can use that value?
<NumberFormat
thousandSeparator={this.props.thousandSeparator}
decimalSeparator={this.props.decimalSeparator}
value={this.state.formattedValue}
valOriginal={this.modifiedInputValue}
onKeyUp={(event) => {this.onKeyUpFormatted(event)}}
onValueChange={(values) => {
const {formattedValue, floatValue} = values;
this.modifiedInputValue = isNaN(floatValue)?'':floatValue;
this.setState({formattedValue});
}}
/>
I tried this code and while form submit tried to capture non formatted value like following
event.target.elements.valOriginal
I added property as data-valOriginal for React element. After this, we can access this value as element.dataset.valOriginal during submit form event.
I am using library react-number-format which is taking care of both the formats. My question is how can I attach the 12555.8 number without comma to input field so that when I submit form, I can use that value?
You do NOT want to attach the value of 12555.8 without the comma to the input field. Whenever you modify the "value" of an input field, you will be changing what is displayed for the user.
Instead, the solution is to do all data-modification outside of the form, right before it is submitted.
So on your form, you'll want to have an "onSubmit" handler, and in your react component, you'll define:
onSubmitHandler = (formData) => {
let cleanFormData = {...formData}
cleanFormData.myNumberInput = cleaningFunction(cleanFormData.myNumberInput)
//submit cleanFormData to server
}
AKA, if I have two fields (one radio button group and one textarea that only appears if the "other" radio button is pressed) how would I make it so the input from the text area overrides the "other" button having it's value placed in the mailto?
E.g., I want this to happen:
field1=text from text area
NOT this:
field1=other
field2=text from text area
Could I set the value of the "other" radio button in field1 to the text coming from the text area?
Alternatively, could I do anything to prevent a certain field from appearing in the mailto fields?
In future, please ensure you present SO with a code issue, not a general question or request. However, you would use a JQuery change handler, like so:
$('#mastertextboxid').on('input', function(){ //executes every time master's text is updated
$('#slavetextboxid').value($('#mastertextboxid').text()); //updates the values
})
This will overwrite any text in the slave textbox when the master textbox is changed, but the User will still be able to input into the slave textbox. It's known as One way data binding.
I have a custom Visual Force page that on load has a name field that is supposed to have {Auto} printed inside the input text box that the user can delete or leave or not. I have been using a html-placeholder however the text just disappears and is gray.
My VF inputfield:
<apex:inputfield required="true"
value="{!EventPackageRevenueBreakdown__c.Name}" html-placeholder="{!Auto}"></apex:inputfield>
What it looks like with that code:
What I need it to look like (notice the cursor is after the closing scope)
Thanks in advance I'm still very new to this!
I suggest you to set Name field in controller with '{Auto}' value.
The placeholder attribute will disappear when there is a value in the field, what you want is to actually set the VALUE of the field to {Auto}.
Try this:
If you want it to automatically clear the field if a user clicks into it, you could add some javascript to handle that.
I have an unbound text box on my form which the admin can enter a date of when records were last updated. I want this date to be copied to a label after pushing a button so that it holds the date instead of it do disappear after closing the form.
does anyone know if this is possible and how it is possible?
For creating a variable that can be used AFTER the form is closed:
Create a new module (in code window, click 'Insert | Module'
Insert the variable name(s) and types you want available everywhere. i.e.
Global dtLastUpdated As Date
Global strSaveSomeName As String
Save the module as mdl_Globals
Add code wherever needed to set the variable, then can reference anywhere.
If for use during the form, use the following: where 'lblForUnbound' is the Label field and 'txtUnbound' is your unbound text box
Me.lblForUnbound.Caption = Me.txtUnbound.Text