Jquery validation on div content - javascript

I am extending the functionality of a Business Intelligence tool. This is a web based application. Currently attempting to create some type of "form" validation. The strange thing is that this application reuses the same input for every single one of the form inputs. Once the user clicks away from the input html object, some javascript moves the value entered into the input into the text within a div.
Before:
<div>
</div>
Input filled out:
<input type="text" value="this is a test">
Result:
<div>
this is a test>
</div>
Is there any way to create a listener which will validate what is written inside of the div?

try this
<input type="text" value="this is a test"/>
instead of
<input type=text value=this is a test></input>
hope this helps...

Related

How to send a pre-defined text of a <form> element into action page, without having the user to type

As you know, the <input type="text" name = "input_field"> element creates a space for the user to type in an HTML form. But in this case, I know what the user is going to enter.
For instance, the user wants to send 'hello' to the action page. It isn't a particular piece of information like his/her name, email id, etc. It will be the same for everyone. Then why not just create a button like this:
<input type="submit" value="click to send 'hello'">
When the user will click on the button, 'hello' will be sent to the action page specified in the action attribute of the <form> element.
How do I do it? Also, I need to mention that I am not much experienced in HTML or JS, so I would appreciate a beginner-like solution.
I apologize if this question already exists somewhere.
Thanks in advance!
You can include predefined information when submitting a form by using a type="hidden" field:
<input type="hidden" name="input_field" value="hello">
That doesn't appear visibly on the page, but is submitted just like any other field when you submit the form.
As far as I understand your problem, you want to create a form where few fields will have predefined information
I would suggest not to hide the input according to the UI/UX perspective but instead, you can show those fields as read-only.
In this way, the user will have an idea of predefined values
<form action="/action_page.php">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<input type="number" disabled readonly id="custId" name="custId" value="3487">
<input type="submit" value="Submit">
</form>

highlight text input upon accesskey

I have an HTML page with a text input field for a search string. I would like to give focus to the field when the user hits a predefined key (like META-S).
A similar behaviour is possible for anchors in HTML 5:
CSS3
I am wondering if there is a more specific solution than to have a JS function listening to all key presses and filtering for the correct one.
You should already be using <label /> for all your form inputs (for accessibility purposes) .. <label /> can have the accesskey attribute.
Example:
<label for="search" accesskey="s">Search:</label><br />
<input type="text" id="search" width="100" />

Binding a jAlert popup content to html content

I'm attempting to use jAlert to show a popup dialog with an input box. When clicking "OK" I want to grab the value from this input box to send to the server. I'm using jQuery to pull the content off a div which includes the input field. Problem is that when I use jQuery to try and get the contents of that input field, it doesn't work - it comes back as empty.
HTML as follows:
<div id="test">
<input type="text" id="def" />
</div>
JS as follows:
$.jAlert({ 'content' : $("#test").html()});
...and to try and access using jQuery...
$("#def").val();
I can get around it by force updating the field using a keyup listener, but it seems really clunky...
<input type="text" id="def" onkeyup="$('#def').val($(this).val())" />
After doing this I can access the content of the 'def' field. Is there a more elegant solution?

Disable entire form elements with respect to a state. React

I am disabling the inputs using the isFetching prop,
but this is getting reduntant as I have to keep this in every input field.
Is there a way to disable the entire form?
Like a disable property in <form> tag or something?
<form>
<input type="text" disabled={this.props.isFetching} />
<input type="text" disabled={this.props.isFetching} />
</form>
I think this should solve your problem https://stackoverflow.com/a/17186342/3298693.
You should insert your form inside an element <fieldset disabled="disabled">. This will make the whole form disabled.
I had the same issue and this worked for me:
<fieldset disabled={true}>
Where true would be some "prop.setting"...
Just use <input type="text" disabled> wherever you want the input text to be disabled. It hardly takes some time.

Umbraco add linked from page #nodename as text input value on form

How can I add the linked from page #nodename as a text input value on my form?
The input will disabled, so that the user cannot change the text.
<input type="text" name="jobtitle" id="jobtitle" value="Job Title to be Prefilled here by linked from page #nodeName - Disabled field" disabled="disabled" />
I assume this is razor? Try #Model.Name instead.

Categories

Resources